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-10-31 13:15:29 +02:00
parent 18bd49ea46
commit a88e13fcb4
11 changed files with 25 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/General/AddCards/AddCardsContainer.tsx
View File

@ -8,7 +8,7 @@ const AddCardsContainer = () => {
const cards = 2
return (
<DashboardCardWrapper padding="0" minWidth="50px" >
<DashboardCardWrapper padding="0" minWidth="50px">
<YStack height={'100%'}>
{Array.from({ length: cards }).map((_, index) => (
<AddCard key={index} style={{ padding: '56px', height: getHeightPercentages(cards) }} />

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

@ -37,7 +37,7 @@ const BalanceChartCard = () => {
}
return (
<DashboardCardWrapper minWidth={'536px'} >
<DashboardCardWrapper minWidth={'536px'}>
<YStack space={'$4'}>
<XStack justifyContent={'space-between'}>
<YStack>

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' maxWidth='30%'>
<DashboardCardWrapper padding="0" height="156px" minWidth="200px" maxWidth="30%">
<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 maxWidth='40%'>
<DashboardCardWrapper maxWidth="40%">
<YStack space={'$3'}>
<YStack>
<Text size={15} weight={'semibold'}>

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

@ -44,23 +44,25 @@ const DashboardContent = () => {
className={'transparent-scrollbar'}
>
<TitleLogo />
<Stack style={{
display: 'grid',
gridTemplateColumns: windowWidth < 1375 ? '1fr 1fr' : '1fr 1fr 2fr',
gap: '8px',
gridAutoFlow: 'row',
}}>
<Stack
style={{
display: 'grid',
gridTemplateColumns: windowWidth < 1375 ? '1fr 1fr' : '1fr 1fr 2fr',
gap: '8px',
gridAutoFlow: 'row',
}}
>
<SyncStatusCard />
<AddCardsContainer />
{windowWidth < 1375 ? (
<Stack style={{ gridColumn: '1 / span 2' }} width={'101%'}>
<BalanceChartCard />
</Stack>
) :
) : (
<Stack width={'101%'}>
<BalanceChartCard />
</Stack>
}
)}
</Stack>
<BasicInfoCards />
{/* SECOND ROW ENDS HERE! */}
@ -73,31 +75,22 @@ const DashboardContent = () => {
width: '101%',
}}
>
<ConsensusUptimeCard />
<ExecutionUptime />
<DeviceUptime />
<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>
</YStack >
</YStack>
)
}

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

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

10
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 maxWidth='40%' >
<DashboardCardWrapper maxWidth="40%">
<YStack space={'$3'} minHeight={'156px'} padding={'$3'}>
<YStack>
<Text size={15} weight={'semibold'}>
@ -35,10 +35,10 @@ const ExecutionUptime = () => {
}}
>
<UptimeChart
startMonth={0}
endMonth={3}
monthlyActivity={[10, 1, 3, 4, 5, 1, 7, 1, 6, 3, 1, 9]}
withLabels={true}
startMonth={0}
endMonth={3}
monthlyActivity={[10, 1, 3, 4, 5, 1, 7, 1, 6, 3, 1, 9]}
withLabels={true}
/>
</Stack>
</XStack>

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' maxWidth='30%'>
<DashboardCardWrapper padding="0" height="156px" minWidth="200px" maxWidth="30%">
<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' maxWidth='30%'>
<DashboardCardWrapper padding="0" height="156px" minWidth="200px" maxWidth="30%">
<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' maxWidth='30%' >
<DashboardCardWrapper padding="0" height={'156px'} minWidth="200px" maxWidth="30%">
<YStack
style={{
borderRadius: '16px',

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

@ -7,7 +7,7 @@ import ConsensusCard from './ConsensusClientCard'
const SyncStatusCard = () => {
return (
<DashboardCardWrapper padding="0" minWidth="50px" >
<DashboardCardWrapper padding="0" minWidth="50px">
<YStack space={'$2'}>
<Stack style={{ paddingTop: '12px', paddingLeft: '16px' }}>
<Text size={15} weight={'semibold'}>