studiokit-scaffolding-js 7.0.13 → 7.0.14-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/lib/css/components/_buttons.css +0 -8
  2. package/lib/css/components/_quill.css +3 -3
  3. package/lib/css/components/_tables.css +2 -3
  4. package/lib/css/utils/_focus.css +4 -0
  5. package/lib/css/variables.css +4 -0
  6. package/package.json +1 -1
package/lib/css/components/_buttons.css CHANGED
@@ -341,14 +341,6 @@ button.close > span {
341
341
  * Material UI Buttons
342
342
  */
343
343
 
344
- /* Hide bootstrap focus outline on Material buttons since they use their own highlight */
345
- .MuiButtonBase-root:focus,
346
- .MuiButtonBase-root:active,
347
- .MuiButtonBase-root:not(:disabled):not(.disabled):active,
348
- .MuiButtonBase-root:not(:disabled):not(.disabled):active:focus {
349
- outline: none;
350
- }
351
-
352
344
  /* Material UI icon spacing */
353
345
  .MuiButton-text .MuiButton-label .MuiSvgIcon-root {
354
346
  margin-right: 0.4rem;
package/lib/css/components/_quill.css CHANGED
@@ -291,14 +291,14 @@
291
291
  }
292
292
 
293
293
  .quill:focus-within {
294
- border-color: #80bdff;
295
- box-shadow: 0 0 0 0.2rem rgb(0 123 255 / 25%);
294
+ border-color: var(--color-focus-border);
295
+ box-shadow: 0 0 0 0.2rem var(--color-focus-outline);
296
296
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
297
297
  position: relative;
298
298
  z-index: 1;
299
299
 
300
300
  & .ql-container.ql-snow {
301
- border-color: #80bdff;
301
+ border-color: var(--color-focus-border);
302
302
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
303
303
  }
304
304
  }
package/lib/css/components/_tables.css CHANGED
@@ -176,10 +176,9 @@ th,
176
176
  box-shadow: none;
177
177
 
178
178
  &:focus {
179
- border-color: #80bdff;
179
+ border-color: var(--color-focus-border);
180
180
  outline: 0;
181
- -webkit-box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
182
- box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
181
+ box-shadow: 0 0 0 0.2rem var(--color-focus-outline);
183
182
  }
184
183
 
185
184
  &::placeholder {
package/lib/css/utils/_focus.css ADDED
@@ -0,0 +1,4 @@
1
+ /* global visible focus */
2
+ :focus-visible {
3
+ outline: 0.2rem solid var(--color-focus-outline);
4
+ }
package/lib/css/variables.css CHANGED
@@ -61,6 +61,10 @@
61
61
  --color-error: var(--color-red);
62
62
  --color-success: var(--color-green);
63
63
 
64
+ /* from Bootstrap's focus styling */
65
+ --color-focus-border: #80bdff;
66
+ --color-focus-outline: rgb(0 123 255 / 25%);
67
+
64
68
  /* Border Radius */
65
69
  --border-radius: 3px;
66
70
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "studiokit-scaffolding-js",
3
- "version": "7.0.13",
3
+ "version": "7.0.14-alpha.1",
4
4
  "description": "Common scaffolding for Studio apps at Purdue",
5
5
  "repository": "https://gitlab.com/purdue-informatics/studiokit/studiokit-scaffolding-js",
6
6
  "license": "MIT",