feat(button): changed size L (72 → 64), added size XL (72)

BREAKING CHANGE: size L changed to size XL
core-ds · Mar 2, 2021 · 051d964 · 051d964
1 parent 1a0a229
commit 051d964
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 2 deletions.
diff --git a/packages/button/src/Component.stories.mdx b/packages/button/src/Component.stories.mdx
@@ -10,7 +10,7 @@ import { Button } from './Component';
 import { name, version } from '../package.json';
 
 export const VIEWS = ['primary', 'secondary', 'outlined', 'filled', 'transparent', 'link', 'ghost'];
-export const SIZES = ['xs', 's', 'm', 'l'];
+export const SIZES = ['xs', 's', 'm', 'l', 'xl'];
 
 
 <Meta

diff --git a/packages/button/src/Component.tsx b/packages/button/src/Component.tsx
@@ -26,7 +26,7 @@ export type ComponentProps = {
     /**
      * Размер компонента
      */
-    size?: 'xs' | 's' | 'm' | 'l';
+    size?: 'xs' | 's' | 'm' | 'l' | 'xl';
 
     /**
      * Растягивает компонент на ширину контейнера

diff --git a/packages/button/src/index.module.css b/packages/button/src/index.module.css
@@ -128,6 +128,18 @@ a.loading {
 }
 
 .l {
+    min-width: 160px;
+    min-height: 64px;
+    padding: 0 var(--gap-2xl);
+    font-size: 18px;
+    line-height: 24px;
+
+    &.iconOnly {
+        min-width: 64px;
+    }
+}
+
+.xl {
     min-width: 160px;
     min-height: 72px;
     padding: 0 var(--gap-2xl);