🐛 (Theme): UserDefined doesn't work (#2207)

masastack · Nov 1, 2024 · 06328bc · 06328bc
1 parent 0941bb5
commit 06328bc
Showing 1 changed file with 34 additions and 22 deletions.
diff --git a/src/Masa.Blazor/Core/ThemeCssBuilder.cs b/src/Masa.Blazor/Core/ThemeCssBuilder.cs
@@ -18,35 +18,30 @@ public static string Build(Theme theme)
             $$"""
               :root {
                   color-scheme: {{(isDark ? "dark" : "normal")}};
-                  --m-theme-primary: {{options.Primary}};
-                  --m-theme-primary-text: {{options.Primary}};
+                  {{BuildCssVariable("primary", options.Primary)}}
+                  {{BuildCssVariable("secondary", options.Secondary)}}
+                  {{BuildCssVariable("accent", options.Accent)}}
+                  {{BuildCssVariable("info", options.Info)}}
+                  {{BuildCssVariable("success", options.Success)}}
+                  {{BuildCssVariable("warning", options.Warning)}}
+                  {{BuildCssVariable("error", options.Error)}}
+                  {{BuildCssVariable(options.UserDefined)}}
+
                   --m-theme-on-primary: {{options.OnPrimary}};
-                  --m-theme-secondary: {{options.Secondary}};
-                  --m-theme-secondary-text: {{options.Secondary}};
                   --m-theme-on-secondary: {{options.OnSecondary}};
-                  --m-theme-accent: {{options.Accent}};
-                  --m-theme-accent-text: {{options.Accent}};
                   --m-theme-on-accent: {{options.OnAccent}};
-                  --m-theme-error: {{options.Error}};
-                  --m-theme-error-text: {{options.Error}};
                   --m-theme-on-error: {{options.OnError}};
-                  --m-theme-info: {{options.Info}};
-                  --m-theme-info-text: {{options.Info}};
                   --m-theme-on-info: {{options.OnInfo}};
-                  --m-theme-success: {{options.Success}};
-                  --m-theme-success-text: {{options.Success}};
                   --m-theme-on-success: {{options.OnSuccess}};
-                  --m-theme-warning: {{options.Warning}};
-                  --m-theme-warning-text: {{options.Warning}};
                   --m-theme-on-warning: {{options.OnWarning}};
-              
+
                   --m-theme-surface: {{options.Surface}};
                   --m-theme-on-surface: {{options.OnSurface}};
                   --m-theme-surface-container: {{options.SurfaceContainer}};
                   --m-theme-inverse-surface: {{options.InverseSurface}};
                   --m-theme-inverse-on-surface: {{options.InverseOnSurface}};
                   --m-theme-inverse-primary: {{options.InversePrimary}};
-              
+
                   --m-theme-light-surface: {{light.Surface}};
                   --m-theme-light-on-surface: {{light.OnSurface}};
                   --m-theme-light-surface-container: {{light.SurfaceContainer}};
@@ -60,6 +55,7 @@ public static string Build(Theme theme)
                   --m-theme-dark-inverse-on-surface: {{dark.InverseOnSurface}};
                   --m-theme-dark-inverse-primary: {{dark.InversePrimary}};
               }
+
               """,
             $"{combinePrefix}a {{ color: {options.Primary}; }}",
             Build(combinePrefix, nameof(options.Primary).ToLowerInvariant(), hasOnColor: true),
@@ -70,16 +66,27 @@ public static string Build(Theme theme)
             Build(combinePrefix, nameof(options.Warning).ToLowerInvariant(), hasOnColor: true),
             Build(combinePrefix, nameof(options.Error).ToLowerInvariant(), hasOnColor: true),
             Build(combinePrefix, nameof(options.Surface).ToLowerInvariant(), hasOnColor: true),
+            Build(combinePrefix, options.UserDefined)
         };
 
-        foreach (var pair in options.UserDefined)
-        {
-            lstCss.Add(Build(combinePrefix, pair.Key.ToLowerInvariant()));
-        }
-
         return string.Concat(lstCss);
     }
 
+    private static string BuildCssVariable(string role, string? value)
+    {
+        return string.IsNullOrWhiteSpace(value)
+            ? string.Empty
+            : $"""
+               --m-theme-{role}: {value};
+                   --m-theme-{role}-text: {value};
+               """;
+    }
+
+    private static string BuildCssVariable(Dictionary<string, string> userDefined)
+    {
+        return string.Join("", userDefined.Select(x => BuildCssVariable(x.Key, x.Value)));
+    }
+
     private static string Build(string combinePrefix, string selector, bool hasOnColor = false)
     {
         var stringBuilder = new StringBuilder();
@@ -94,7 +101,7 @@ private static string Build(string combinePrefix, string selector, bool hasOnCol
         {
             stringBuilder.Append($"""
 
-                                  color: var(--m-theme-on-{selector}) !important;
+                                      color: var(--m-theme-on-{selector}) !important;
                                   """);
         }
 
@@ -109,4 +116,9 @@ private static string Build(string combinePrefix, string selector, bool hasOnCol
 
         return stringBuilder.ToString();
     }
+
+    private static string Build(string combinePrefix, Dictionary<string, string> userDefined)
+    {
+        return string.Join("", userDefined.Select(x => Build(combinePrefix, x.Key.ToLowerInvariant())));
+    }
 }