fix(button): quick margin fix

thelia · Jun 26, 2024 · 417c62f · 417c62f
1 parent 3a82211
commit 417c62f
Showing 1 changed file with 33 additions and 10 deletions.
diff --git a/components/Molecules/Button/button.css b/components/Molecules/Button/button.css
@@ -17,25 +17,38 @@
   cursor: pointer;
   text-decoration: none;
 
-  & > span.icon {
-    @apply w-5 h-5;
-    &-left {
-      margin-right: rem-convert(16px);
-    }
-    &-right {
-      margin-left: rem-convert(16px);
-    }
-  }
-
   &--xl {
     width: 100%;
+
+    & > span.icon {
+      @apply w-5 h-5;
+      &-left {
+        margin-right: rem-convert(16px);
+      }
+      &-right {
+        margin-left: rem-convert(16px);
+      }
+    }
   }
 
   &--large,
   &--xl {
     padding: 16px 24px;
   }
 
+  &--medium,
+  &--large {
+    & > span.icon {
+      @apply w-5 h-5;
+      &-left {
+        margin-right: rem-convert(8px);
+      }
+      &-right {
+        margin-left: rem-convert(8px);
+      }
+    }
+  }
+
   &--medium {
     padding: 8px 16px;
   }
@@ -46,6 +59,16 @@
     font-family: var(--font-family-button-small);
     font-weight: var(--font-weight-button-small);
     line-height: var(--line-height-button-small);
+
+    & > span.icon {
+      @apply w-4 h-4;
+      &-left {
+        margin-right: rem-convert(4px);
+      }
+      &-right {
+        margin-left: rem-convert(4px);
+      }
+    }
   }
 
   &--primary {