feat(Button): add extraSmall size

varianter · Oct 31, 2024 · 19be082 · 19be082
1 parent 3a667ae
commit 19be082
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/src/components/buttons/Button.tsx b/src/components/buttons/Button.tsx
@@ -3,7 +3,7 @@ import React from "react";
 import styles from "./button.module.css";
 
 type ButtonType = "primary" | "secondary";
-type ButtonSize = "large" | "small";
+type ButtonSize = "large" | "small" | "extraSmall";
 
 interface IButton {
   size?: ButtonSize;
@@ -18,6 +18,7 @@ interface IButton {
 const sizeClassMap: { [key in ButtonSize]: string } = {
   large: styles.large,
   small: styles.small,
+  extraSmall: styles.extraSmall,
 };
 
 const typeClassMap: { [key in ButtonType]: string } = {

diff --git a/src/components/buttons/button.module.css b/src/components/buttons/button.module.css
@@ -37,6 +37,17 @@
   }
 }
 
+.extraSmall {
+  composes: button;
+  padding: 0.375rem 1.25rem;
+  font-size: 1rem;
+  font-weight: 400;
+
+  @media (min-width: 1024px) {
+    font-size: 1.125rem;
+  }
+}
+
 .primary {
   background: var(--primary-dark);
   color: var(--primary-white);