imporve tab component style

bluebill1049 · bluebill1049 · commit 901f1b7085fc · 2023-06-11T21:57:38.000+10:00
diff --git a/src/components/TabGroup.module.css b/src/components/TabGroup.module.css
@@ -9,7 +9,6 @@
   padding: 5px 8px 5px;
   font-size: 12px;
   border: none;
-  border-top: 1px solid var(--color-secondary);
   transition: 0.3s all;
   text-transform: uppercase;
 }
@@ -23,6 +22,7 @@
 }
 
 .buttonTabGroup > button:disabled {
+  border-top: 1px solid var(--color-secondary);
   background: var(--color-primary);
   color: white;
   cursor: not-allowed;
diff --git a/src/components/TabGroup.tsx b/src/components/TabGroup.tsx
@@ -14,9 +14,7 @@ const TabGroup = ({ children, buttonLabels }) => {
           <button
             key={label}
             style={{
-              ...(currentIndex === index
-                ? { cursor: "default", borderTop: "1px solid transparent" }
-                : {}),
+              ...(currentIndex === index ? { cursor: "default" } : {}),
             }}
             disabled={currentIndex === index}
             onClick={() => setIndex(currentIndex)}

Original file line number	Diff line number	Diff line change
`@@ -9,7 +9,6 @@`
`9`	`9`	`padding: 5px 8px 5px;`
`10`	`10`	`font-size: 12px;`
`11`	`11`	`border: none;`
`12`		`- border-top: 1px solid var(--color-secondary);`
`13`	`12`	`transition: 0.3s all;`
`14`	`13`	`text-transform: uppercase;`
`15`	`14`	`}`
`@@ -23,6 +22,7 @@`
`23`	`22`	`}`
`24`	`23`
`25`	`24`	`.buttonTabGroup > button:disabled {`
	`25`	`+ border-top: 1px solid var(--color-secondary);`
`26`	`26`	`background: var(--color-primary);`
`27`	`27`	`color: white;`
`28`	`28`	`cursor: not-allowed;`