Fix css for menu-plan toolbar and recipe toolbar (darkmode)

ownrecipes · Nov 14, 2024 · ef9fbf1 · ef9fbf1
1 parent 4784d64
commit ef9fbf1
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 4 deletions.
diff --git a/src/menu_plan/css/menu.css b/src/menu_plan/css/menu.css
@@ -5,8 +5,11 @@
 .menu-plan .recipes .section-header {
   font-size: 1.25rem;
   font-weight: bold;
-  margin-top: 1.25em;
   margin-bottom: 1em;
+  margin-top: 1em;
+}
+.menu-plan .recipes .section-header:not(:first-of-type) {
+  margin-top: 2.5em;
 }
 
 .menu-plan .recipes .row {
@@ -25,6 +28,7 @@
 .menu-plan .recipes .recipe.card .card-footer {
   background-color: transparent;
   border-top: 0;
+  padding: 0;
 }
 .menu-plan .recipes .recipe.card.completed .card-footer .toolbar {
   display: none;
@@ -37,7 +41,7 @@
     bottom: 0;
     right:  0;
     border-top: 0;
-    padding-right: 0;
+    padding-right: 0.25em;
   }
   .menu-plan .recipes .recipe.card .card-footer .toolbar {
     visibility: hidden;

diff --git a/src/recipe/css/recipe_header.css b/src/recipe/css/recipe_header.css
@@ -35,10 +35,12 @@
     padding: 0.25em 0.25em 0.25em 0;
     border-top-left-radius: 0.25em;
   }
-  html[data-theme="dark"] .recipe-header .row .img-wrapper .options .toolbar,
-  html[data-theme="dark"] .recipe-header .row .img-wrapper .options .toolbar .btn:not(.btn-primary) {
+  html[data-theme="dark"] .recipe-header .row .img-wrapper .options .toolbar {
     background-color: rgba(0, 0, 15, 0.55);
   }
+  html[data-theme="dark"] .recipe-header .row .img-wrapper .options .toolbar .btn:not(.btn-primary) {
+    background-color: var(--midground);
+  }
   html[data-theme="dark"] .recipe-header .row .img-wrapper .options .toolbar .btn:not(.btn-primary):hover,
   html[data-theme="dark"] .recipe-header .row .img-wrapper .options .toolbar .btn:not(.btn-primary):focus {
     background-color: var(--midground) !important;