Fix line height and add new props

gameflow-tv · Jul 14, 2022 · 338aff2 · 338aff2
1 parent 9c25717
commit 338aff2
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 15 deletions.
diff --git a/src/lib/foundation/gameflow.ts b/src/lib/foundation/gameflow.ts
@@ -85,73 +85,73 @@ export const typography: Typography = {
   'header-xl': {
     fontSize: '2.25rem',
     fontWeight: '600',
-    lineHeight: '1.2px',
+    lineHeight: '1.2',
     fontFamily: 'Montserrat',
   },
   'header-lg': {
     fontSize: '1.5rem',
     fontWeight: '600',
-    lineHeight: '1.2px',
+    lineHeight: '1.2',
     fontFamily: 'Montserrat',
   },
   'header-md': {
     fontSize: '1.125rem',
     fontWeight: '600',
-    lineHeight: '1.2px',
+    lineHeight: '1.2',
     fontFamily: 'Montserrat',
   },
   'header-sm': {
     fontSize: '1rem',
     fontWeight: '600',
-    lineHeight: '1.2px',
+    lineHeight: '1.2',
     fontFamily: 'Montserrat',
   },
   'header-xs': {
     fontSize: '0.875rem',
     fontWeight: '600',
-    lineHeight: '1.2px',
+    lineHeight: '1.2',
     fontFamily: 'Montserrat',
   },
   'body-lg': {
     fontSize: '0.875rem',
     fontWeight: '500',
-    lineHeight: '1.3px',
-    fontFamily: 'Mulish',
+    lineHeight: '1.3',
+    fontFamily: 'Mulish, sans-serif, Helvetica',
   },
   'body-md': {
     fontSize: '0.75rem',
     fontWeight: '500',
-    lineHeight: '1.3px',
-    fontFamily: 'Mulish',
+    lineHeight: '1.3',
+    fontFamily: 'Mulish, sans-serif, Helvetica',
   },
   'body-sm': {
     fontSize: '0.625rem',
     fontWeight: '500',
-    lineHeight: '1.3px',
-    fontFamily: 'Mulish',
+    lineHeight: '1.3',
+    fontFamily: 'Mulish, sans-serif, Helvetica',
   },
   button: {
     fontSize: '0.875rem',
     fontWeight: '500',
-    lineHeight: '1.2px',
+    lineHeight: '1.2',
     fontFamily: 'Montserrat',
   },
   link: {
     fontSize: '0.875rem',
     fontWeight: '500',
-    lineHeight: '1.2px',
+    lineHeight: '1.2',
     fontFamily: 'Montserrat',
   },
   'label-md': {
     fontSize: '0.75rem',
     fontWeight: '500',
-    lineHeight: '1.0px',
+    lineHeight: '1.0',
     fontFamily: 'Montserrat',
   },
   'label-sm': {
     fontSize: '0.625rem',
     fontWeight: '500',
-    lineHeight: '1.0px',
+    lineHeight: '1.0',
     fontFamily: 'Montserrat',
   },
 }

diff --git a/src/lib/tailwind/config.ts b/src/lib/tailwind/config.ts
@@ -12,6 +12,7 @@ export const getConfig = (theme: Theme = gameflowTheme): Partial<TailwindConfig>
     animations: animation,
     screens,
     typography,
+    motion,
   } = theme
 
   const { fontSize, fontWeight, typographyComponents } = getTypographyConfig(typography)
@@ -31,6 +32,9 @@ export const getConfig = (theme: Theme = gameflowTheme): Partial<TailwindConfig>
         header: ['Montserrat', 'Helvetica'],
         body: ['Mulish', 'sans-serif'],
       },
+      transitionTimingFunction: {
+        default: motion.curve,
+      },
     },
     plugins: [
       plugin(({ addComponents }) => {