0ct0pu5/homepage
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Merge pull request #1111 from benphelps/fix-1110

Browse source 
Fix: Add padding to values in resources widget
This commit is contained in:
shamoon 2023-03-15 10:42:12 -07:00 • committed by GitHub
commit fe860992c0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 12 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/components/widgets/resources/cpu.jsx
View file

@ -29,12 +29,12 @@ export default function Cpu({ expanded }) {
<FiCpu className="text-theme-800 dark:text-theme-200 w-5 h-5" /> <FiCpu className="text-theme-800 dark:text-theme-200 w-5 h-5" />
<div className="flex flex-col ml-3 text-left min-w-[85px]"> <div className="flex flex-col ml-3 text-left min-w-[85px]">
<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">-</div> <div className="pl-0.5 pr-1">-</div>
<div className="pr-1">{t("resources.cpu")}</div> <div className="pr-1">{t("resources.cpu")}</div>
</div> </div>
{expanded && ( {expanded && (
<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">-</div> <div className="pl-0.5 pr-1">-</div>
<div className="pr-1">{t("resources.load")}</div> <div className="pr-1">{t("resources.load")}</div>
</div> </div>
)} )}
@ -51,7 +51,7 @@ export default function Cpu({ expanded }) {
<FiCpu className="text-theme-800 dark:text-theme-200 w-5 h-5" /> <FiCpu className="text-theme-800 dark:text-theme-200 w-5 h-5" />
<div className="flex flex-col ml-3 text-left min-w-[85px]"> <div className="flex flex-col ml-3 text-left min-w-[85px]">
<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"> <div className="pl-0.5 pr-1">
{t("common.number", { {t("common.number", {
value: data.cpu.usage, value: data.cpu.usage,
style: "unit", style: "unit",
@ -63,7 +63,7 @@ export default function Cpu({ expanded }) {
</div> </div>
{expanded && ( {expanded && (
<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"> <div className="pl-0.5 pr-1">
{t("common.number", { {t("common.number", {
value: data.cpu.load, value: data.cpu.load,
maximumFractionDigits: 2, maximumFractionDigits: 2,

8
src/components/widgets/resources/disk.jsx
View file

@ -29,12 +29,12 @@ export default function Disk({ options, expanded }) {
<FiHardDrive className="text-theme-800 dark:text-theme-200 w-5 h-5" /> <FiHardDrive className="text-theme-800 dark:text-theme-200 w-5 h-5" />
<div className="flex flex-col ml-3 text-left min-w-[85px]"> <div className="flex flex-col ml-3 text-left min-w-[85px]">
<span className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between"> <span className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
<div className="pl-0.5">-</div> <div className="pl-0.5 pr-1">-</div>
<div className="pr-1">{t("resources.free")}</div> <div className="pr-1">{t("resources.free")}</div>
</span> </span>
{expanded && ( {expanded && (
<span className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between"> <span className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
<div className="pl-0.5">-</div> <div className="pl-0.5 pr-1">-</div>
<div className="pr-1">{t("resources.total")}</div> <div className="pr-1">{t("resources.total")}</div>
</span> </span>
)} )}
@ -51,12 +51,12 @@ export default function Disk({ options, expanded }) {
<FiHardDrive className="text-theme-800 dark:text-theme-200 w-5 h-5" /> <FiHardDrive className="text-theme-800 dark:text-theme-200 w-5 h-5" />
<div className="flex flex-col ml-3 text-left min-w-[85px]"> <div className="flex flex-col ml-3 text-left min-w-[85px]">
<span className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between"> <span className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
<div className="pl-0.5">{t("common.bytes", { value: data.drive.freeGb * 1024 * 1024 * 1024 })}</div> <div className="pl-0.5 pr-1">{t("common.bytes", { value: data.drive.freeGb * 1024 * 1024 * 1024 })}</div>
<div className="pr-1">{t("resources.free")}</div> <div className="pr-1">{t("resources.free")}</div>
</span> </span>
{expanded && ( {expanded && (
<span className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between"> <span className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
<div className="pl-0.5">{t("common.bytes", { value: data.drive.totalGb * 1024 * 1024 * 1024 })}</div> <div className="pl-0.5 pr-1">{t("common.bytes", { value: data.drive.totalGb * 1024 * 1024 * 1024 })}</div>
<div className="pr-1">{t("resources.total")}</div> <div className="pr-1">{t("resources.total")}</div>
</span> </span>
)} )}

8
src/components/widgets/resources/memory.jsx
View file

@ -29,12 +29,12 @@ export default function Memory({ expanded }) {
<FaMemory className="text-theme-800 dark:text-theme-200 w-5 h-5" /> <FaMemory className="text-theme-800 dark:text-theme-200 w-5 h-5" />
<div className="flex flex-col ml-3 text-left min-w-[85px]"> <div className="flex flex-col ml-3 text-left min-w-[85px]">
<span className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between"> <span className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
<div className="pl-0.5">-</div> <div className="pl-0.5 pr-1">-</div>
<div className="pr-1">{t("resources.free")}</div> <div className="pr-1">{t("resources.free")}</div>
</span> </span>
{expanded && ( {expanded && (
<span className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between"> <span className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
<div className="pl-0.5">-</div> <div className="pl-0.5 pr-1">-</div>
<div className="pr-1">{t("resources.total")}</div> <div className="pr-1">{t("resources.total")}</div>
</span> </span>
)} )}
@ -51,14 +51,14 @@ export default function Memory({ expanded }) {
<FaMemory className="text-theme-800 dark:text-theme-200 w-5 h-5" /> <FaMemory className="text-theme-800 dark:text-theme-200 w-5 h-5" />
<div className="flex flex-col ml-3 text-left min-w-[85px]"> <div className="flex flex-col ml-3 text-left min-w-[85px]">
<span className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between"> <span className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
<div className="pl-0.5"> <div className="pl-0.5 pr-1">
{t("common.bytes", { value: data.memory.freeMemMb * 1024 * 1024, maximumFractionDigits: 1, binary: true })} {t("common.bytes", { value: data.memory.freeMemMb * 1024 * 1024, maximumFractionDigits: 1, binary: true })}
</div> </div>
<div className="pr-1">{t("resources.free")}</div> <div className="pr-1">{t("resources.free")}</div>
</span> </span>
{expanded && ( {expanded && (
<span className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between"> <span className="text-theme-800 dark:text-theme-200 text-xs flex flex-row justify-between">
<div className="pl-0.5"> <div className="pl-0.5 pr-1">
{t("common.bytes", { {t("common.bytes", {
value: data.memory.totalMemMb * 1024 * 1024, value: data.memory.totalMemMb * 1024 * 1024,
maximumFractionDigits: 1, maximumFractionDigits: 1,