Use headlessui description without nesting; update PR template

SU-SWS · Dec 10, 2024 · 6fd2aab · 6fd2aab
1 parent 48d6a79
commit 6fd2aab
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 5 deletions.
diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md
@@ -20,7 +20,7 @@
 3. Verify...
 
 # Associated Issues and/or People
-- JIRA ticket(s) - GIVCAMP-
+- JIRA ticket(s) - DS-
 - Other PRs
 - Any other contextual information that might be helpful (e.g., description of a bug that this PR fixes, new functionality that it adds, etc.)
 - Anyone who should be notified? (`@mention` them here)
diff --git a/components/ChangemakerCard/ChangemakerCard.styles.ts b/components/ChangemakerCard/ChangemakerCard.styles.ts
@@ -47,5 +47,5 @@ export const modalIcon = 'text-white size-26';
 export const modalTextWrapper = 'rs-pr-4 rs-pb-6 w-[75ch] max-w-[100vw] md:max-w-full';
 export const modalHeader = 'rs-mb-3 border-l-[1.2rem] md:border-l-[1.8rem] border-digital-red-light';
 export const modalHeading = 'mb-02em leading-tight ml-22 md:ml-40 2xl:ml-43 type-3 font-serif';
-export const modalSubhead = 'ml-22 md:ml-40 2xl:ml-43';
+export const modalSubhead = 'block font-semibold big-paragraph leading-tight ml-22 md:ml-40 2xl:ml-43';
 export const nestedBloksWrapper = 'rs-pl-4';
diff --git a/components/ChangemakerCard/ChangemakerCard.tsx b/components/ChangemakerCard/ChangemakerCard.tsx
@@ -181,12 +181,12 @@ export const ChangemakerCard = ({
                     />
                   </button>
                   <div className={styles.modalTextWrapper}>
-                    <div className={styles.modalHeader}>
+                    <header className={styles.modalHeader}>
                       <DialogTitle className={styles.modalHeading}>{heading}</DialogTitle>
                       {subheading &&
-                        <Description className={styles.modalSubhead}>{subheading}</Description>
+                        <Description as="span" className={styles.modalSubhead}>{subheading}</Description>
                       }
-                    </div>
+                    </header>
                     <div className={styles.nestedBloksWrapper}>{children}</div>
                   </div>
                 </div>