status-im
/
nimbus-gui
mirror of https://github.com/status-im/nimbus-gui.git
2
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

fix: change some card sizes to fit better on screen

This commit is contained in:
Ivana Andersson 2023-09-26 09:59:54 +03:00
parent 4d4f23fe3d
commit e99066717a
4 changed files with 14 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/pages/Dashboard/ConsensusUptime/ConsensusUptimeCard.tsx
View File

@ -47,9 +47,10 @@ const ConsensusUptimeCard = () => {
variant="$2"
style={{
borderRadius: '16px',
width: '48%',
}}
>
<YStack space={'$3'} width={'260px'} height={'156px'} padding={'$3'}>
<YStack space={'$3'} width={'100%'} minHeight={'156px'} padding={'$3'}>
<YStack>
<Text size={15} weight={'semibold'}>
Consensus Uptime
@ -70,7 +71,7 @@ const ConsensusUptimeCard = () => {
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
width: '228px',
width: '100%',
height: '100%',
}}
>

11
src/pages/Dashboard/Dashboard.tsx
View File

@ -23,8 +23,8 @@ const Dashboard = () => {
<YStack space={'$4'} alignItems="start" px="24px" style={{ flexGrow: '1' }}>
<TitleLogo />
<XStack space={'$4'} justifyContent={'space-between'} >
<XStack space={'$4'}>
<XStack space={'$4'} justifyContent={'space-between'} width={'100%'}>
<XStack space={'$4'} width={'50%'}>
<SyncStatusCard />
<AddCardsContainer />
</XStack>
@ -32,16 +32,15 @@ const Dashboard = () => {
</XStack>
<BasicInfoCards />
<XStack space="$3">
<YStack space={'$4'}>
<XStack space="$3" width={'100%'}>
<YStack space={'$4'} width={'50%'}>
<XStack justifyContent="space-between">
<ConsensusUptimeCard />
<ExecutionUptime />
</XStack>
<DeviceUptime />
</YStack>
<YStack space={'$4'} >
<YStack space={'$4'} width={'50%'}>
<XStack space="$4">
<StorageCard maxStorage={100} storage={82} />
<CPUCard load={[12, 31, 3, 2, 24, 98]} />

4
src/pages/Dashboard/DeviceUptime/DeviceUptime.tsx
View File

@ -103,7 +103,7 @@ const DeviceUptime = () => {
borderRadius: '16px',
}}
>
<YStack space={'$3'} width={'560px'} height={'156px'} padding={'$3'}>
<YStack space={'$3'} width={'100%'} minHeight={'156px'} padding={'$3'}>
<XStack justifyContent={'space-between'}>
<YStack>
<Text size={15} weight={'semibold'}>
@ -160,7 +160,7 @@ const DeviceUptime = () => {
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
width: '504px',
width: '100%',
height: '100%',
}}
>

5
src/pages/Dashboard/ExecutionUptime/ExecutionUptime.tsx
View File

@ -48,9 +48,10 @@ const ExecutionUptime = () => {
variant="$2"
style={{
borderRadius: '16px',
width: '48%',
}}
>
<YStack space={'$3'} width={'260px'} height={'156px'} padding={'$3'}>
<YStack space={'$3'} width={'100%'} minHeight={'156px'} padding={'$3'}>
<YStack>
<Text size={15} weight={'semibold'}>
Execution Uptime
@ -71,7 +72,7 @@ const ExecutionUptime = () => {
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
width: '228px',
width: '100%',
height: '100%',
}}
>