Parcourir la source

Add paddings and remove outline-offset for tab buttons so that the outline is visible

Artur Paikin il y a 6 ans
Parent
commit
26037ac145
1 fichiers modifiés avec 10 ajouts et 2 suppressions
  1. 10 2
      packages/@uppy/dashboard/src/style.scss

+ 10 - 2
packages/@uppy/dashboard/src/style.scss

@@ -232,6 +232,7 @@
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
   margin-top: 10px;
+  padding: 2px 0;
 
   .uppy-size--md & {
     flex-direction: row;
@@ -240,6 +241,7 @@
     max-width: 600px;
     overflow-x: initial;
     margin-top: 30px;
+    padding-top: 0;
   }
 }
 
@@ -248,11 +250,13 @@
   display: inline-block;
   text-align: center;
   border-bottom: 1px solid rgba($color-gray, 0.2);
+  padding: 0px 2px;
 
   .uppy-size--md & {
     width: initial;
     margin-bottom: 20px;
     border-bottom: initial;
+    padding: 0;
   }
 }
 
@@ -268,11 +272,11 @@
   display: flex;
   flex-direction: row;
   align-items: center;
-  padding: 14px 20px;
+  padding: 12px 20px;
   line-height: 1;
 
   .uppy-size--md & {
-    width: 90px;
+    width: 80px;
     margin: 0 5px;
     flex-direction: column;
     padding: 0;
@@ -283,6 +287,10 @@
     color: $color-cornflower-blue;
   }
 
+  .uppy-DashboardTab-btn:focus {
+    outline-offset: 0;
+  }
+
   .uppy-DashboardTab-btn svg {
     margin-right: 10px;