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

format

This commit is contained in:
Hristo Nedelkov 2023-11-01 19:36:18 +02:00
parent 287ede45f6
commit 5672514787
8 changed files with 44 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/pages/Dashboard/CPULoad/CPUCard.tsx
View File

@ -40,7 +40,7 @@ const CPUCard = ({ load }: CPUCardProps) => {
const message = currentLoad < 80 ? 'Good' : 'Poor'
return (
<DashboardCardWrapper padding="0" height="156px" minWidth="200px" >
<DashboardCardWrapper padding="0" height="156px" minWidth="200px">
<YStack
style={{
borderRadius: '16px',

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

@ -9,7 +9,7 @@ const ConsensusUptimeCard = () => {
const monthlyActivity = [3, 0, 5, 4, 6, 7, 8, 9, 10, 1, 2, 3]
return (
<DashboardCardWrapper >
<DashboardCardWrapper>
<YStack space={'$3'}>
<YStack>
<Text size={15} weight={'semibold'}>

75
src/pages/Dashboard/DashboardContent.tsx
View File

@ -66,7 +66,13 @@ const DashboardContent = () => {
</Stack>
<BasicInfoCards />
{/* SECOND ROW ENDS HERE! */}
{windowWidth < 1375 ? windowWidth < 850 ? DashboardContentLayoutPhone(windowWidth) : DashboardContentLayout(windowWidth) : (
{windowWidth < 1375 ? (
windowWidth < 850 ? (
DashboardContentLayoutPhone(windowWidth)
) : (
DashboardContentLayout(windowWidth)
)
) : (
<Stack
style={{
display: 'grid',
@ -75,24 +81,20 @@ const DashboardContent = () => {
width: '100%',
}}
>
<YStack >
<XStack >
<YStack>
<XStack>
<ConsensusUptimeCard />
<ExecutionUptime />
</XStack>
<DeviceUptime />
</YStack>
<YStack space={'$4'} >
<XStack space={'$4'} >
<YStack space={'$4'}>
<XStack space={'$4'}>
<StorageCard maxStorage={100} storage={82} />
<CPUCard load={[12, 31, 3, 2, 24, 98]} />
</XStack>
<XStack space='$4'>
<XStack space="$4">
<MemoryCard currentMemory={[21, 33, 3, 42, 35]} maxMemory={50} />
<NetworkCard
@ -107,36 +109,36 @@ const DashboardContent = () => {
)
}
const DashboardContentLayout = (windowWidth: number) => {
return (<Stack
style={{
display: 'grid',
gridTemplateColumns: '1fr 1fr',
gap: '8px',
return (
<Stack
style={{
display: 'grid',
gridTemplateColumns: '1fr 1fr',
gap: '8px',
width: '101%',
}}
>
<YStack>
width: '101%',
}}
>
<YStack>
<XStack>
<ConsensusUptimeCard />
<ExecutionUptime />
</XStack>
<XStack>
<DeviceUptime />
</YStack>
<ConsensusUptimeCard />
<ExecutionUptime />
</XStack>
<StorageCard maxStorage={100} storage={82} />
<CPUCard load={[12, 31, 3, 2, 24, 98]} />
<DeviceUptime />
</YStack>
<MemoryCard currentMemory={[21, 33, 3, 42, 35]} maxMemory={50} />
<StorageCard maxStorage={100} storage={82} />
<CPUCard load={[12, 31, 3, 2, 24, 98]} />
<MemoryCard currentMemory={[21, 33, 3, 42, 35]} maxMemory={50} />
<NetworkCard
downloadRate={[12, 31, 22, 12, 23, 23, 90]}
uploadRate={[31, 22, 32, 132, 32, 45, 65]}
/>
</Stack>)
<NetworkCard
downloadRate={[12, 31, 22, 12, 23, 23, 90]}
uploadRate={[31, 22, 32, 132, 32, 45, 65]}
/>
</Stack>
)
}
const DashboardContentLayoutPhone = (windowWidth: number) => {
@ -150,14 +152,11 @@ const DashboardContentLayoutPhone = (windowWidth: number) => {
width: '101%',
}}
>
<ConsensusUptimeCard />
<ExecutionUptime />
<DeviceUptime />
<StorageCard maxStorage={100} storage={82} />
<CPUCard load={[12, 31, 3, 2, 24, 98]} />

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

@ -28,7 +28,7 @@ const DeviceUptime = () => {
}
return (
<DashboardCardWrapper >
<DashboardCardWrapper>
<YStack space={'$3'}>
<XStack justifyContent={'space-between'}>
<YStack>

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

@ -8,7 +8,7 @@ import DashboardCardWrapper from '../DashboardCardWrapper'
const ExecutionUptime = () => {
const monthlyActivity = [3, 0, 5, 4, 6, 7, 0, 9, 10, 1, 2, 3]
return (
<DashboardCardWrapper >
<DashboardCardWrapper>
<YStack space={'$3'} minHeight={'156px'} padding={'$3'}>
<YStack>
<Text size={15} weight={'semibold'}>

2
src/pages/Dashboard/MemoryCard/MemoryCard.tsx
View File

@ -42,7 +42,7 @@ const MemoryCard = ({ currentMemory, maxMemory }: MemoryCardProps) => {
const message = currentLoad < maxMemory ? 'Good' : 'Poor'
return (
<DashboardCardWrapper padding="0" height="156px" minWidth="200px" >
<DashboardCardWrapper padding="0" height="156px" minWidth="200px">
<YStack
style={{
borderRadius: '16px',

2
src/pages/Dashboard/NetworkCard/NetworkCard.tsx
View File

@ -48,7 +48,7 @@ const NetworkCard = ({ uploadRate, downloadRate }: NetworkCardProps) => {
const message = currentLoad > 60 ? 'Good' : 'Poor'
return (
<DashboardCardWrapper padding="0" height="156px" minWidth="200px" >
<DashboardCardWrapper padding="0" height="156px" minWidth="200px">
<YStack
style={{
borderRadius: '16px',

2
src/pages/Dashboard/StorageCard/StorageCard.tsx
View File

@ -35,7 +35,7 @@ const StorageCard = ({ storage, maxStorage }: StorageCardProps) => {
}
return (
<DashboardCardWrapper padding="0" height="156px" minWidth="200px" >
<DashboardCardWrapper padding="0" height="156px" minWidth="200px">
<YStack
style={{
borderRadius: '16px',