feat: better acp sidebar in dark mode

NodeBB · Aug 20, 2023 · c92ecfb · c92ecfb
1 parent 44a9d88
commit c92ecfb
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 18 deletions.
diff --git a/public/scss/admin/common.scss b/public/scss/admin/common.scss
@@ -64,18 +64,16 @@
 }
 
 @include color-mode(dark) {
-	#content {
-		.btn-light {
-			@extend .btn-dark;
-		}
-		.text-bg-light {
-			@extend .text-bg-dark;
-		}
-		.btn-ghost, .btn-ghost-sm, .btn-outline, .btn-outline-sm {
-			color: $btn-ghost-color-dark;
-			&:hover, &.active {
-				background-color: $btn-ghost-hover-color-dark;
-			}
+	.btn-light {
+		@extend .btn-dark;
+	}
+	.text-bg-light {
+		@extend .text-bg-dark;
+	}
+	.btn-ghost, .btn-ghost-sm, .btn-outline, .btn-outline-sm {
+		color: $btn-ghost-color-dark;
+		&:hover, &.active {
+			background-color: $btn-ghost-hover-color-dark;
 		}
 	}
 }

diff --git a/public/scss/admin/overrides.scss b/public/scss/admin/overrides.scss
@@ -16,10 +16,10 @@ $yellow:  #ffc107 !default;
 $green:   #198754 !default;
 $cyan:    #0dcaf0 !default;
 
-$light:         $gray-100 !default;
-$dark:          $gray-900 !default;
+$light: $gray-100 !default;
+$dark: $gray-800 !default;
 
-$body-color: $gray-800;
+$body-color: $gray-800 !default;
 $text-muted: $gray-600 !default;
 
 $btn-ghost-color: rgb(73, 80, 87);

diff --git a/src/views/admin/partials/mobile-footer.tpl b/src/views/admin/partials/mobile-footer.tpl
@@ -1,5 +1,5 @@
 <div component="bottombar" class="bottombar d-flex d-lg-none fixed-bottom ff-secondary gap-1 align-items-center">
-	<div class="bottombar-nav p-2 text-dark bg-light d-flex justify-content-between align-items-center w-100">
+	<div class="bottombar-nav p-2 border-top text-bg-light d-flex justify-content-between align-items-center w-100">
 		<div class="">
 			<a href="#" role="button" class="p-2 nav-link nav-btn" data-bs-toggle="offcanvas" data-bs-target="#offcanvas" >
 				<i class="fa fa-fw fa-lg fa-bars"></i>

diff --git a/src/views/admin/partials/offcanvas.tpl b/src/views/admin/partials/offcanvas.tpl
@@ -1,4 +1,4 @@
-<div data-bs-theme="light" class="offcanvas offcanvas-start gap-1" tabindex="-1" id="offcanvas" aria-labelledby="offcanvasLabel" style="width: 275px;">
+<div class="offcanvas offcanvas-start gap-1" tabindex="-1" id="offcanvas" aria-labelledby="offcanvasLabel" style="width: 275px;">
 	<div class="offcanvas-body flex-0 pb-0 overflow-visible d-flex flex-column gap-1 ff-secondary">
 		<!-- IMPORT admin/partials/quick_actions/alerts.tpl -->
 

diff --git a/src/views/admin/partials/sidebar-left.tpl b/src/views/admin/partials/sidebar-left.tpl
@@ -1,4 +1,4 @@
-<div data-bs-theme="light" id="sidebar-left" style="width:240px;" class="vh-100 sticky-top start-0 d-none d-lg-flex text-bg-light p-2 flex-column justify-content-start text-sm border-end gap-1 flex-shrink-0">
+<div id="sidebar-left" style="width:240px;" class="vh-100 sticky-top start-0 d-none d-lg-flex text-bg-light p-2 flex-column justify-content-start text-sm border-end gap-1 flex-shrink-0">
 	<div class="d-flex flex-column gap-1 ff-secondary">
 
 		<!-- IMPORT admin/partials/quick_actions/alerts.tpl -->