From d422d841ff011545c2bd0d1846e965555c2cf98c Mon Sep 17 00:00:00 2001
From: OlgunR <OlgunR@DD-PC-ENT05N>
Date: Fri, 27 Mar 2026 14:13:16 +0100
Subject: [PATCH] Add zebra-striping to grid rows with theme support

Introduced --grid-stripe-bg CSS variable for both light and dark themes to enable zebra-striping in dxbl-grid components. Applied background color to even-numbered grid rows for improved readability.
---
 DbFirst.BlazorWebApp/wwwroot/app.css | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/DbFirst.BlazorWebApp/wwwroot/app.css b/DbFirst.BlazorWebApp/wwwroot/app.css
index 30c9d2d..a7d5c68 100644
--- a/DbFirst.BlazorWebApp/wwwroot/app.css
+++ b/DbFirst.BlazorWebApp/wwwroot/app.css
@@ -12,6 +12,7 @@ html, body {
     --band-editor-bg: #f8f9fa;
     --band-editor-border: #dee2e6;
     --band-toggle-hover-bg: #e9ecef;
+    --grid-stripe-bg: rgba(0, 0, 0, 0.03);
 }
 
 .app-dark {
@@ -20,6 +21,7 @@ html, body {
     --band-editor-bg: #2d2d2d;
     --band-editor-border: #444444;
     --band-toggle-hover-bg: #3a3a3a;
+    --grid-stripe-bg: rgba(255, 255, 255, 0.04);
 }
 
 a, .btn-link {
@@ -141,6 +143,11 @@ h1:focus {
     margin-top: 4px;
 }
 
+/* Grid Zebra-Striping */
+dxbl-grid tbody tr:nth-child(even) td {
+    background-color: var(--grid-stripe-bg) !important;
+}
+
 /* MassData-spezifisch */
 .page-size-selector {
     display: flex;