status-im/nimbus-gui
2
0
Fork 0
mirror of https://github.com/status-im/nimbus-gui.git synced 2025-02-08 09:34:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(dashboard-cards): move error border

Browse Source
This commit is contained in:
RadoslavDimchev 2024-04-20 14:30:04 +03:00 committed by Emil Ivanichkov
parent 0ff181292f
commit c94cbdfc77
5 changed files with 27 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -42,11 +42,15 @@ 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"
isErrorBorder={message === 'Poor'}
>
<YStack
style={{
borderRadius: '16px',
border: message === 'Poor' ? '1px solid #D92344' : 'none',
backgroundColor: message === 'Poor' ? '#fefafa' : '#fff',
flexGrow: '1',
}}

4
src/pages/Dashboard/DashboardCardWrapper.tsx
View File

@ -8,6 +8,7 @@ type DashboardCardWrapperProps = {
minWidth?: string
maxWidth?: string
maxHeight?: string
isErrorBorder?: boolean
}
const DashboardCardWrapper = ({
@ -18,6 +19,7 @@ const DashboardCardWrapper = ({
minWidth = '0',
maxWidth,
maxHeight,
isErrorBorder,
}: DashboardCardWrapperProps) => {
return (
<Shadow
@ -32,7 +34,7 @@ const DashboardCardWrapper = ({
minWidth: minWidth,
maxWidth: maxWidth,
maxHeight: maxHeight,
border: '1px solid #E7EAEE',
border: isErrorBorder ? '1px solid #D92344' : '1px solid #E7EAEE',
}}
>
{children}

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

@ -44,11 +44,15 @@ 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"
isErrorBorder={message === 'Poor'}
>
<YStack
style={{
borderRadius: '16px',
border: message === 'Poor' ? '1px solid #D92344' : 'none',
backgroundColor: message === 'Poor' ? '#fefafa' : '#fff',
}}
height={'100%'}

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

@ -50,11 +50,15 @@ 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"
isErrorBorder={message === 'Poor'}
>
<YStack
style={{
borderRadius: '16px',
border: message === 'Poor' ? '1px solid #D92344' : 'none',
backgroundColor: message === 'Poor' ? '#fefafa' : '#fff',
}}
height={'100%'}

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

@ -35,11 +35,15 @@ const StorageCard = ({ storage, maxStorage }: StorageCardProps) => {
}
return (
<DashboardCardWrapper padding="0" height="156px" minWidth="200px">
<DashboardCardWrapper
padding="0"
height="156px"
minWidth="200px"
isErrorBorder={message === 'Poor'}
>
<YStack
style={{
borderRadius: '16px',
border: message === 'Poor' ? '1px solid #D92344' : 'none',
backgroundColor: message === 'Poor' ? '#fefafa' : '#fff',
flexGrow: '1',
}}