Merge pull request #756 from oasisprotocol/mz/typography

Update typography in various places
oasisprotocol · Jul 19, 2023 · 40be1e3 · 40be1e3
2 parents 9c4f5f3 + fa0e76e
commit 40be1e3
Show file tree

Hide file tree

Showing 7 changed files with 19 additions and 17 deletions.
diff --git a/.changelog/756.bugfix.md b/.changelog/756.bugfix.md
@@ -0,0 +1 @@
+Update typography in various places
diff --git a/src/app/components/Account/ShowMoreTokensLink.tsx b/src/app/components/Account/ShowMoreTokensLink.tsx
@@ -9,7 +9,7 @@ import { accountTokenContainerId } from '../../pages/AccountDetailsPage/AccountT
 
 export const StyledLink = styled(RouterLink)(({ theme }) => ({
   color: COLORS.brandDark,
-  fontWeight: 600,
+  fontWeight: 700,
   textDecoration: 'none',
   whiteSpace: 'nowrap',
   marginLeft: theme.spacing(4),

diff --git a/src/app/components/ParaTimePicker/NetworkMenu.tsx b/src/app/components/ParaTimePicker/NetworkMenu.tsx
@@ -12,6 +12,17 @@ import { COLORS } from '../../../styles/theme/colors'
 import { Network, getNetworkNames } from '../../../types/network'
 import { RouteUtils } from '../../utils/route-utils'
 import { getNetworkIcons } from '../../utils/content'
+import { styled } from '@mui/material/styles'
+
+const StyledButton = styled(Button)(({ theme }) => ({
+  marginLeft: '48px',
+  color: COLORS.brandDark,
+  fontWeight: 700,
+  '&&:hover': {
+    textDecoration: 'none',
+    color: COLORS.brandDark,
+  },
+}))
 
 type NetworkMenuItemProps = Omit<NetworkMenuProps, 'options'> & {
   divider: boolean
@@ -114,14 +125,9 @@ export const NetworkMenu: FC<NetworkMenuProps> = ({ activeNetwork, selectedNetwo
         </Collapse>
       </MenuList>
       {!!filteredOptions.length && (
-        <Button
-          onClick={() => setExpandNetworkMenu(!expandNetworkMenu)}
-          size="small"
-          variant="text"
-          sx={{ ml: '48px' }}
-        >
+        <StyledButton onClick={() => setExpandNetworkMenu(!expandNetworkMenu)} size="small" variant="text">
           {expandNetworkMenu ? t('paraTimePicker.less') : t('paraTimePicker.more')}
-        </Button>
+        </StyledButton>
       )}
     </>
   )

diff --git a/src/app/pages/ParatimeDashboardPage/LatestBlocks.tsx b/src/app/pages/ParatimeDashboardPage/LatestBlocks.tsx
@@ -46,7 +46,7 @@ export const LatestBlocks: FC<{ scope: SearchScope }> = ({ scope }) => {
           <Link
             component={RouterLink}
             to={RouteUtils.getLatestBlocksRoute(scope)}
-            sx={{ color: COLORS.brandExtraDark }}
+            sx={{ color: COLORS.brandDark }}
           >
             {t('common.viewAll')}
           </Link>

diff --git a/src/app/pages/ParatimeDashboardPage/LatestTransactions.tsx b/src/app/pages/ParatimeDashboardPage/LatestTransactions.tsx
@@ -46,7 +46,7 @@ export const LatestTransactions: FC<{ scope: SearchScope }> = ({ scope }) => {
           <Link
             component={RouterLink}
             to={RouteUtils.getLatestTransactionsRoute(scope)}
-            sx={{ color: COLORS.brandExtraDark }}
+            sx={{ color: COLORS.brandDark }}
           >
             {t('common.viewAll')}
           </Link>

diff --git a/src/app/pages/ParatimeDashboardPage/LearningMaterials.tsx b/src/app/pages/ParatimeDashboardPage/LearningMaterials.tsx
@@ -146,12 +146,7 @@ export const LearningMaterials: FC<{ scope: SearchScope }> = ({ scope }) => {
         component="h3"
         title={t('learningMaterials.header')}
         action={
-          <Link
-            href={docs.home}
-            rel="noopener noreferrer"
-            target="_blank"
-            sx={{ color: COLORS.brandExtraDark }}
-          >
+          <Link href={docs.home} rel="noopener noreferrer" target="_blank" sx={{ color: COLORS.brandDark }}>
             {t('common.viewAll')}
           </Link>
         }

diff --git a/src/app/pages/ParatimeDashboardPage/TopTokens.tsx b/src/app/pages/ParatimeDashboardPage/TopTokens.tsx
@@ -35,7 +35,7 @@ export const TopTokens: FC<{ scope: SearchScope }> = ({ scope }) => {
           <Link
             component={RouterLink}
             to={RouteUtils.getTopTokensRoute(scope)}
-            sx={{ color: COLORS.brandExtraDark }}
+            sx={{ color: COLORS.brandDark }}
           >
             {t('common.viewAll')}
           </Link>