瀏覽代碼

store offset sizes in variables

Artur Paikin 6 年之前
父節點
當前提交
8df497fff5

+ 2 - 2
packages/@uppy/core/src/_common.scss

@@ -19,8 +19,8 @@
 // }
 // }
 
 
 .uppy-Root *:focus {
 .uppy-Root *:focus {
-  outline: 2px solid $color-cornflower-blue;
-  outline-offset: 3px;
+  outline: $size-focus-outline solid $color-cornflower-blue;
+  outline-offset: $size-focus-offset;
 }
 }
 
 
 // https://blog.prototypr.io/align-svg-icons-to-text-and-say-goodbye-to-font-icons-d44b3d7b26b4
 // https://blog.prototypr.io/align-svg-icons-to-text-and-say-goodbye-to-font-icons-d44b3d7b26b4

+ 6 - 0
packages/@uppy/core/src/_variables.scss

@@ -1,6 +1,7 @@
 // Fonts
 // Fonts
 $font-family-base: system-ui, -apple-system, BLinkMacSystemFont, Segoe UI, Roboto,
 $font-family-base: system-ui, -apple-system, BLinkMacSystemFont, Segoe UI, Roboto,
                    Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif !default;
                    Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif !default;
+
 // Colors
 // Colors
 
 
 $color-black: #000 !default;
 $color-black: #000 !default;
@@ -17,6 +18,11 @@ $color-asphalt-gray: #525252 !default;
 
 
 $color-uppy-pink: #EB2177;
 $color-uppy-pink: #EB2177;
 
 
+// Sizes
+
+$size-focus-outline: 2px;
+$size-focus-offset: 3px;
+
 // Z-index
 // Z-index
 
 
 $zIndex-negative: -1000 !default;
 $zIndex-negative: -1000 !default;

+ 3 - 0
packages/@uppy/dashboard/src/style.scss

@@ -289,6 +289,9 @@
 
 
   .uppy-DashboardTab-btn:focus {
   .uppy-DashboardTab-btn:focus {
     outline-offset: 0;
     outline-offset: 0;
+    .uppy-size--md & {
+      outline-offset: $size-focus-offset;
+    }
   }
   }
 
 
   .uppy-DashboardTab-btn svg {
   .uppy-DashboardTab-btn svg {