Merge pull request #2023 from trilitech/fix-ui-bugs

Fix UI bugs
trilitech · Oct 16, 2024 · 7efd3aa · 7efd3aa · github-actions · Oct 16, 2024
2 parents f726bde + 19e7c94
commit 7efd3aa
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 4 deletions.
diff --git a/apps/web/src/components/MnemonicWord/MnemonicWord.tsx b/apps/web/src/components/MnemonicWord/MnemonicWord.tsx
@@ -20,7 +20,7 @@ export const MnemonicWord = ({ index, word, autocompleteProps, ...props }: Mnemo
         zIndex={1}
         marginTop={{ md: "11px", base: "8px" }}
         marginLeft={{ md: "16px", base: "10px" }}
-        color={color("300")}
+        color={color("900")}
         textAlign="right"
         size={{ md: "lg", base: "xs" }}
       >

diff --git a/apps/web/src/components/Onboarding/ImportWallet/SeedPhraseTab.tsx b/apps/web/src/components/Onboarding/ImportWallet/SeedPhraseTab.tsx
@@ -94,12 +94,19 @@ export const SeedPhraseTab = () => {
         <Flex flexDirection="column" gap="30px">
           <Accordion allowToggle>
             <AccordionItem>
-              <AccordionButton justifyContent="center" gap="10px" color={color("900")}>
+              <AccordionButton
+                justifyContent="center"
+                gap="10px"
+                color={color("900")}
+                borderBottom="1px solid"
+                borderBottomColor={color("300")}
+                _expanded={{ borderBottomColor: "transparent" }}
+              >
                 <Heading size="md">{mnemonicSize} word seed phrase</Heading>
                 <AccordionIcon />
               </AccordionButton>
 
-              <AccordionPanel>
+              <AccordionPanel borderBottom="1px solid" borderBottomColor={color("300")}>
                 <Flex gap="8px">
                   <RadioButtons
                     inputName="mnemonicSize"

diff --git a/apps/web/src/components/TabSwitch/TabSwitch.tsx b/apps/web/src/components/TabSwitch/TabSwitch.tsx
@@ -99,7 +99,7 @@ export const TabSwitch = ({ options }: { options: string[] }) => {
       data-testid="tab-switch-tabs"
     >
       {options.map(option => (
-        <Tab key={option} width="full" paddingX="5px">
+        <Tab key={option} width="full" fontWeight={600} paddingX="5px">
           {option}
         </Tab>
       ))}

diff --git a/apps/web/src/styles/theme.ts b/apps/web/src/styles/theme.ts
@@ -138,6 +138,9 @@ const theme = extendTheme({
       variants: {
         mnemonic: {
           field: {
+            _focus: {
+              borderColor: "gray.900",
+            },
             borderRadius: "34px",
             height: { md: "48px", base: "34px" },
             border: "1px solid",
Title	Statements	Branches	Functions
apps/desktop	83.6% (1765/2111)	78.81% (837/1062)	78.14% (447/572)
apps/web	83.6% (1765/2111)	78.81% (837/1062)	78.14% (447/572)
packages/components	97.31% (181/186)	95.23% (80/84)	87.03% (47/54)
packages/core	82.22% (222/270)	71.73% (99/138)	81.96% (50/61)
packages/crypto	100% (28/28)	100% (3/3)	100% (5/5)
packages/data-polling	95.27% (141/148)	87.5% (21/24)	92.85% (39/42)
packages/multisig	98.47% (129/131)	85.71% (18/21)	100% (35/35)
packages/social-auth	100% (21/21)	100% (11/11)	100% (3/3)
packages/state	84.71% (798/942)	81.33% (170/209)	78.77% (297/377)
packages/tezos	85.57% (89/104)	89.47% (17/19)	82.75% (24/29)
packages/tzkt	84.05% (58/69)	81.25% (13/16)	76.92% (30/39)