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

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

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