mirror of
https://github.com/status-im/nimbus-gui.git
synced 2025-02-18 22:37:39 +00:00
format
This commit is contained in:
parent
7f4aaed759
commit
aeca7ecfec
@ -95,9 +95,7 @@ const BalanceChartCard = () => {
|
|||||||
</XStack>
|
</XStack>
|
||||||
</XStack>
|
</XStack>
|
||||||
|
|
||||||
|
|
||||||
<LineChart years={filteredYears} userGains={filteredUserGains} />
|
<LineChart years={filteredYears} userGains={filteredUserGains} />
|
||||||
|
|
||||||
</YStack>
|
</YStack>
|
||||||
</DashboardCardWrapper>
|
</DashboardCardWrapper>
|
||||||
)
|
)
|
||||||
|
@ -32,17 +32,15 @@ const LineChart = ({ years, userGains }: LineChartProps) => {
|
|||||||
],
|
],
|
||||||
}
|
}
|
||||||
const options = {
|
const options = {
|
||||||
|
|
||||||
responsive: true,
|
responsive: true,
|
||||||
maintainAspectRatio: false,
|
maintainAspectRatio: false,
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Stack >
|
<Stack>
|
||||||
<Line data={data} options={options} />
|
<Line data={data} options={options} />
|
||||||
</Stack>
|
</Stack>
|
||||||
)
|
)
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export default LineChart
|
export default LineChart
|
||||||
|
@ -14,7 +14,7 @@ const ConsensusUptimeCard = () => {
|
|||||||
width: '48%',
|
width: '48%',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<YStack space={'$3'} minHeight={'156px'} padding={'$3'}>
|
<YStack space={'$3'} minHeight={'156px'} padding={'$3'}>
|
||||||
<YStack>
|
<YStack>
|
||||||
<Text size={15} weight={'semibold'}>
|
<Text size={15} weight={'semibold'}>
|
||||||
Consensus Uptime
|
Consensus Uptime
|
||||||
|
@ -10,6 +10,6 @@ const Dashboard = () => (
|
|||||||
<DashboardContent />
|
<DashboardContent />
|
||||||
<RightSidebar />
|
<RightSidebar />
|
||||||
</XStack>
|
</XStack>
|
||||||
);
|
)
|
||||||
|
|
||||||
export default Dashboard
|
export default Dashboard
|
||||||
|
@ -35,4 +35,4 @@ const DashboardCardWrapper = ({
|
|||||||
</Shadow>
|
</Shadow>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
export default DashboardCardWrapper
|
export default DashboardCardWrapper
|
||||||
|
@ -1,63 +1,63 @@
|
|||||||
import { XStack, YStack } from 'tamagui';
|
import { XStack, YStack } from 'tamagui'
|
||||||
|
|
||||||
import BasicInfoCards from './BasicInfoCards/BasicInfoCards';
|
import BasicInfoCards from './BasicInfoCards/BasicInfoCards'
|
||||||
import AddCardsContainer from '../../components/General/AddCards/AddCardsContainer';
|
import AddCardsContainer from '../../components/General/AddCards/AddCardsContainer'
|
||||||
import BalanceChartCard from './BalanceChartCard/BalanceChartCard';
|
import BalanceChartCard from './BalanceChartCard/BalanceChartCard'
|
||||||
import CPUCard from './CPULoad/CPUCard';
|
import CPUCard from './CPULoad/CPUCard'
|
||||||
import ConsensusUptimeCard from './ConsensusUptime/ConsensusUptimeCard';
|
import ConsensusUptimeCard from './ConsensusUptime/ConsensusUptimeCard'
|
||||||
import ExecutionUptime from './ExecutionUptime/ExecutionUptime';
|
import ExecutionUptime from './ExecutionUptime/ExecutionUptime'
|
||||||
import DeviceUptime from './DeviceUptime/DeviceUptime';
|
import DeviceUptime from './DeviceUptime/DeviceUptime'
|
||||||
import TitleLogo from './TitleLogo';
|
import TitleLogo from './TitleLogo'
|
||||||
import StorageCard from './StorageCard/StorageCard';
|
import StorageCard from './StorageCard/StorageCard'
|
||||||
import NetworkCard from './NetworkCard/NetworkCard';
|
import NetworkCard from './NetworkCard/NetworkCard'
|
||||||
import SyncStatusCard from './SyncStatusCards/SyncStatusCards';
|
import SyncStatusCard from './SyncStatusCards/SyncStatusCards'
|
||||||
import MemoryCard from './MemoryCard/MemoryCard';
|
import MemoryCard from './MemoryCard/MemoryCard'
|
||||||
|
|
||||||
const DashboardContent = () => (
|
const DashboardContent = () => (
|
||||||
<YStack
|
<YStack
|
||||||
space="$4"
|
space="$4"
|
||||||
alignItems="start"
|
alignItems="start"
|
||||||
px="24px"
|
px="24px"
|
||||||
style={{
|
style={{
|
||||||
flexGrow: '1',
|
flexGrow: '1',
|
||||||
marginTop: '16px',
|
marginTop: '16px',
|
||||||
width: '50%',
|
width: '50%',
|
||||||
overflowY: 'auto',
|
overflowY: 'auto',
|
||||||
maxHeight: '100vh'
|
maxHeight: '100vh',
|
||||||
}}
|
}}
|
||||||
minWidth="500px"
|
minWidth="500px"
|
||||||
>
|
>
|
||||||
<TitleLogo />
|
<TitleLogo />
|
||||||
<XStack space="$4" flexWrap="wrap">
|
<XStack space="$4" flexWrap="wrap">
|
||||||
<XStack space="$4" flexWrap="wrap">
|
<XStack space="$4" flexWrap="wrap">
|
||||||
<SyncStatusCard />
|
<SyncStatusCard />
|
||||||
<AddCardsContainer />
|
<AddCardsContainer />
|
||||||
</XStack>
|
</XStack>
|
||||||
<BalanceChartCard />
|
<BalanceChartCard />
|
||||||
|
</XStack>
|
||||||
|
<BasicInfoCards />
|
||||||
|
<XStack space="$3" flexWrap="wrap">
|
||||||
|
<YStack space={'$4'} flexWrap="wrap">
|
||||||
|
<XStack justifyContent="space-between" flexWrap="wrap">
|
||||||
|
<ConsensusUptimeCard />
|
||||||
|
<ExecutionUptime />
|
||||||
</XStack>
|
</XStack>
|
||||||
<BasicInfoCards />
|
<DeviceUptime />
|
||||||
<XStack space="$3" flexWrap="wrap" >
|
</YStack>
|
||||||
<YStack space={'$4'} flexWrap="wrap">
|
<YStack space={'$4'} flexWrap="wrap">
|
||||||
<XStack justifyContent="space-between" flexWrap="wrap">
|
<XStack space="$4">
|
||||||
<ConsensusUptimeCard />
|
<StorageCard maxStorage={100} storage={82} />
|
||||||
<ExecutionUptime />
|
<CPUCard load={[12, 31, 3, 2, 24, 98]} />
|
||||||
</XStack>
|
|
||||||
<DeviceUptime />
|
|
||||||
</YStack>
|
|
||||||
<YStack space={'$4'} flexWrap="wrap">
|
|
||||||
<XStack space="$4">
|
|
||||||
<StorageCard maxStorage={100} storage={82} />
|
|
||||||
<CPUCard load={[12, 31, 3, 2, 24, 98]} />
|
|
||||||
</XStack>
|
|
||||||
<XStack space="$4" >
|
|
||||||
<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]}
|
|
||||||
/>
|
|
||||||
</XStack>
|
|
||||||
</YStack>
|
|
||||||
</XStack>
|
</XStack>
|
||||||
</YStack>
|
<XStack space="$4">
|
||||||
);
|
<MemoryCard currentMemory={[21, 33, 3, 42, 35]} maxMemory={50} />
|
||||||
export default DashboardContent
|
<NetworkCard
|
||||||
|
downloadRate={[12, 31, 22, 12, 23, 23, 90]}
|
||||||
|
uploadRate={[31, 22, 32, 132, 32, 45, 65]}
|
||||||
|
/>
|
||||||
|
</XStack>
|
||||||
|
</YStack>
|
||||||
|
</XStack>
|
||||||
|
</YStack>
|
||||||
|
)
|
||||||
|
export default DashboardContent
|
||||||
|
@ -15,7 +15,7 @@ const ExecutionUptime = () => {
|
|||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<YStack space={'$3'} width={'100%'} minHeight={'156px'} padding={'$3'}>
|
<YStack space={'$3'} width={'100%'} minHeight={'156px'} padding={'$3'}>
|
||||||
<YStack >
|
<YStack>
|
||||||
<Text size={15} weight={'semibold'}>
|
<Text size={15} weight={'semibold'}>
|
||||||
Execution Uptime
|
Execution Uptime
|
||||||
</Text>
|
</Text>
|
||||||
|
@ -19,7 +19,7 @@ const RightSidebar = () => {
|
|||||||
padding: '8px',
|
padding: '8px',
|
||||||
border: '1px solid #F0F2F5',
|
border: '1px solid #F0F2F5',
|
||||||
height: '100vh',
|
height: '100vh',
|
||||||
overflowY: 'auto'
|
overflowY: 'auto',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<XStack alignItems="center">
|
<XStack alignItems="center">
|
||||||
|
@ -7,7 +7,7 @@ import ConsensusCard from './ConsensusClientCard'
|
|||||||
|
|
||||||
const SyncStatusCard = () => {
|
const SyncStatusCard = () => {
|
||||||
return (
|
return (
|
||||||
<DashboardCardWrapper padding="0" >
|
<DashboardCardWrapper padding="0">
|
||||||
<YStack space={'$2'}>
|
<YStack space={'$2'}>
|
||||||
<Stack style={{ paddingTop: '12px', paddingLeft: '16px' }}>
|
<Stack style={{ paddingTop: '12px', paddingLeft: '16px' }}>
|
||||||
<Text size={15} weight={'semibold'}>
|
<Text size={15} weight={'semibold'}>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user