Some UI fixes (#242)

* fix chain icon * color change for watchlist only * update icon colors on the index page * keep the old color Co-authored-by: Sergej Sakac <[email protected]> * add padding --------- Co-authored-by: Sergej Sakac <[email protected]> Co-authored-by: Sergej <[email protected]>
RegionX-Labs · Oct 22, 2024 · 0b74cca · 0b74cca
1 parent cb76597
commit 0b74cca
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 5 deletions.
diff --git a/src/assets/networks/relay/index.ts b/src/assets/networks/relay/index.ts
@@ -19,7 +19,7 @@ const getIcon = (network: NetworkType) => {
     case NetworkType.WESTEND:
       return Westend;
     default:
-      Polkadot;
+      return Polkadot;
   }
 };
 

diff --git a/src/components/Transfer/transferActions.tsx b/src/components/Transfer/transferActions.tsx
@@ -1,6 +1,7 @@
 import ArrowDownward from '@mui/icons-material/ArrowDownwardOutlined';
 import { Box, Paper, Stack, Typography } from '@mui/material';
 import { AmountInput, Button } from '@region-x/components';
+import Image from 'next/image';
 import { useRouter } from 'next/router';
 
 import { getIcon } from '@/assets/networks';
@@ -106,9 +107,12 @@ const TransferActions = () => {
                     value: symbol,
                     label: symbol,
                     icon: (
-                      <img
-                        src={getIcon(network)?.src}
-                        style={{ width: '28px', height: '28px', padding: '4px' }}
+                      <Image
+                        src={getIcon(network)}
+                        alt=''
+                        width={28}
+                        height={28}
+                        style={{ padding: '4px ' }}
                       />
                     ),
                   },

diff --git a/src/pages/paras/index.tsx b/src/pages/paras/index.tsx
@@ -98,7 +98,10 @@ const ParachainManagement = () => {
           </Typography>
         </Box>
         <Box sx={{ display: 'flex', gap: '1.5rem', height: '2.75rem' }}>
-          <Button color='yellowDark' onClick={() => watchAllParas((prev) => !prev)}>
+          <Button
+            color={watchAll ? 'yellowDark' : 'greenPrimary'}
+            onClick={() => watchAllParas((prev) => !prev)}
+          >
             Watchlist Only
           </Button>
           <Button onClick={() => openReserveModal(true)}>Reserve New Para</Button>