From a921fc8168e13934bdfe6d159aee14ee2651949e Mon Sep 17 00:00:00 2001
From: xXJSONDeruloXx <danielhimebauch@gmail.com>
Date: Thu, 17 Jul 2025 23:44:51 -0400
Subject: styling cleanup

---
 src/components/PluginUpdateChecker.tsx | 123 ++++++++++++++++++++-------------
 1 file changed, 74 insertions(+), 49 deletions(-)

(limited to 'src/components/PluginUpdateChecker.tsx')

diff --git a/src/components/PluginUpdateChecker.tsx b/src/components/PluginUpdateChecker.tsx
index 0028a79..a3982c2 100644
--- a/src/components/PluginUpdateChecker.tsx
+++ b/src/components/PluginUpdateChecker.tsx
@@ -1,7 +1,8 @@
 import React, { useState, useEffect } from 'react';
 import {
   ButtonItem,
-  PanelSection
+  PanelSection,
+  PanelSectionRow
 } from '@decky/ui';
 import { checkForPluginUpdate, downloadPluginUpdate, UpdateCheckResult, UpdateDownloadResult } from '../api/lsfgApi';
 
@@ -121,66 +122,90 @@ export const PluginUpdateChecker: React.FC<PluginUpdateCheckerProps> = () => {
   };
 
   return (
-    <PanelSection title="Plugin Updates">
-      <ButtonItem
-        layout="below"
-        onClick={handleCheckForUpdate}
-        disabled={checkingUpdate}
-        description={getStatusMessage()}
-      >
-        {checkingUpdate ? 'Checking for updates...' : 'Check for Updates'}
-      </ButtonItem>
+    <PanelSection>
+      <PanelSectionRow>
+        <div
+          style={{
+            fontSize: "14px",
+            fontWeight: "bold",
+            marginTop: "16px",
+            marginBottom: "8px",
+            borderBottom: "1px solid rgba(255, 255, 255, 0.2)",
+            paddingBottom: "4px",
+            color: "white"
+          }}
+        >
+          PLUGIN UPDATES
+        </div>
+      </PanelSectionRow>
 
-      {updateInfo && updateInfo.updateAvailable && !downloadResult?.success && (
+      <PanelSectionRow>
         <ButtonItem
           layout="below"
-          onClick={handleDownloadUpdate}
-          disabled={downloadingUpdate}
-          description={`Download version ${updateInfo.latestVersion}`}
+          onClick={handleCheckForUpdate}
+          disabled={checkingUpdate}
+          description={getStatusMessage()}
         >
-          {downloadingUpdate ? 'Downloading...' : 'Download Update'}
+          {checkingUpdate ? 'Checking for updates...' : 'Check for Updates'}
         </ButtonItem>
+      </PanelSectionRow>
+
+      {updateInfo && updateInfo.updateAvailable && !downloadResult?.success && (
+        <PanelSectionRow>
+          <ButtonItem
+            layout="below"
+            onClick={handleDownloadUpdate}
+            disabled={downloadingUpdate}
+            description={`Download version ${updateInfo.latestVersion}`}
+          >
+            {downloadingUpdate ? 'Downloading...' : 'Download Update'}
+          </ButtonItem>
+        </PanelSectionRow>
       )}
 
       {downloadResult?.success && (
-        <div style={{ 
-          marginTop: '10px', 
-          padding: '10px', 
-          backgroundColor: 'rgba(0, 255, 0, 0.1)', 
-          borderRadius: '4px',
-          border: '1px solid rgba(0, 255, 0, 0.3)'
-        }}>
-          <div style={{ color: 'lightgreen', fontWeight: 'bold', marginBottom: '5px' }}>
-            ✓ Download Complete!
+        <PanelSectionRow>
+          <div style={{ 
+            marginTop: '10px', 
+            padding: '10px', 
+            backgroundColor: 'rgba(0, 255, 0, 0.1)', 
+            borderRadius: '4px',
+            border: '1px solid rgba(0, 255, 0, 0.3)'
+          }}>
+            <div style={{ color: 'lightgreen', fontWeight: 'bold', marginBottom: '5px' }}>
+              ✓ Download Complete!
+            </div>
+            <div style={{ fontSize: '12px', marginBottom: '10px' }}>
+              File saved to: {downloadResult.download_path}
+            </div>
+            <div style={{ fontSize: '12px' }}>
+              <strong>Installation Instructions:</strong>
+              <ol style={{ paddingLeft: '20px', marginTop: '5px' }}>
+                <li>Go to Decky Loader settings</li>
+                <li>Click "Developer" tab</li>
+                <li>Click "Uninstall" next to "Lossless Scaling"</li>
+                <li>Click "Install from ZIP"</li>
+                <li>Select the downloaded file</li>
+                <li>Restart Steam or reload plugins</li>
+              </ol>
+            </div>
           </div>
-          <div style={{ fontSize: '12px', marginBottom: '10px' }}>
-            File saved to: {downloadResult.download_path}
-          </div>
-          <div style={{ fontSize: '12px' }}>
-            <strong>Installation Instructions:</strong>
-            <ol style={{ paddingLeft: '20px', marginTop: '5px' }}>
-              <li>Go to Decky Loader settings</li>
-              <li>Click "Developer" tab</li>
-              <li>Click "Uninstall" next to "Lossless Scaling"</li>
-              <li>Click "Install from ZIP"</li>
-              <li>Select the downloaded file</li>
-              <li>Restart Steam or reload plugins</li>
-            </ol>
-          </div>
-        </div>
+        </PanelSectionRow>
       )}
 
       {updateError && (
-        <div style={{ 
-          color: 'red', 
-          marginTop: '10px', 
-          padding: '8px', 
-          backgroundColor: 'rgba(255, 0, 0, 0.1)', 
-          borderRadius: '4px',
-          fontSize: '12px'
-        }}>
-          {updateError}
-        </div>
+        <PanelSectionRow>
+          <div style={{ 
+            color: 'red', 
+            marginTop: '10px', 
+            padding: '8px', 
+            backgroundColor: 'rgba(255, 0, 0, 0.1)', 
+            borderRadius: '4px',
+            fontSize: '12px'
+          }}>
+            {updateError}
+          </div>
+        </PanelSectionRow>
       )}
     </PanelSection>
   );
-- 
cgit v1.2.3


From b04af8a2d32ca940e1c626090e13804fed7057c6 Mon Sep 17 00:00:00 2001
From: xXJSONDeruloXx <danielhimebauch@gmail.com>
Date: Thu, 17 Jul 2025 23:59:15 -0400
Subject: updater styling alignment

---
 src/components/PluginUpdateChecker.tsx | 104 +++++++++++----------------------
 1 file changed, 34 insertions(+), 70 deletions(-)

(limited to 'src/components/PluginUpdateChecker.tsx')

diff --git a/src/components/PluginUpdateChecker.tsx b/src/components/PluginUpdateChecker.tsx
index a3982c2..e7a9345 100644
--- a/src/components/PluginUpdateChecker.tsx
+++ b/src/components/PluginUpdateChecker.tsx
@@ -2,7 +2,9 @@ import React, { useState, useEffect } from 'react';
 import {
   ButtonItem,
   PanelSection,
-  PanelSectionRow
+  PanelSectionRow,
+  Field,
+  Focusable
 } from '@decky/ui';
 import { checkForPluginUpdate, downloadPluginUpdate, UpdateCheckResult, UpdateDownloadResult } from '../api/lsfgApi';
 
@@ -100,45 +102,17 @@ export const PluginUpdateChecker: React.FC<PluginUpdateCheckerProps> = () => {
 
     if (updateInfo.updateAvailable) {
       if (downloadResult?.success) {
-        return (
-          <div style={{ color: 'lightgreen', marginTop: '5px' }}>
-            ✓ v{updateInfo.latestVersion} downloaded - ready to install
-          </div>
-        );
+        return "✓ v" + updateInfo.latestVersion + " downloaded - ready to install";
       } else {
-        return (
-          <div style={{ color: 'orange', marginTop: '5px' }}>
-            Update available: v{updateInfo.latestVersion}
-          </div>
-        );
+        return "Update available: v" + updateInfo.latestVersion;
       }
     } else {
-      return (
-        <div style={{ color: 'lightgreen', marginTop: '5px' }}>
-          Up to date (v{updateInfo.currentVersion})
-        </div>
-      );
+      return "Up to date (v" + updateInfo.currentVersion + ")";
     }
   };
 
   return (
-    <PanelSection>
-      <PanelSectionRow>
-        <div
-          style={{
-            fontSize: "14px",
-            fontWeight: "bold",
-            marginTop: "16px",
-            marginBottom: "8px",
-            borderBottom: "1px solid rgba(255, 255, 255, 0.2)",
-            paddingBottom: "4px",
-            color: "white"
-          }}
-        >
-          PLUGIN UPDATES
-        </div>
-      </PanelSectionRow>
-
+    <PanelSection title="PLUGIN UPDATES">
       <PanelSectionRow>
         <ButtonItem
           layout="below"
@@ -164,47 +138,37 @@ export const PluginUpdateChecker: React.FC<PluginUpdateCheckerProps> = () => {
       )}
 
       {downloadResult?.success && (
-        <PanelSectionRow>
-          <div style={{ 
-            marginTop: '10px', 
-            padding: '10px', 
-            backgroundColor: 'rgba(0, 255, 0, 0.1)', 
-            borderRadius: '4px',
-            border: '1px solid rgba(0, 255, 0, 0.3)'
-          }}>
-            <div style={{ color: 'lightgreen', fontWeight: 'bold', marginBottom: '5px' }}>
-              ✓ Download Complete!
-            </div>
-            <div style={{ fontSize: '12px', marginBottom: '10px' }}>
-              File saved to: {downloadResult.download_path}
-            </div>
-            <div style={{ fontSize: '12px' }}>
-              <strong>Installation Instructions:</strong>
-              <ol style={{ paddingLeft: '20px', marginTop: '5px' }}>
-                <li>Go to Decky Loader settings</li>
-                <li>Click "Developer" tab</li>
-                <li>Click "Uninstall" next to "Lossless Scaling"</li>
-                <li>Click "Install from ZIP"</li>
-                <li>Select the downloaded file</li>
-                <li>Restart Steam or reload plugins</li>
-              </ol>
-            </div>
-          </div>
-        </PanelSectionRow>
+        <>
+          <PanelSectionRow>
+            <Field label="✓ Download Complete!">
+              <Focusable>
+                File saved to: {downloadResult.download_path}
+              </Focusable>
+            </Field>
+          </PanelSectionRow>
+          
+          <PanelSectionRow>
+            <Field label="Installation Instructions:">
+              <Focusable>
+                1. Go to Decky Loader settings
+                <br />2. Click "Developer" tab
+                <br />3. Click "Uninstall" next to "Lossless Scaling"
+                <br />4. Click "Install from ZIP"
+                <br />5. Select the downloaded file
+                <br />6. Restart Steam or reload plugins
+              </Focusable>
+            </Field>
+          </PanelSectionRow>
+        </>
       )}
 
       {updateError && (
         <PanelSectionRow>
-          <div style={{ 
-            color: 'red', 
-            marginTop: '10px', 
-            padding: '8px', 
-            backgroundColor: 'rgba(255, 0, 0, 0.1)', 
-            borderRadius: '4px',
-            fontSize: '12px'
-          }}>
-            {updateError}
-          </div>
+          <Field label="Error:">
+            <Focusable>
+              {updateError}
+            </Focusable>
+          </Field>
         </PanelSectionRow>
       )}
     </PanelSection>
-- 
cgit v1.2.3


From 14b08ac219dc134e130fc89b02c5a963d93bf243 Mon Sep 17 00:00:00 2001
From: xXJSONDeruloXx <danielhimebauch@gmail.com>
Date: Fri, 18 Jul 2025 00:06:11 -0400
Subject: fix experimental section formatting

---
 src/components/PluginUpdateChecker.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/components/PluginUpdateChecker.tsx')

diff --git a/src/components/PluginUpdateChecker.tsx b/src/components/PluginUpdateChecker.tsx
index e7a9345..d427c18 100644
--- a/src/components/PluginUpdateChecker.tsx
+++ b/src/components/PluginUpdateChecker.tsx
@@ -140,7 +140,7 @@ export const PluginUpdateChecker: React.FC<PluginUpdateCheckerProps> = () => {
       {downloadResult?.success && (
         <>
           <PanelSectionRow>
-            <Field label="✓ Download Complete!">
+            <Field label="Download Complete!">
               <Focusable>
                 File saved to: {downloadResult.download_path}
               </Focusable>
-- 
cgit v1.2.3