Stiling

components/ui/Text/Text.module.css

@@ -9,3 +9,7 @@
 .pageHeading {
   @apply pt-1 pb-4 text-2xl leading-7 font-bold text-base tracking-wide;
 }
+
+.sectionHeading {
+  @apply pt-1 pb-4 text-base leading-7 text-base tracking-wide uppercase border-b border-accents-2;
+}

components/ui/Text/Text.tsx

@@ -13,7 +13,7 @@ interface Props {
   children: React.ReactNode | any
 }
 
-type Variant = 'heading' | 'body' | 'pageHeading'
+type Variant = 'heading' | 'body' | 'pageHeading' | 'sectionHeading'
 
 const Text: FunctionComponent<Props> = ({
   style,
@@ -27,6 +27,7 @@ const Text: FunctionComponent<Props> = ({
     body: 'p',
     heading: 'h1',
     pageHeading: 'h1',
+    sectionHeading: 'h2',
   }
 
   const Component:
@@ -43,6 +44,7 @@ const Text: FunctionComponent<Props> = ({
           [s.body]: variant === 'body',
           [s.heading]: variant === 'heading',
           [s.pageHeading]: variant === 'pageHeading',
+          [s.sectionHeading]: variant === 'sectionHeading',
         },
         className
       )}