Update theme colors across all projects #8276

bitfoundation · Aug 10, 2024 · 83b9249 · 83b9249
1 parent 2a34130
commit 83b9249
Show file tree

Hide file tree

Showing 13 changed files with 26 additions and 32 deletions.
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Scripts/app.ts b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Scripts/app.ts
@@ -49,7 +49,7 @@ BitTheme.init({
         if (newTheme === 'dark') {
             document.body.classList.add('bit-theme-dark');
             document.body.classList.remove('bit-theme-light');
-            document.querySelector("meta[name=theme-color]")!.setAttribute('content','#0d1117');
+            document.querySelector("meta[name=theme-color]")!.setAttribute('content','#010409');
         } else {
             document.body.classList.add('bit-theme-light');
             document.body.classList.remove('bit-theme-dark');

diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/MainPage.xaml b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/MainPage.xaml
@@ -4,17 +4,13 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
     xmlns:b="clr-namespace:Microsoft.AspNetCore.Components.WebView.Maui;assembly=Microsoft.AspNetCore.Components.WebView.Maui"
     xmlns:client="clr-namespace:Bit.BlazorUI.Demo.Client.Core;assembly=Bit.BlazorUI.Demo.Client.Core"
-    BackgroundColor="{AppThemeBinding Light={OnPlatform Android=#0D2960,
-                                                        Default=#ffffff},
-                                      Dark={OnPlatform Android=#0D2960,
-                                                       Default=#000000}}">
+    BackgroundColor="{AppThemeBinding Light=#ffffff,
+                                      Dark=#010409}">
 
     <b:BlazorWebView
         x:Name="blazorWebView"
-        BackgroundColor="{AppThemeBinding Light={OnPlatform Android=#0D2960,
-                                                            Default=#ffffff},
-                                          Dark={OnPlatform Android=#0D2960,
-                                                           Default=#000000}}"
+        BackgroundColor="{AppThemeBinding Light=#ffffff,
+                                          Dark=#010409}"
         HostPage="wwwroot/index.html">
         <b:BlazorWebView.RootComponents>
             <b:RootComponent ComponentType="{x:Type client:Routes}" Selector="#app-container" />

diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/MauiProgram.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/MauiProgram.cs
@@ -109,7 +109,10 @@ private static void SetupBlazorWebView()
                     }
                 }
 #elif ANDROID
-            webView.SetBackgroundColor(Android.Graphics.Color.Transparent);
+            if (AppInfo.Current.RequestedTheme == AppTheme.Dark)
+            {
+                webView.SetBackgroundColor(Android.Graphics.Color.ParseColor("#010409"));
+            }
 
             webView.OverScrollMode = Android.Views.OverScrollMode.Never;
 

diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Services/MauiDeviceCoordinator.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Services/MauiDeviceCoordinator.cs
@@ -35,7 +35,7 @@ public async Task ApplyTheme(bool isDark)
             window!.DecorView!.SystemUiFlags &= ~Android.Views.SystemUiFlags.LightStatusBar;
         }
 
-        window.SetStatusBarColor(isDark ? Android.Graphics.Color.ParseColor("#0D1117") : Android.Graphics.Color.White);
+        window.SetStatusBarColor(isDark ? Android.Graphics.Color.ParseColor("#010409") : Android.Graphics.Color.White);
 #elif IOS
         var statusBarStyle = isDark ? UIKit.UIStatusBarStyle.LightContent : UIKit.UIStatusBarStyle.DarkContent;
         await Device.InvokeOnMainThreadAsync(() =>

diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/wwwroot/index.html b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/wwwroot/index.html
@@ -141,7 +141,7 @@
         gtag('config', 'G-G1ET5L69QF');
     </script>
     <!-- Google tag -->
-    <div id="app-container" class="bit-css-clr-bg-primary bit-css-clr-fg-primary">
+    <div id="app-container" class="bit-css-clr-bg-pri bit-css-clr-fg-pri">
         <div class="bit-lds-wrapper">
             <div class="bit-lds-grid">
                 <div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div>

diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/manifest.json b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/manifest.json
@@ -9,7 +9,7 @@
     "theme_color": "#2EA3FF",
     "related_applications": [],
     "name": "bit BlazorUI Demo",
-    "background_color": "#0D1117",
+    "background_color": "#010409",
     "short_name": "bit BlazorUI Demo",
     "prefer_related_applications": false,
     "display_override": [ "window-controls-overlay" ],

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Scripts/app.ts b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Scripts/app.ts
@@ -17,7 +17,7 @@ BitTheme.init({
         if (newTheme === 'dark') {
             document.body.classList.add('theme-dark');
             document.body.classList.remove('theme-light');
-            document.querySelector("meta[name=theme-color]")!.setAttribute('content', '#0d1117');
+            document.querySelector("meta[name=theme-color]")!.setAttribute('content', '#010409');
         } else {
             document.body.classList.add('theme-light');
             document.body.classList.remove('theme-dark');

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/MainPage.xaml b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/MainPage.xaml
@@ -4,17 +4,13 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
     xmlns:b="clr-namespace:Microsoft.AspNetCore.Components.WebView.Maui;assembly=Microsoft.AspNetCore.Components.WebView.Maui"
     xmlns:core="clr-namespace:Boilerplate.Client.Core;assembly=Boilerplate.Client.Core"
-    BackgroundColor="{AppThemeBinding Light={OnPlatform Android=#0D2960,
-                                                        Default=#ffffff},
-                                      Dark={OnPlatform Android=#0D2960,
-                                                       Default=#000000}}">
+    BackgroundColor="{AppThemeBinding Light=#ffffff,
+                                      Dark=#010409}">
 
     <b:BlazorWebView
         x:Name="blazorWebView"
-        BackgroundColor="{AppThemeBinding Light={OnPlatform Android=#0D2960,
-                                                            Default=#ffffff},
-                                          Dark={OnPlatform Android=#0D2960,
-                                                           Default=#000000}}"
+        BackgroundColor="{AppThemeBinding Light=#ffffff,
+                                          Dark=#010409}"
         HostPage="wwwroot/index.html">
         <b:BlazorWebView.RootComponents>
             <b:RootComponent ComponentType="{x:Type core:Routes}" Selector="#app-container" />

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/MauiProgram.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/MauiProgram.cs
@@ -132,7 +132,10 @@ private static void SetupBlazorWebView()
                 }
             }
 #elif Android
-            webView.SetBackgroundColor(Android.Graphics.Color.Transparent);
+            if (AppInfo.Current.RequestedTheme == AppTheme.Dark)
+            {
+                webView.SetBackgroundColor(Android.Graphics.Color.ParseColor("#010409"));
+            }
 
             webView.OverScrollMode = Android.Views.OverScrollMode.Never;
 

diff --git a/...late/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/Services/MauiDeviceCoordinator.cs b/...late/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/Services/MauiDeviceCoordinator.cs
@@ -36,7 +36,7 @@ public async Task ApplyTheme(bool isDark)
             window!.DecorView!.SystemUiFlags &= ~Android.Views.SystemUiFlags.LightStatusBar;
         }
 
-        window.SetStatusBarColor(isDark ? Android.Graphics.Color.ParseColor("#0D1117") : Android.Graphics.Color.White);
+        window.SetStatusBarColor(isDark ? Android.Graphics.Color.ParseColor("#010409") : Android.Graphics.Color.White);
 #elif IOS
         var statusBarStyle = isDark ? UIKit.UIStatusBarStyle.LightContent : UIKit.UIStatusBarStyle.DarkContent;
         await Device.InvokeOnMainThreadAsync(() =>

diff --git a/...mplates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/wwwroot/index.html b/...mplates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/wwwroot/index.html
@@ -34,10 +34,6 @@
     <!--#endif-->
 
     <style>
-        body {
-            background-color: #0D2960;
-        }
-
         .bit-lds-grid div {
             background-color: #123456;
         }
@@ -131,8 +127,8 @@
     </style>
 </head>
 
-<body class="bit-blazor-hybrid">
-    <div id="app-container" class="bit-css-clr-bg-primary bit-css-clr-fg-primary">
+<body class="bit-css-clr-bg-pri bit-css-clr-fg-pri bit-blazor-hybrid">
+    <div id="app-container">
         <div class="bit-lds-wrapper">
             <div class="bit-lds-grid">
                 <div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div>

diff --git a/...emplates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/index.html b/...emplates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/index.html
@@ -24,7 +24,7 @@
     <link href="images/icons/bit-icon-512.png" rel="apple-touch-icon" sizes="512x512" />
     <link href="manifest.json" rel="manifest" />
 </head>
-<body class="bit-css-clr-bg-primary bit-css-clr-fg-primary bit-blazor-web">
+<body class="bit-css-clr-bg-pri bit-css-clr-fg-pri bit-blazor-web">
     <link href="_content/Bit.BlazorUI/styles/bit.blazorui.css" rel="stylesheet" />
     <link href="_content/Bit.BlazorUI.Icons/styles/bit.blazorui.icons.css" rel="stylesheet" />
     <link href="_content/Bit.BlazorUI.Assets/styles/bit.blazorui.assets.css" rel="stylesheet" />

diff --git a/...lates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/manifest.json b/...lates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/manifest.json
@@ -9,7 +9,7 @@
     "theme_color": "#2EA3FF",
     "related_applications": [],
     "name": "bit Boilerplate",
-    "background_color": "#0D1117",
+    "background_color": "#010409",
     "short_name": "bit Boilerplate",
     "prefer_related_applications": false,
     "display_override": [ "window-controls-overlay" ],