Replace MudBlazor with Bootstrap

btcpayserver · Nov 8, 2023 · ca48d28 · ca48d28
1 parent 0816b9d
commit ca48d28
Show file tree

Hide file tree

Showing 41 changed files with 13,944 additions and 939 deletions.
diff --git a/BTCPayApp.Maui/wwwroot/index.html b/BTCPayApp.Maui/wwwroot/index.html
@@ -3,14 +3,14 @@
 <head>
   <base href="/"/>
   <meta charset="utf-8"/>
-  <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no,viewport-fit=cover" name="viewport"/>
+  <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no,viewport-fit=cover"/>
   <title>BTCPay Server</title>
-  <link href="/_content/MudBlazor/MudBlazor.min.css" rel="stylesheet"/>
-  <link href="/_content/BTCPayApp.UI/css/mudblazor-overrides.css" rel="stylesheet"/>
-  <link href="/_content/BTCPayApp.UI/css/theme.css" rel="stylesheet"/>
-  <link href="/_content/BTCPayApp.UI/css/fonts.css" rel="stylesheet"/>
-  <link href="/_content/BTCPayApp.UI/css/site.css" rel="stylesheet"/>
-  <link href="/_content/BTCPayApp.UI/favicon.png" rel="icon" type="image/png"/>
+  <link href="_content/BTCPayApp.UI/favicon.png" rel="icon" type="image/png"/>
+  <link href="_content/BTCPayApp.UI/bootstrap/bootstrap.css" rel="stylesheet"/>
+  <link href="_content/BTCPayApp.UI/css/fonts.css" rel="stylesheet"/>
+  <link href="_content/BTCPayApp.UI/css/site.css" rel="stylesheet"/>
+  <link href="_content/BTCPayApp.UI/css/theme.css" rel="stylesheet"/>
+  <link href="_content/BTCPayApp.UI/BTCPayApp.UI.bundle.scp.css" rel="stylesheet" />
 </head>
 <body>
   <div class="status-bar-safe-area"></div>
@@ -20,8 +20,8 @@
     <a class="reload" href="">Reload</a>
     <a class="dismiss">🗙</a>
   </div>
-  <script src="/_content/BTCPayApp.UI/js/site.js"></script>
-  <script src="/_content/MudBlazor/MudBlazor.min.js"></script>
-  <script src="/_framework/blazor.webview.js" autostart="false"></script>
+  <script src="_framework/blazor.webview.js" autostart="false"></script>
+  <script src="_content/BTCPayApp.UI/bootstrap/bootstrap.bundle.min.js"></script>
+  <script src="_content/BTCPayApp.UI/js/site.js"></script>
 </body>
 </html>
diff --git a/BTCPayApp.Photino/wwwroot/index.html b/BTCPayApp.Photino/wwwroot/index.html
@@ -3,14 +3,14 @@
 <head>
   <base href="/"/>
   <meta charset="utf-8"/>
-  <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no,viewport-fit=cover" />
+  <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no,viewport-fit=cover"/>
   <title>BTCPay Server</title>
-  <link href="/_content/MudBlazor/MudBlazor.min.css" rel="stylesheet"/>
-  <link href="/_content/BTCPayApp.UI/css/mudblazor-overrides.css" rel="stylesheet"/>
-  <link href="/_content/BTCPayApp.UI/css/theme.css" rel="stylesheet"/>
-  <link href="/_content/BTCPayApp.UI/css/fonts.css" rel="stylesheet"/>
-  <link href="/_content/BTCPayApp.UI/css/site.css" rel="stylesheet"/>
-  <link href="/_content/BTCPayApp.UI/favicon.png" rel="icon" type="image/png"/>
+  <link href="_content/BTCPayApp.UI/favicon.png" rel="icon" type="image/png"/>
+  <link href="_content/BTCPayApp.UI/bootstrap/bootstrap.css" rel="stylesheet"/>
+  <link href="_content/BTCPayApp.UI/css/fonts.css" rel="stylesheet"/>
+  <link href="_content/BTCPayApp.UI/css/site.css" rel="stylesheet"/>
+  <link href="_content/BTCPayApp.UI/css/theme.css" rel="stylesheet"/>
+  <link href="_content/BTCPayApp.UI/BTCPayApp.UI.bundle.scp.css" rel="stylesheet" />
 </head>
 <body>
   <div class="status-bar-safe-area"></div>
@@ -20,8 +20,8 @@
     <a class="reload" href="">Reload</a>
     <a class="dismiss">🗙</a>
   </div>
-  <script src="/_content/BTCPayApp.UI/js/site.js"></script>
-  <script src="/_content/MudBlazor/MudBlazor.min.js"></script>
-  <script src="/_framework/blazor.webview.js"></script>
+  <script src="_framework/blazor.webview.js" autostart="false"></script>
+  <script src="_content/BTCPayApp.UI/bootstrap/bootstrap.bundle.min.js"></script>
+  <script src="_content/BTCPayApp.UI/js/site.js"></script>
 </body>
 </html>
diff --git a/BTCPayApp.Server/Pages/_Host.cshtml b/BTCPayApp.Server/Pages/_Host.cshtml
@@ -9,14 +9,14 @@
 <head>
     <base href="~/"/>
     <meta charset="utf-8"/>
-    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no,viewport-fit=cover" />
+    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no,viewport-fit=cover"/>
     <title>BTCPay Server</title>
-    <link href="~/_content/MudBlazor/MudBlazor.min.css" rel="stylesheet" asp-append-version="true"/>
-    <link href="~/_content/BTCPayApp.UI/css/mudblazor-overrides.css" rel="stylesheet" asp-append-version="true"/>
-    <link href="~/_content/BTCPayApp.UI/css/theme.css" rel="stylesheet" asp-append-version="true"/>
-    <link href="~/_content/BTCPayApp.UI/css/fonts.css" rel="stylesheet" asp-append-version="true"/>
-    <link href="~/_content/BTCPayApp.UI/css/site.css" rel="stylesheet" asp-append-version="true"/>
-    <link href="~/_content/BTCPayApp.UI/favicon.png" rel="icon" type="image/png" asp-append-version="true"/>
+    <link href="_content/BTCPayApp.UI/favicon.png" rel="icon" type="image/png" asp-append-version="true"/>
+    <link href="_content/BTCPayApp.UI/bootstrap/bootstrap.css" rel="stylesheet" asp-append-version="true"/>
+    <link href="_content/BTCPayApp.UI/css/fonts.css" rel="stylesheet" asp-append-version="true"/>
+    <link href="_content/BTCPayApp.UI/css/site.css" rel="stylesheet" asp-append-version="true"/>
+    <link href="_content/BTCPayApp.UI/css/theme.css" rel="stylesheet" asp-append-version="true"/>
+    <link href="_content/BTCPayApp.UI/BTCPayApp.UI.bundle.scp.css" rel="stylesheet" />
     <component type="typeof(HeadOutlet)" render-mode="ServerPrerendered"/>
 </head>
 <body>
@@ -31,8 +31,8 @@
         <a href="" class="reload">Reload</a>
         <a class="dismiss">🗙</a>
     </div>
-    <script src="~/_content/BTCPayApp.UI/js/site.js" asp-append-version="true"></script>
-    <script src="~/_content/MudBlazor/MudBlazor.min.js" asp-append-version="true"></script>
-    <script src="~/_framework/blazor.server.js" asp-append-version="true"></script>
+    <script src="_framework/blazor.server.js" asp-append-version="true"></script>
+    <script src="_content/BTCPayApp.UI/bootstrap/bootstrap.bundle.min.js" asp-append-version="true"></script>
+    <script src="_content/BTCPayApp.UI/js/site.js" asp-append-version="true"></script>
 </body>
 </html>
diff --git a/BTCPayApp.UI/App.razor b/BTCPayApp.UI/App.razor
@@ -1,4 +1,12 @@
-<Fluxor.Blazor.Web.StoreInitializer/>
+@using BTCPayApp.UI.Features
+@using BTCPayApp.Core.Contracts
+@inherits Fluxor.Blazor.Web.Components.FluxorComponent
+@inject IStateSelection<RootState, HashSet<RootState.LoadingHandles>> LoadingStateSelection
+@inject IDispatcher Dispatcher
+@inject IConfigProvider ConfigProvider
+
+<PageTitle>BTCPay Server</PageTitle>
+<Fluxor.Blazor.Web.StoreInitializer/>
 <Router AppAssembly="@typeof(App).Assembly">
     <Found Context="routeData">
         <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)"/>
@@ -7,7 +15,23 @@
     <NotFound>
         <PageTitle>Not found</PageTitle>
         <LayoutView Layout="@typeof(MainLayout)">
-            <MudAlert Severity="Severity.Warning">This page does not exist.</MudAlert>
+            <div class="alert alert-warning">This page does not exist.</div>
         </LayoutView>
     </NotFound>
 </Router>
+
+@code {
+    protected override async Task OnInitializedAsync()
+    {
+        LoadingStateSelection.Select(state => state.Loading);
+        var state = await ConfigProvider.Get<UIState>(StateMiddleware.UiStateConfigKey);
+        if (state != null)
+        {
+            if (!string.IsNullOrEmpty(state.SelectedTheme))
+            {
+                Dispatcher.Dispatch(new UIState.ApplyUserTheme(state.SelectedTheme));
+            }
+        }
+        await base.OnInitializedAsync();
+    }
+}
diff --git a/BTCPayApp.UI/BTCPayApp.UI.csproj b/BTCPayApp.UI/BTCPayApp.UI.csproj
@@ -15,19 +15,6 @@
   <ItemGroup>
     <PackageReference Include="Fluxor.Blazor.Web" Version="5.8.0" />
     <PackageReference Include="Fluxor.Blazor.Web.ReduxDevTools" Version="5.8.0" />
-    <PackageReference Include="MudBlazor" Version="6.8.0" />
-  </ItemGroup>
-
-  <ItemGroup>
-    <_ContentIncludedByDefault Remove="wwwroot\css\open-iconic\FONT-LICENSE" />
-    <_ContentIncludedByDefault Remove="wwwroot\css\open-iconic\font\css\open-iconic-bootstrap.min.css" />
-    <_ContentIncludedByDefault Remove="wwwroot\css\open-iconic\font\fonts\open-iconic.eot" />
-    <_ContentIncludedByDefault Remove="wwwroot\css\open-iconic\font\fonts\open-iconic.otf" />
-    <_ContentIncludedByDefault Remove="wwwroot\css\open-iconic\font\fonts\open-iconic.svg" />
-    <_ContentIncludedByDefault Remove="wwwroot\css\open-iconic\font\fonts\open-iconic.ttf" />
-    <_ContentIncludedByDefault Remove="wwwroot\css\open-iconic\font\fonts\open-iconic.woff" />
-    <_ContentIncludedByDefault Remove="wwwroot\css\open-iconic\ICON-LICENSE" />
-    <_ContentIncludedByDefault Remove="wwwroot\css\open-iconic\README.md" />
   </ItemGroup>
 
     <ItemGroup>