From 6e6d99b78736ba710f16f5900b74f4edb46e4d77 Mon Sep 17 00:00:00 2001
From: Tim Sinaeve <tim.sinaeve@gmail.com>
Date: Sat, 4 Oct 2025 18:16:14 +0200
Subject: [PATCH] Align tab headers with document styling

---
 components/InfoView.tsx     |  2 +-
 components/LoggerPanel.tsx  |  6 +++---
 components/SettingsView.tsx | 14 +++++++-------
 3 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/components/InfoView.tsx b/components/InfoView.tsx
index e5e33b5..722296c 100644
--- a/components/InfoView.tsx
+++ b/components/InfoView.tsx
@@ -81,7 +81,7 @@ const InfoView: React.FC<InfoViewProps> = ({ settings }) => {
   return (
     <div className="flex-1 flex flex-col bg-background overflow-hidden min-h-0">
       <header className="flex items-center justify-between px-4 h-7 border-b border-border-color bg-secondary flex-shrink-0">
-        <h1 className="text-xs font-semibold text-text-secondary tracking-[0.2em] uppercase">Application Information</h1>
+        <h1 className="text-xs font-semibold text-text-secondary tracking-wider uppercase">Application Information</h1>
         <nav className="flex items-center gap-1">
           {(Object.keys(docFiles) as DocTab[]).map(tab => (
             <button
diff --git a/components/LoggerPanel.tsx b/components/LoggerPanel.tsx
index 218ab33..8fa4080 100644
--- a/components/LoggerPanel.tsx
+++ b/components/LoggerPanel.tsx
@@ -119,8 +119,8 @@ const LoggerPanel: React.FC<LoggerPanelProps> = ({ isVisible, onToggleVisibility
         onMouseDown={onResizeStart}
         className="w-full h-1.5 cursor-row-resize flex-shrink-0 bg-border-color/50 hover:bg-primary transition-colors duration-200"
       />
-      <header className="flex items-center justify-between px-2 py-1.5 border-b border-border-color flex-shrink-0 gap-2">
-        <h3 className="text-[11px] font-semibold text-text-main">Application Logs</h3>
+      <header className="flex items-center justify-between px-2 h-7 border-b border-border-color bg-secondary flex-shrink-0 gap-2">
+        <h3 className="text-xs font-semibold text-text-secondary tracking-wider uppercase">Application Logs</h3>
         <div className="flex items-center gap-1.5 flex-wrap justify-end">
           <div className="flex items-center gap-1">
             <span className="text-[10px] text-text-secondary">Level:</span>
@@ -145,7 +145,7 @@ const LoggerPanel: React.FC<LoggerPanelProps> = ({ isVisible, onToggleVisibility
                 className="absolute right-1 top-1/2 -translate-y-1/2 text-[10px] text-text-secondary hover:text-text-main px-1"
                 aria-label="Clear log filter"
               >
-                ×
+                ×
               </button>
             )}
           </div>
diff --git a/components/SettingsView.tsx b/components/SettingsView.tsx
index e491e10..698e319 100644
--- a/components/SettingsView.tsx
+++ b/components/SettingsView.tsx
@@ -341,17 +341,17 @@ const SettingsView: React.FC<SettingsViewProps> = ({
 
   return (
     <div className="flex-1 flex flex-col bg-background h-full">
-      <header className="flex justify-between items-center p-4 border-b border-border-color flex-shrink-0">
-        <h1 className="text-xl font-semibold text-text-main">Settings</h1>
-        <div className="flex flex-col items-end gap-1">
-          <Button onClick={handleSave} disabled={isSaveDisabled} variant="primary">
-            {isDirty ? 'Save Changes' : 'Saved'}
-          </Button>
+      <header className="flex items-center justify-between px-4 h-7 border-b border-border-color bg-secondary flex-shrink-0">
+        <h1 className="text-xs font-semibold text-text-secondary tracking-wider uppercase">Settings</h1>
+        <div className="flex items-center gap-2">
           {pythonValidationError && (
-            <p className="text-[10px] text-destructive-text max-w-xs text-right">
+            <p className="text-[10px] text-destructive-text max-w-xs text-right leading-tight">
               Python settings error: {pythonValidationError}
             </p>
           )}
+          <Button onClick={handleSave} disabled={isSaveDisabled} variant="primary" className="whitespace-nowrap">
+            {isDirty ? 'Save Changes' : 'Saved'}
+          </Button>
         </div>
       </header>
       <div className="flex-1 flex overflow-hidden">