Upgrade to Bootstrap 5.3.2 (#14294)

OrchardCMS · Sep 26, 2023 · 76557b8 · 76557b8
1 parent 2ed568f
commit 76557b8
Show file tree

Hide file tree

Showing 356 changed files with 32,960 additions and 82,906 deletions.
diff --git a/src/OrchardCore.Modules/OrchardCore.Admin/Drivers/AdminSiteSettingsDisplayDriver.cs b/src/OrchardCore.Modules/OrchardCore.Admin/Drivers/AdminSiteSettingsDisplayDriver.cs
@@ -36,7 +36,7 @@ public override async Task<IDisplayResult> EditAsync(AdminSettings settings, Bui
 
             return Initialize<AdminSettingsViewModel>("AdminSettings_Edit", model =>
             {
-                model.DisplayDarkMode = settings.DisplayDarkMode;
+                model.DisplayThemeToggler = settings.DisplayThemeToggler;
                 model.DisplayMenuFilter = settings.DisplayMenuFilter;
                 model.DisplayNewMenu = settings.DisplayNewMenu;
                 model.DisplayTitlesInTopbar = settings.DisplayTitlesInTopbar;
@@ -58,7 +58,7 @@ public override async Task<IDisplayResult> UpdateAsync(AdminSettings settings, B
 
                 await context.Updater.TryUpdateModelAsync(model, Prefix);
 
-                settings.DisplayDarkMode = model.DisplayDarkMode;
+                settings.DisplayThemeToggler = model.DisplayThemeToggler;
                 settings.DisplayMenuFilter = model.DisplayMenuFilter;
                 settings.DisplayNewMenu = model.DisplayNewMenu;
                 settings.DisplayTitlesInTopbar = model.DisplayTitlesInTopbar;

diff --git a/src/OrchardCore.Modules/OrchardCore.Admin/ViewModels/AdminSettingsViewModel.cs b/src/OrchardCore.Modules/OrchardCore.Admin/ViewModels/AdminSettingsViewModel.cs
@@ -2,7 +2,7 @@ namespace OrchardCore.Admin.ViewModels
 {
     public class AdminSettingsViewModel
     {
-        public bool DisplayDarkMode { get; set; }
+        public bool DisplayThemeToggler { get; set; }
 
         public bool DisplayMenuFilter { get; set; }
 

diff --git a/src/OrchardCore.Modules/OrchardCore.Admin/Views/AdminBranding.cshtml b/src/OrchardCore.Modules/OrchardCore.Admin/Views/AdminBranding.cshtml
@@ -1,9 +1,9 @@
 @inject IOptions<AdminOptions> AdminOptions
 <link asp-src="~/OrchardCore.Admin/favicon.ico" type="image/x-icon" rel="shortcut icon" />
 
-<a class="ta-navbar-brand" href="@Url.Content("~/" + AdminOptions.Value.AdminUrlPrefix)">
+<a class="ta-navbar-brand navbar-brand" href="@Url.Content("~/" + AdminOptions.Value.AdminUrlPrefix)">
     <div class="d-flex align-items-center">
-        <img src="@Url.Content("~/OrchardCore.Admin/logo.png")" alt="@Site.SiteName" />
+        <img src="@Url.Content("~/OrchardCore.Admin/logo.png")" alt="@Site.SiteName" class="pe-2" />
         <span>@Site.SiteName</span>
     </div>
 </a>
diff --git a/src/OrchardCore.Modules/OrchardCore.Admin/Views/AdminDashboard.cshtml b/src/OrchardCore.Modules/OrchardCore.Admin/Views/AdminDashboard.cshtml
@@ -1,4 +1,4 @@
-<div class="alert alert-success">
+<div class="alert alert-primary">
     <h4>@T["Welcome to Orchard Core"]</h4>
     <p>@T["Feel free to browse the menu and discover all its possibilities."]</p>
 </div>
diff --git a/src/OrchardCore.Modules/OrchardCore.Admin/Views/AdminSettings.Edit.cshtml b/src/OrchardCore.Modules/OrchardCore.Admin/Views/AdminSettings.Edit.cshtml
@@ -1,11 +1,11 @@
 @model OrchardCore.Admin.ViewModels.AdminSettingsViewModel
 
-<fieldset class="mb-3" asp-validation-class-for="DisplayDarkMode">
+<fieldset class="mb-3" asp-validation-class-for="DisplayThemeToggler">
     <div class="form-check">
-        <input asp-for="DisplayDarkMode" class="form-check-input" type="checkbox" />
-        <label asp-for="DisplayDarkMode" class="form-check-label">@T["Enable dark mode admin theme"]</label>
+        <input asp-for="DisplayThemeToggler" class="form-check-input" type="checkbox" />
+        <label asp-for="DisplayThemeToggler" class="form-check-label">@T["Enable theme toggler"]</label>
     </div>
-    <span class="hint">@T["Whether a dark mode admin theme can be displayed."]</span>
+    <span class="hint">@T["Whether or not to display a theme toggler."]</span>
 </fieldset>
 
 <fieldset class="mb-3" asp-validation-class-for="DisplayMenuFilter">

diff --git a/src/OrchardCore.Modules/OrchardCore.Admin/Views/NavigationItemText-admin.Id.cshtml b/src/OrchardCore.Modules/OrchardCore.Admin/Views/NavigationItemText-admin.Id.cshtml
@@ -1 +1,4 @@
-<span class="icon"><i class="fa-solid fa-tachometer" aria-hidden="true"></i></span><span class="title">@T["Admin"]</span>
+<span class="icon">
+    <i class="fa-solid fa-tachometer" aria-hidden="true"></i>
+</span>
+<span class="title">@T["Admin"]</span>
diff --git a/src/OrchardCore.Modules/OrchardCore.AdminDashboard/Assets/scss/dashboard.scss b/src/OrchardCore.Modules/OrchardCore.AdminDashboard/Assets/scss/dashboard.scss
@@ -1,6 +1,7 @@
 @import '../../node_modules/bootstrap/scss/_functions';
 @import '../../node_modules/bootstrap/scss/_variables';
 @import '../../node_modules/bootstrap/scss/mixins/_breakpoints';
+@import '../../node_modules/bootstrap/scss/mixins/_color-mode';
 
 // Small devices (landscape phones, 576px and up)
 @include media-breakpoint-only(sm) {
@@ -79,7 +80,7 @@
     }
 }
 
-:root[data-theme="default"] {
+@include color-mode(light) {
     & .dashboard-wrapper {
         & .card {
             & .card-header {
@@ -93,7 +94,7 @@
     }
 }
 
-:root[data-theme="darkmode"] {
+@include color-mode(dark) {
     & .dashboard-wrapper {
         & .card {
             & .card-header {

diff --git a/src/OrchardCore.Modules/OrchardCore.AdminDashboard/package-lock.json b/src/OrchardCore.Modules/OrchardCore.AdminDashboard/package-lock.json
diff --git a/src/OrchardCore.Modules/OrchardCore.AdminDashboard/package.json b/src/OrchardCore.Modules/OrchardCore.AdminDashboard/package.json
@@ -2,6 +2,6 @@
   "name": "orchardcore.admindashboard",
   "version": "1.0.0",
   "dependencies": {
-    "bootstrap": "5.1.3"
+    "bootstrap": "5.3.2"
   }
 }
diff --git a/src/OrchardCore.Modules/OrchardCore.AdminDashboard/wwwroot/Styles/dashboard.css b/src/OrchardCore.Modules/OrchardCore.AdminDashboard/wwwroot/Styles/dashboard.css
@@ -58,17 +58,17 @@
   padding-top: 12px;
 }
 
-:root[data-theme=default] .dashboard-wrapper .card .card-header {
+[data-bs-theme=light] .dashboard-wrapper .card .card-header {
   background-color: #fff !important;
 }
-:root[data-theme=default] .dashboard-wrapper .card .card-footer {
+[data-bs-theme=light] .dashboard-wrapper .card .card-footer {
   background-color: #fff !important;
 }
 
-:root[data-theme=darkmode] .dashboard-wrapper .card .card-header {
+[data-bs-theme=dark] .dashboard-wrapper .card .card-header {
   background-color: rgb(24, 26, 27) !important;
 }
-:root[data-theme=darkmode] .dashboard-wrapper .card .card-footer {
+[data-bs-theme=dark] .dashboard-wrapper .card .card-footer {
   background-color: rgb(24, 26, 27) !important;
 }
 

diff --git a/src/OrchardCore.Modules/OrchardCore.AdminDashboard/wwwroot/Styles/dashboard.min.css b/src/OrchardCore.Modules/OrchardCore.AdminDashboard/wwwroot/Styles/dashboard.min.css
diff --git a/src/OrchardCore.Modules/OrchardCore.AdminMenu/Assets/scss/admin-menu-icon-picker.scss b/src/OrchardCore.Modules/OrchardCore.AdminMenu/Assets/scss/admin-menu-icon-picker.scss
@@ -1,57 +1,21 @@
-:root[data-theme='default'] {
+@import "fontawesome-iconpicker";
 
-    @import "../../../../OrchardCore.Themes/TheAdmin/Assets/scss/modules/theme/default/_variables.scss";
-    @import "../../node_modules/bootstrap/scss/functions";
-    @import "../../node_modules/bootstrap/scss/variables";
+#iconPickerModal {
 
-    #iconPickerModal {
-
-        .iconpicker-popover.popover {
-            width: 100%;
-            border: none;
-        }
-
-        .iconpicker-items {
-            min-height: 258px;
-        }
-
-        .iconpicker-item {
-            background-color: $body-bg;
-        }
-    }
-
-    .remove-icon, .sample-icon {
-        width: 40px;
+    .iconpicker-item {
+        background-color: var(--bs-body-bg, #fff);
     }
 
-    @import "fontawesome-iconpicker.scss";
-}
-
-:root[data-theme='darkmode'] {
-
-    @import "../../../../OrchardCore.Themes/TheAdmin/Assets/scss/modules/theme/darkmode/_variables.scss";
-    @import "../../node_modules/bootstrap/scss/functions";
-    @import "../../node_modules/bootstrap/scss/variables";
-
-    #iconPickerModal {
-
-        .iconpicker-popover.popover {
-            width: 100%;
-            border: none;
-        }
-
-        .iconpicker-items {
-            min-height: 258px;
-        }
-
-        .iconpicker-item {
-            background-color: $body-bg;
-        }
+    .iconpicker-popover.popover {
+        width: 100%;
+        border: none;
     }
-    
-    .remove-icon, .sample-icon {
-        width: 40px;
+
+    .iconpicker-items {
+        min-height: 258px;
     }
+}
 
-    @import "fontawesome-iconpicker.scss";
+.remove-icon, .sample-icon {
+    width: 40px;
 }
diff --git a/src/OrchardCore.Modules/OrchardCore.AdminMenu/Assets/scss/admin-menu-permission-picker.scss b/src/OrchardCore.Modules/OrchardCore.AdminMenu/Assets/scss/admin-menu-permission-picker.scss
@@ -1,5 +1,5 @@
 .vue-multiselect .multiselect--active {
-    z-index: 1000; // bootstrap's default for dropdowns
+    z-index: var(--bs-dropdown-zindex, 1000);
 }
 
 [v-cloak] {

diff --git a/src/OrchardCore.Modules/OrchardCore.AdminMenu/Assets/scss/admin-menu.scss b/src/OrchardCore.Modules/OrchardCore.AdminMenu/Assets/scss/admin-menu.scss
@@ -4,13 +4,11 @@
     -moz-transition: opacity 0.2s 0.2s;
     -webkit-transition: opacity 0.2s 0.2s;
     -o-transition: opacity 0.2s 0.2s;
-    -ms-transition: opacity 0.2s 0.2s;
-    -khtml-transition: opacity 0.2s 0.2s;
 }
 
 .disabled-tree {
     background-color: #f5f5f5;
-    
+
     .tree-name-link {
         color: #808080;
     }
@@ -44,7 +42,6 @@
     }
 }
 
-
 @media only screen and ( min-width: 768px ) {
     .card-columns {
         column-count: 2;
@@ -55,4 +52,4 @@
             }
         }
     }
-}
+}