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 first row of component

This commit is contained in:
Hristo Nedelkov 2023-10-31 11:01:29 +02:00
parent dc893eff0e
commit 6954603d04
1 changed files with 22 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -13,6 +13,7 @@ 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'
import { XStack } from 'tamagui'
const DashboardContent = () => { const DashboardContent = () => {
const [windowWidth, setWindowWidth] = useState(window.innerWidth) const [windowWidth, setWindowWidth] = useState(window.innerWidth)
@ -43,20 +44,27 @@ const DashboardContent = () => {
className={'transparent-scrollbar'} className={'transparent-scrollbar'}
> >
<TitleLogo /> <TitleLogo />
<Stack <Stack style={{
style={{
display: 'grid', display: 'grid',
gridTemplateColumns: windowWidth < 1300 ? '0.5fr' : '25fr 25fr 90fr', gridTemplateColumns: windowWidth < 1375 ? '1fr 1fr' : '1fr 1fr 2fr',
gap: '8px',
gap: '16px', gridAutoFlow: 'row',
}} }}>
>
<SyncStatusCard /> <SyncStatusCard />
<AddCardsContainer /> <AddCardsContainer />
{windowWidth < 1375 ? (
<Stack style={{ gridColumn: '1 / span 2' }} width={'101%'}>
<BalanceChartCard /> <BalanceChartCard />
</Stack> </Stack>
) :
<Stack width={'101%'}>
<BalanceChartCard />
</Stack>
}
</Stack>
<BasicInfoCards /> <BasicInfoCards />
<Stack {/* SECOND ROW ENDS HERE! */}
{/* <Stack
style={{ style={{
display: 'grid', display: 'grid',
gridTemplateColumns: windowWidth < 1300 ? '1fr' : '1.5fr 1fr', gridTemplateColumns: windowWidth < 1300 ? '1fr' : '1.5fr 1fr',
@ -84,6 +92,7 @@ const DashboardContent = () => {
gridTemplateColumns: windowWidth < 1750 ? '1fr' : '1fr 1fr', gridTemplateColumns: windowWidth < 1750 ? '1fr' : '1fr 1fr',
gap: '16px', gap: '16px',
marginTop: windowWidth < 1300 ? '50px' : 0, marginTop: windowWidth < 1300 ? '50px' : 0,
maxHeight: '200px',
}} }}
> >
<StorageCard maxStorage={100} storage={82} /> <StorageCard maxStorage={100} storage={82} />
@ -94,8 +103,9 @@ const DashboardContent = () => {
uploadRate={[31, 22, 32, 132, 32, 45, 65]} uploadRate={[31, 22, 32, 132, 32, 45, 65]}
/> />
</Stack> </Stack>
</Stack> </Stack> */}
</YStack>
</YStack >
) )
} }