feat: add subtitle 3-5 typography variants

acid-info · Sep 22, 2023 · a7bfa14 · a7bfa14
1 parent 0d6cc88
commit a7bfa14
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 2 deletions.
diff --git a/packages/lsd-react/src/components/Theme/baseTheme.ts b/packages/lsd-react/src/components/Theme/baseTheme.ts
@@ -23,6 +23,9 @@ export const baseTheme: Theme = {
         label2: {},
         subtitle1: {},
         subtitle2: {},
+        subtitle3: {},
+        subtitle4: {},
+        subtitle5: {},
       },
     },
     sm: {
@@ -40,6 +43,9 @@ export const baseTheme: Theme = {
         body2: {},
         body3: {},
         label1: {},
+        subtitle5: {},
+        subtitle4: {},
+        subtitle3: {},
         label2: {},
         subtitle1: {},
         subtitle2: {},
@@ -60,6 +66,9 @@ export const baseTheme: Theme = {
         body2: {},
         body3: {},
         label1: {},
+        subtitle5: {},
+        subtitle4: {},
+        subtitle3: {},
         label2: {},
         subtitle1: {},
         subtitle2: {},
@@ -80,13 +89,16 @@ export const baseTheme: Theme = {
         body2: {},
         body3: {},
         label1: {},
+        subtitle5: {},
+        subtitle4: {},
+        subtitle3: {},
         label2: {},
         subtitle1: {},
         subtitle2: {},
       },
     },
     xl: {
-      width: 1200,
+      width: 1205,
       typography: {
         display1: {},
         display2: {},
@@ -100,6 +112,9 @@ export const baseTheme: Theme = {
         body2: {},
         body3: {},
         label1: {},
+        subtitle5: {},
+        subtitle4: {},
+        subtitle3: {},
         label2: {},
         subtitle1: {},
         subtitle2: {},
@@ -123,12 +138,31 @@ export const baseTheme: Theme = {
     h4: { fontSize: '1.75rem', fontWeight: 'normal', lineHeight: '2.25rem' },
     h5: { fontSize: '1.5rem', fontWeight: 'normal', lineHeight: '2rem' },
     h6: { fontSize: '1.375rem', fontWeight: 'normal', lineHeight: '1.75rem' },
-    subtitle1: { fontSize: '1rem', fontWeight: 'normal', lineHeight: '1.5rem' },
+    subtitle1: {
+      fontSize: '1.25rem',
+      fontWeight: 'normal',
+      lineHeight: '1.625rem',
+    },
     subtitle2: {
+      fontSize: '1.125rem',
+      fontWeight: 'normal',
+      lineHeight: '1.5rem',
+    },
+    subtitle3: {
+      fontSize: '1rem',
+      fontWeight: 'normal',
+      lineHeight: '1.5rem',
+    },
+    subtitle4: {
       fontSize: '0.875rem',
       fontWeight: 'normal',
       lineHeight: '1.25rem',
     },
+    subtitle5: {
+      fontSize: '0.75rem',
+      fontWeight: 'normal',
+      lineHeight: '1rem',
+    },
     body1: { fontSize: '1rem', fontWeight: 'normal', lineHeight: '1.5rem' },
     body2: {
       fontSize: '0.875rem',

diff --git a/packages/lsd-react/src/components/Theme/types.ts b/packages/lsd-react/src/components/Theme/types.ts
@@ -15,6 +15,9 @@ export type TypographyVariants =
   | 'h6'
   | 'subtitle1'
   | 'subtitle2'
+  | 'subtitle3'
+  | 'subtitle4'
+  | 'subtitle5'
   | 'body1'
   | 'body2'
   | 'body3'