Merge pull request #184 from erikdarlingdata/fix/web-header-landing

Web UI refresh: font, header nav, footer

Author: erikdarlingdata

src/PlanViewer.Web/Layout/MainLayout.razor

@@ -4,7 +4,14 @@
     <div class="header-content">
         <a href="https://www.erikdarling.com" target="_blank" rel="noopener"><img src="darling-data-logo.jpg" alt="Darling Data" class="header-logo" /></a>
         <span class="header-divider"></span>
-        <span class="header-title">Performance Studio</span>
+        <span class="header-title">Free SQL Server Query Plan Analysis</span>
+        <nav class="header-nav">
+            <a href="https://erikdarling.com/blog/" target="_blank" rel="noopener">Blog</a>
+            <a href="https://training.erikdarling.com/sqlconsulting" target="_blank" rel="noopener">Consulting</a>
+            <a href="https://training.erikdarling.com/catalog" target="_blank" rel="noopener">Training</a>
+            <a href="https://training.erikdarling.com/sql-monitoring" target="_blank" rel="noopener">Monitoring</a>
+            <a href="https://erikdarling.com/request-a-call/" target="_blank" rel="noopener">Request a Call</a>
+        </nav>
     </div>
 </header>
 
@@ -20,7 +27,10 @@
 </main>
 
 <footer>
-    <a href="https://www.erikdarling.com" target="_blank" rel="noopener">erikdarling.com</a>
-    <span class="footer-sep">&middot;</span>
-    <a href="https://github.com/erikdarlingdata/PerformanceStudio" target="_blank" rel="noopener">GitHub</a>
+    <div>Copyright &copy; 2019-@DateTime.Now.Year Darling Data</div>
+    <div class="footer-links">
+        <a href="https://www.erikdarling.com" target="_blank" rel="noopener">erikdarling.com</a>
+        <span class="footer-sep">&middot;</span>
+        <a href="https://github.com/erikdarlingdata/PerformanceStudio" target="_blank" rel="noopener">GitHub</a>
+    </div>
 </footer>

src/PlanViewer.Web/Pages/Index.razor

@@ -4,7 +4,7 @@
 {
     <div class="landing">
         <div class="landing-content">
-            <h2>Execution Plan Analysis</h2>
+            <h2>Free SQL Server Query Plan Analysis</h2>
             <p class="privacy">Paste or upload a .sqlplan file. Your plan XML never leaves your browser.</p>
 
             @if (errorMessage != null)

src/PlanViewer.Web/wwwroot/css/app.css

@@ -51,7 +51,7 @@
 html, body {
     background: var(--bg);
     color: var(--text);
-    font-family: 'Armata', 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;
+    font-family: 'Montserrat', 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;
     font-size: 14px;
     line-height: 1.5;
 }
@@ -83,9 +83,32 @@ header {
 }
 
 .header-title {
+    font-family: 'Montserrat', sans-serif;
     font-size: 1rem;
+    font-weight: 600;
+    color: #ffffff;
+    letter-spacing: 0.3px;
+}
+
+.header-nav {
+    display: flex;
+    gap: 1.5rem;
+    margin-left: auto;
+}
+
+.header-nav a {
     color: #e0e0e0;
-    letter-spacing: 0.5px;
+    text-decoration: none;
+    font-size: 1rem;
+    font-weight: 500;
+    padding: 0.3rem 0.6rem;
+    border-radius: 4px;
+    transition: color 0.15s, background 0.15s;
+}
+
+.header-nav a:hover {
+    color: #ffffff;
+    background: rgba(255, 255, 255, 0.1);
 }
 
 /* === Footer === */
@@ -94,7 +117,8 @@ footer {
     padding: 1.5rem 2rem;
     border-top: 1px solid var(--border);
     margin-top: 2rem;
-    font-size: 0.8rem;
+    font-size: 1.1rem;
+    font-weight: 500;
     color: var(--text-muted);
 }
 
@@ -136,12 +160,14 @@ main {
     font-size: 1.5rem;
     color: var(--text);
     margin-bottom: 0.25rem;
-    font-weight: 400;
+    font-weight: 700;
 }
 
 .privacy {
-    color: var(--text-muted);
-    font-size: 0.9rem;
+    color: var(--text);
+    font-family: 'Montserrat', sans-serif;
+    font-size: 1.05rem;
+    font-weight: 600;
     margin-bottom: 1.5rem;
 }
 
@@ -838,7 +864,7 @@ textarea::placeholder {
     min-height: 200px;
     color: var(--text-muted);
     font-size: 1.1rem;
-    font-family: 'Armata', sans-serif;
+    font-family: 'Montserrat', sans-serif;
 }
 
 /* === Blazor Error UI === */

src/PlanViewer.Web/wwwroot/index.html

@@ -3,11 +3,11 @@
 <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Performance Studio</title>
+    <title>Free SQL Server Query Plan Analysis — Darling Data</title>
     <base href="/" />
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-    <link href="https://fonts.googleapis.com/css2?family=Armata&display=swap" rel="stylesheet" />
+    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap" rel="stylesheet" />
     <link href="css/app.css" rel="stylesheet" />
 </head>
 <body>