From 3b0da2bfcdecd2c96c892c09a95d6ddc05c33456 Mon Sep 17 00:00:00 2001
From: Kacper Kula <kulak@kulak.at>
Date: Thu, 14 Aug 2025 11:59:38 +0100
Subject: [PATCH] chore: fixing styles

---
 src/settingsTab.ts | 8 ++++----
 styles.css         | 9 +++++++++
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/src/settingsTab.ts b/src/settingsTab.ts
index fb3c019..9e893b6 100644
--- a/src/settingsTab.ts
+++ b/src/settingsTab.ts
@@ -277,17 +277,17 @@ export class SQLSealChartsSettingTab extends PluginSettingTab {
                 
                 // Show success feedback
                 formatButton.textContent = '✓ Formatted';
-                formatButton.style.backgroundColor = '#4caf50';
+                formatButton.classList.add('sqlseal-format-success');
                 setTimeout(() => {
                     formatButton.textContent = 'Format JSON';
-                    formatButton.style.backgroundColor = '';
+                    formatButton.classList.remove('sqlseal-format-success');
                 }, 1500);
             } catch (e) {
                 formatButton.textContent = '✗ Invalid JSON5';
-                formatButton.style.backgroundColor = '#ff6b6b';
+                formatButton.classList.add('sqlseal-format-error');
                 setTimeout(() => {
                     formatButton.textContent = 'Format JSON';
-                    formatButton.style.backgroundColor = '';
+                    formatButton.classList.remove('sqlseal-format-error');
                 }, 2000);
             }
         });
diff --git a/styles.css b/styles.css
index 3a533d8..d66e6fe 100644
--- a/styles.css
+++ b/styles.css
@@ -280,4 +280,13 @@
     cursor: pointer;
     font-size: 12px;
     transition: all 0.2s ease;
+}
+
+/* Success and Error States for Format Button */
+.sqlseal-format-success {
+    background-color: #4caf50 !important;
+}
+
+.sqlseal-format-error {
+    background-color: #ff6b6b !important;
 }
\ No newline at end of file