From 075433c7801c962d6f6a9876eaf8269e97bc62e5 Mon Sep 17 00:00:00 2001
From: OlgunR <OlgunR@DD-PC-ENT05N>
Date: Thu, 23 Apr 2026 15:59:50 +0200
Subject: [PATCH] Improve spacing for Dark Mode button in top row

Wrapped the Dark Mode toggle button in a span with left margin
for better separation from the theme combo box. Added a new
.btn-gap CSS class to standardize button spacing in the top row.
---
 DbFirst.BlazorWebApp/Components/Layout/MainLayout.razor | 6 ++++--
 DbFirst.BlazorWebApp/wwwroot/app.css                    | 4 ++++
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/DbFirst.BlazorWebApp/Components/Layout/MainLayout.razor b/DbFirst.BlazorWebApp/Components/Layout/MainLayout.razor
index 18bc487..2f4e964 100644
--- a/DbFirst.BlazorWebApp/Components/Layout/MainLayout.razor
+++ b/DbFirst.BlazorWebApp/Components/Layout/MainLayout.razor
@@ -13,8 +13,10 @@
                         Value="@ThemeState.CurrentThemeName"
                         ValueChanged="@((string t) => ThemeState.SetTheme(t))"
                         style="width: 130px;" />
-            <DxButton Text="@(ThemeState.IsDarkMode ? "Dark Mode aus" : "Dark Mode an")"
-                      Click="ToggleTheme" />
+            <span style="margin-left: 12px;">
+                <DxButton Text="@(ThemeState.IsDarkMode ? "Dark Mode aus" : "Dark Mode an")"
+                          Click="ToggleTheme" />
+            </span>
             <a href="https://learn.microsoft.com/aspnet/core/" target="_blank">About</a>
         </div>
 
diff --git a/DbFirst.BlazorWebApp/wwwroot/app.css b/DbFirst.BlazorWebApp/wwwroot/app.css
index a7d5c68..a0da4df 100644
--- a/DbFirst.BlazorWebApp/wwwroot/app.css
+++ b/DbFirst.BlazorWebApp/wwwroot/app.css
@@ -185,3 +185,7 @@ dxbl-grid tbody tr:nth-child(even) td {
     align-items: center;
     justify-content: center;
 }
+
+.top-row .btn-gap {
+    margin-left: 8px;
+}
\ No newline at end of file