OpenSource/homepage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Make compact

Browse Source
This commit is contained in:
shamoon 2024-11-24 20:41:48 -08:00
parent 4f03104ed1
commit ccdf9c1659
2 changed files with 20 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
src/components/widgets/resources/network.jsx
View File

@ -26,36 +26,24 @@ export default function Network({ options, refresh = 1500 }) {
expandedValue="-" expandedValue="-"
expandedLabel={<FaAngleDown />} expandedLabel={<FaAngleDown />}
percentage="0" percentage="0"
expanded="true"
/> />
); );
} }
return ( return (
<> <Resource
<Resource icon={FaNetworkWired}
icon={FaNetworkWired} value={`${t("common.bits", { value: data?.network?.tx_sec })} / ${t("common.bits", {
value={t("common.bits", { value: data?.network?.tx_sec })} value: data?.network?.rx_sec,
label={<FaAngleUp />} })}`}
expandedValue={t("common.bits", { value: data?.network?.rx_sec })} label={data.interface}
expandedLabel={<FaAngleDown />} expandedValue={`${t("common.bbytes", { value: data?.network?.tx_bytes })} / ${t("common.bbytes", {
percentage="0" value: data?.network?.rx_bytes,
expanded="true" })}`}
> expandedLabel={data.interface}
<div className="pt-1 text-theme-800 dark:text-theme-200 text-xs text-center">{data.interface}</div> expanded={options.expanded}
</Resource> wide={true}
percentage="0"
<Resource />
icon={FaNetworkWired}
value={t("common.bbytes", { value: data?.network?.tx_bytes })}
label={<FaAngleUp />}
expandedValue={t("common.bbytes", { value: data?.network?.rx_bytes })}
expandedLabel={<FaAngleDown />}
percentage="0"
expanded="true"
>
<div className="pt-1 text-theme-800 dark:text-theme-200 text-xs text-center">{data.interface}</div>
</Resource>
</>
); );
} }

7
src/components/widgets/widget/resource.jsx
View File

@ -10,6 +10,7 @@ export default function Resource({
percentage, percentage,
expanded = false, expanded = false,
additionalClassNames = "", additionalClassNames = "",
wide = false,
}) { }) {
const Icon = icon; const Icon = icon;
@ -18,7 +19,11 @@ export default function Resource({
className={`flex-none flex flex-row items-center mr-3 py-1.5 information-widget-resource ${additionalClassNames}`} className={`flex-none flex flex-row items-center mr-3 py-1.5 information-widget-resource ${additionalClassNames}`}
> >
<Icon className="text-theme-800 dark:text-theme-200 w-5 h-5 resource-icon" /> <Icon className="text-theme-800 dark:text-theme-200 w-5 h-5 resource-icon" />
<div className={`flex flex-col ml-3 text-left min-w-[85px] ${expanded ? " expanded" : ""}`}> <div
className={`flex flex-col ml-3 text-left min-w-[85px] ${expanded ? " expanded" : ""} ${
wide ? " min-w-[170px]" : ""
}`}
>
<div className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between"> <div className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
<div className="pl-0.5">{value}</div> <div className="pl-0.5">{value}</div>
<div className="pr-1">{label}</div> <div className="pr-1">{label}</div>