From 086c767ed66b6df73d33d9ce159a4b20b8194c80 Mon Sep 17 00:00:00 2001
From: Ben Phelps <ben@phelps.io>
Date: Sat, 27 Aug 2022 11:03:12 +0300
Subject: [PATCH] pad string to a fixed length to stop shifting

---
 src/components/widgets/resources/cpu.jsx | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/components/widgets/resources/cpu.jsx b/src/components/widgets/resources/cpu.jsx
index 36bda7435..541f1a421 100644
--- a/src/components/widgets/resources/cpu.jsx
+++ b/src/components/widgets/resources/cpu.jsx
@@ -35,9 +35,11 @@ export default function Cpu() {
     <div className="flex-none flex flex-row items-center justify-center">
       <FiCpu className="text-theme-800 dark:text-theme-200 w-5 h-5" />
       <div className="flex flex-col ml-3 text-left font-mono">
-        <span className="text-theme-800 dark:text-theme-200 text-xs">{Math.round(data.cpu.usage)}% Usage</span>
         <span className="text-theme-800 dark:text-theme-200 text-xs">
-          {(Math.round(data.cpu.load * 100) / 100).toFixed(1)} Load
+          <span className="whitespace-pre">{`${Math.round(data.cpu.usage)}%`.padEnd(3, " ")} Usage</span>
+        </span>
+        <span className="text-theme-800 dark:text-theme-200 text-xs">
+          {`${(Math.round(data.cpu.load * 100) / 100).toFixed(1)}`.padEnd(3, " ")} Load
         </span>
       </div>
     </div>