@codezee/sixtify-brahma 0.2.164 → 0.2.167

package/packages/shared-components/dist/utils/theme/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/utils/theme/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,WAAW,EAChB,KAAK,YAAY,EAClB,MAAM,eAAe,CAAC;AAGvB,OAAO,SAAS,CAAC;AAGjB,eAAO,MAAM,KAAK;;;CAGR,CAAC;AAEX,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,KAAK,CAAC;AAE9C,eAAO,MAAM,iBAAiB,GAAI,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;CAKjD,CAAC;AAEH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,WAAW,GAAG,YAAY,CAkSzD"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/utils/theme/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,WAAW,EAChB,KAAK,YAAY,EAClB,MAAM,eAAe,CAAC;AAGvB,OAAO,SAAS,CAAC;AAGjB,eAAO,MAAM,KAAK;;;CAGR,CAAC;AAEX,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,KAAK,CAAC;AAE9C,eAAO,MAAM,iBAAiB,GAAI,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;CAKjD,CAAC;AAqBH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,WAAW,GAAG,YAAY,CAqVzD"}

package/packages/shared-components/dist/utils/theme/theme.js

@@ -18,8 +18,27 @@ const getPaletteByTheme = (mode) => ({
     },
 });
 exports.getPaletteByTheme = getPaletteByTheme;
+const DESIGN_TOKENS = {
+    button: {
+        height: {
+            small: "32px",
+            medium: "36px",
+            large: "40px",
+        },
+        padding: {
+            small: "6px 12px",
+            medium: "8px 16px",
+            large: "10px 20px",
+        },
+        fontSize: "13px",
+        fontWeight: 500,
+        borderRadius: "6px",
+        minWidth: "80px",
+    },
+};
 function appTheme(theme) {
     const { palette } = (0, exports.getPaletteByTheme)(theme);
+    const { borderRadius, fontSize, fontWeight, minWidth, padding, height } = DESIGN_TOKENS.button;
     return {
         palette,
         typography: typography_1.typographyThemeOptions,
@@ -51,19 +70,65 @@ function appTheme(theme) {
                 styleOverrides: {
                     root: {
                         textTransform: "none",
-                        borderRadius: "4px",
-                        fontSize: "15px",
+                        borderRadius,
+                        fontSize,
+                        fontWeight,
+                        minWidth,
+                        padding: padding.medium,
+                        lineHeight: 1.5,
+                        transition: "all 0.2s ease-in-out",
+                        "&:hover": {
+                            boxShadow: `0 2px 4px ${palette.app.color.mirage[800]}`,
+                        },
+                        "&:active": {
+                            transform: "scale(0.98)",
+                        },
+                    },
+                    sizeSmall: {
+                        height: height.small,
+                        padding: padding.small,
+                    },
+                    sizeMedium: {
+                        height: height.medium,
+                        padding: padding.medium,
+                    },
+                    sizeLarge: {
+                        height: height.large,
+                        padding: padding.large,
                     },
                 },
                 defaultProps: {
                     variant: "contained",
                     color: "secondary",
+                    size: "medium",
                 },
                 variants: [
                     {
                         props: { variant: "contained" },
                         style: {
                             color: palette.app.color.iron[600],
+                            boxShadow: "none",
+                            "&:hover": {
+                                boxShadow: `0 2px 6px ${palette.app.color.mirage[800]}`,
+                            },
+                        },
+                    },
+                    {
+                        props: { variant: "outlined" },
+                        style: {
+                            borderWidth: "1px",
+                            "&:hover": {
+                                borderWidth: "1px",
+                            },
+                        },
+                    },
+                    {
+                        props: { variant: "text" },
+                        style: {
+                            padding: padding.medium,
+                            "&:hover": {
+                                backgroundColor: palette.app.color.butterflyBlue[500],
+                            },
                         },
                     },
                 ],
@@ -125,6 +190,7 @@ function appTheme(theme) {
                         marginLeft: "unset",
                         color: palette.app.color.iron[400],
                         fontWeight: 500,
+                        fontSize: "13px",
                     },
                 },
             },
@@ -175,6 +241,7 @@ function appTheme(theme) {
                     root: {
                         "& .MuiButtonBase-root": {
                             minHeight: "48px",
+                            fontSize: "13px",
                         },
                         "& .MuiTabs-scrollButtons.Mui-disabled": {
                             display: "none",

package/packages/shared-components/dist/utils/theme/typography.js

@@ -7,48 +7,48 @@ exports.typographyFontStyleOptions = {
 };
 exports.typographyOptions = {
     h1: {
-        fontSize: "clamp(2.5rem, 5vw, 6rem)",
-        lineHeight: "clamp(3rem, 6vw, 7rem)",
+        fontSize: "clamp(1.625rem, 4vw, 2.375rem)",
+        lineHeight: "clamp(2.125rem, 5vw, 2.875rem)",
     },
     h2: {
-        fontSize: "clamp(2rem, 4vw, 3.75rem)",
-        lineHeight: "clamp(2.5rem, 5vw, 4.5rem)",
+        fontSize: "clamp(1.375rem, 3.5vw, 1.875rem)",
+        lineHeight: "clamp(1.75rem, 4.5vw, 2.375rem)",
     },
     h3: {
-        fontSize: "clamp(1.75rem, 3.5vw, 3rem)",
-        lineHeight: "clamp(2.25rem, 4vw, 3.5rem)",
+        fontSize: "clamp(1.125rem, 3vw, 1.625rem)",
+        lineHeight: "clamp(1.5rem, 3.75vw, 2rem)",
     },
     h4: {
-        fontSize: "clamp(1.5rem, 3vw, 2.25rem)",
-        lineHeight: "clamp(1.75rem, 3.5vw, 2.625rem)",
+        fontSize: "clamp(1rem, 2.5vw, 1.375rem)",
+        lineHeight: "clamp(1.375rem, 3vw, 1.75rem)",
     },
     h5: {
-        fontSize: "clamp(1.25rem, 2.5vw, 1.5rem)",
-        lineHeight: "clamp(1.5rem, 3vw, 1.5rem)",
+        fontSize: "clamp(0.875rem, 2vw, 1.125rem)",
+        lineHeight: "clamp(1.25rem, 2.5vw, 1.5rem)",
     },
     h6: {
-        fontSize: "clamp(1.125rem, 2vw, 1.25rem)",
-        lineHeight: "clamp(1.5rem, 2.5vw, 1.5rem)",
+        fontSize: "clamp(0.8125rem, 1.75vw, 1rem)",
+        lineHeight: "clamp(1.25rem, 2.25vw, 1.375rem)",
     },
     subtitle1: {
-        fontSize: "clamp(1rem, 1.5vw, 1.125rem)",
-        lineHeight: "clamp(1.5rem, 2vw, 1.5rem)",
+        fontSize: "clamp(0.75rem, 1.3vw, 0.875rem)",
+        lineHeight: "clamp(1.1875rem, 1.8vw, 1.3125rem)",
     },
     subtitle2: {
-        fontSize: "clamp(0.875rem, 1.2vw, 0.875rem)",
-        lineHeight: "clamp(1.25rem, 2vw, 1.5rem)",
+        fontSize: "clamp(0.6875rem, 1.1vw, 0.75rem)",
+        lineHeight: "clamp(1.0625rem, 1.6vw, 1.1875rem)",
     },
     body1: {
-        fontSize: "clamp(0.875rem, 1.2vw, 1rem)",
-        lineHeight: "clamp(1.25rem, 2vw, 1.5rem)",
+        fontSize: "clamp(0.8125rem, 1.2vw, 0.8125rem)",
+        lineHeight: "clamp(1.3125rem, 1.8vw, 1.3125rem)",
     },
     body2: {
-        fontSize: "clamp(0.75rem, 1vw, 0.875rem)",
-        lineHeight: "clamp(1rem, 1.5vw, 1.25rem)",
+        fontSize: "clamp(0.6875rem, 1vw, 0.75rem)",
+        lineHeight: "clamp(1.0625rem, 1.5vw, 1.1875rem)",
     },
     caption: {
-        fontSize: "clamp(0.625rem, 0.8vw, 0.75rem)",
-        lineHeight: "clamp(0.875rem, 1vw, 1rem)",
+        fontSize: "clamp(0.5625rem, 0.85vw, 0.625rem)",
+        lineHeight: "clamp(0.8125rem, 1.1vw, 0.9375rem)",
     },
 };
 exports.typographyVariantMapping = {