From ea6185179fb6d8eedaf90236baf8b7779a9da716 Mon Sep 17 00:00:00 2001
From: xXJSONDeruloXx <danielhimebauch@gmail.com>
Date: Tue, 15 Jul 2025 22:01:48 -0400
Subject: better install status ui

---
 src/components/Content.tsx       | 14 +++++++-------
 src/components/StatusDisplay.tsx | 21 +++++++++++++++++----
 2 files changed, 24 insertions(+), 11 deletions(-)

(limited to 'src/components')

diff --git a/src/components/Content.tsx b/src/components/Content.tsx
index c7c52a5..39de01b 100644
--- a/src/components/Content.tsx
+++ b/src/components/Content.tsx
@@ -81,13 +81,6 @@ export function Content() {
 
   return (
     <PanelSection>
-      <StatusDisplay
-        dllDetected={dllDetected}
-        dllDetectionStatus={dllDetectionStatus}
-        isInstalled={isInstalled}
-        installationStatus={installationStatus}
-      />
-
       <InstallationButton
         isInstalled={isInstalled}
         isInstalling={isInstalling}
@@ -96,6 +89,13 @@ export function Content() {
         onUninstall={onUninstall}
       />
 
+      <StatusDisplay
+        dllDetected={dllDetected}
+        dllDetectionStatus={dllDetectionStatus}
+        isInstalled={isInstalled}
+        installationStatus={installationStatus}
+      />
+
       {/* Configuration Section - only show if installed */}
       {isInstalled && (
         <ConfigurationSection
diff --git a/src/components/StatusDisplay.tsx b/src/components/StatusDisplay.tsx
index 8eecd42..3a48a15 100644
--- a/src/components/StatusDisplay.tsx
+++ b/src/components/StatusDisplay.tsx
@@ -19,18 +19,31 @@ export function StatusDisplay({
         <div
           style={{
             color: dllDetected ? "#4CAF50" : "#F44336",
-            fontWeight: "bold",
-            marginBottom: "4px"
+            fontWeight: "600",
+            marginBottom: "6px",
+            display: "flex",
+            alignItems: "center",
+            gap: "6px"
           }}
         >
+          <span style={{ fontSize: "16px" }}>
+            {dllDetected ? "✅" : "❌"}
+          </span>
           {dllDetectionStatus}
         </div>
         <div
           style={{
-            color: isInstalled ? "#4CAF50" : "#FF9800"
+            color: isInstalled ? "#4CAF50" : "#FF9800",
+            fontWeight: "600",
+            display: "flex",
+            alignItems: "center",
+            gap: "6px"
           }}
         >
-          Status: {installationStatus}
+          <span style={{ fontSize: "16px" }}>
+            {isInstalled ? "✅" : "❌"}
+          </span>
+          {installationStatus}
         </div>
       </div>
     </PanelSectionRow>
-- 
cgit v1.2.3