Zero left padding on first tab button

CDCgov · Oct 3, 2024 · 3b1ad2a · 3b1ad2a
1 parent 41c2c05
commit 3b1ad2a
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 4 deletions.
diff --git a/frontend/src/app/testResults/uploads/CsvSchemaDocumentation.tsx b/frontend/src/app/testResults/uploads/CsvSchemaDocumentation.tsx
@@ -178,19 +178,21 @@ interface SectionTabButtonProps {
   setTabSectionState: React.Dispatch<
     React.SetStateAction<Record<string, string>>
   >;
+  index: number;
 }
 
 const SectionTabButton = ({
   selected,
   parentSection,
   tabSection,
   setTabSectionState,
+  index,
 }: SectionTabButtonProps) => {
   return (
     <div
       className={`usa-nav__secondary-item padding-right-1 ${
         selected ? "usa-current" : ""
-      }`}
+      } ${index === 0 ? "padding-left-0" : ""}`}
       key={`${parentSection.slug}-${tabSection.slug}-tabpanel-item`}
     >
       <button
@@ -463,7 +465,7 @@ const CsvSchemaDocumentation: React.FC<CsvSchemaDocumentationProps> = ({
                         aria-owns={tabIds}
                         className="usa-nav__secondary-links prime-nav csv-section-tablist"
                       >
-                        {section.tabs.map((tabSection) => {
+                        {section.tabs.map((tabSection, index) => {
                           return (
                             <SectionTabButton
                               selected={
@@ -473,6 +475,7 @@ const CsvSchemaDocumentation: React.FC<CsvSchemaDocumentationProps> = ({
                               parentSection={section}
                               tabSection={tabSection}
                               setTabSectionState={setTabSectionState}
+                              index={index}
                             />
                           );
                         })}

diff --git a/frontend/src/app/testResults/uploads/__snapshots__/CsvSchemaDocumentation.test.tsx.snap b/frontend/src/app/testResults/uploads/__snapshots__/CsvSchemaDocumentation.test.tsx.snap
@@ -4838,7 +4838,7 @@ exports[`CsvSchemaDocumentation tests CsvSchemaDocumentation matches snapshot 1`
               role="tablist"
             >
               <div
-                class="usa-nav__secondary-item padding-right-1 usa-current"
+                class="usa-nav__secondary-item padding-right-1 usa-current padding-left-0"
               >
                 <button
                   aria-selected="true"
@@ -4850,7 +4850,7 @@ exports[`CsvSchemaDocumentation tests CsvSchemaDocumentation matches snapshot 1`
                 </button>
               </div>
               <div
-                class="usa-nav__secondary-item padding-right-1 "
+                class="usa-nav__secondary-item padding-right-1  "
               >
                 <button
                   aria-selected="false"