Update the shitty looking style on the dashboard.

app.js

@@ -59,6 +59,7 @@ require("./routes")(app);
 cssmerger([
     "./views/shared/css/general.css",
     "./views/shared/css/loader.css",
+    "./views/shared/css/banner.css",
     "./views/dashboardPage/css"
 ], "./views/dashboardPage/bundle.css", cssOptions);
 

views/dashboardPage/css/dashboard.css

@@ -1,6 +1,3 @@
-/* 
-General page styling
-*/
 *{margin:0;padding:0;font-family:'Saira',sans-serif;}
 
 html{
@@ -43,7 +40,7 @@ body{
     border: none;
     text-decoration: none;
     padding: 10px 25px;
-    color: rgb(255, 99, 107);
+    color: black;
     cursor: pointer;
     text-align: center;
     font-size: 15px;
@@ -58,6 +55,7 @@ body{
 
     .sidebarButton:active{
         background: rgb(0, 27, 45);
+        color: white;
     }
 
 .sidebar{
@@ -69,7 +67,7 @@ body{
     transition: width 0.2s;
     overflow: hidden;
     background: rgb(0, 27, 45);
-    color: rgb(255, 99, 107);
+    color: white;
 }
 
 .sidebarWide{
@@ -172,7 +170,7 @@ Multi-strand use classes
     justify-content: space-around;
     align-items: center;
     background: rgb(0, 27, 45);
-    color: rgb(255, 99, 107);
+    color: white;
     margin: 2px;
     padding: 5px;
     text-align: center;
@@ -197,12 +195,12 @@ Multi-strand use classes
 
     .choosable:hover{
         background: rgb(179, 191, 209);
-        color: rgb(255, 99, 107);
+        color: black;
     }
 
     .choosable.active{
         background: rgb(240, 252, 255);
-        color: rgb(255, 99, 107);
+        color: black;
     }
 
 .searchBar{

views/dashboardPage/css/menu.css

@@ -39,7 +39,8 @@
     }
 
     .menuHead p{
-        margin-left: 25px;
+        margin-left: 10px;
+        font-size: 20px;
     }
 
     .menuHead button{
@@ -70,7 +71,7 @@
         align-items: center;
         background: none;
         border-style: none;
-        color: rgb(255, 99, 107);
+        color: white;
         font-size: 18px;
         margin: 15px 0;
         padding-left: 15px;
@@ -94,11 +95,13 @@
 
         .menuButton:hover{
             background: rgb(179, 191, 209);
+            color: black;
         }
 
     .menu > .active{
         background: rgb(240, 252, 255);
         cursor: default;
+        color: black;
     }
 
     .menu > .active:hover{

views/dashboardPage/css/mobile/landscapePhone.css

@@ -70,10 +70,6 @@
             max-width: 300px;
         }
 
-        .menuHead a p{
-            font-size: 35px;
-        }
-
         #recipeListLabel, #subIngredientList{
             display: flex;
         }

views/dashboardPage/css/mobile/portraitPhone.css

@@ -28,9 +28,5 @@
         #transactionsStrand .strandHead{
             margin-top: 25px;
         }
-
-        .menuHead a p{
-            font-size: 40px;
-        }
     }
 }

views/dashboardPage/css/sidebars/newIngredient.css

@@ -12,7 +12,8 @@
         width: 100%;
         background: white;
         padding: 10px;
-        margin: 2px
+        margin: 2px;
+        color: black;
     }
 
     #newIngredient .button{

views/dashboardPage/css/sidebars/newOrder.css

@@ -34,6 +34,7 @@
         #newOrderIngredients .choosable{
             background: rgb(240, 252, 255);
             justify-content: left;
+            color: black;
         }
 
             #newOrderIngredients .choosable:hover{

views/dashboardPage/css/sidebars/newTransaction.css

@@ -24,4 +24,5 @@
         padding: 5px 0;
         font-weight: bold;
         font-size: 17px;
+        color: black;
     }

views/dashboardPage/css/sidebars/orderFilter.css

@@ -19,6 +19,7 @@
 
         #orderFilterIngredients .choosable{
             background: rgb(240, 252, 255);
+            color: black;
             justify-content: left;
         }
 

views/dashboardPage/css/sidebars/transactionFilter.css

@@ -14,6 +14,7 @@
         #transFilterRecipeList .choosable{
             background:rgb(240, 252, 255);
             justify-content: left;
+            color: black;
         }
 
         #transFilterRecipeList .choosable:hover{

views/dashboardPage/css/strands/analytics.css

@@ -3,7 +3,7 @@
     display: inline-block;
     width: 239px;
     height: 34px;
-    color: rgb(255, 99, 107);
+    color: white;
 }
 
     .switch input{

views/dashboardPage/css/strands/ingredients.css

@@ -6,7 +6,6 @@
 }
 
     #categoryList{
-        align-items:center;
         overflow-y: auto;
         width: 80%;
     }
@@ -30,7 +29,7 @@
         padding: 20px 0 20px 100px;
         background: rgb(0, 27, 45);
         flex-grow: 1;
-        color: rgb(255, 99, 107);
+        color: white;
         margin-right: 25px
     }
 

views/dashboardPage/ejs/strands/ingredients.ejs

@@ -21,7 +21,7 @@
                 <p></p>
 
                 <button>
-                    <svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="rgb(255, 99, 107)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                    <svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                         <polyline points="6 9 12 15 18 9"></polyline>
                     </svg>
                 </button>

views/dashboardPage/js/strands/ingredients.js

@@ -69,10 +69,10 @@ let ingredients = {
 
     toggleCategory: function(div, button){
         if(div.style.display === "none"){
-            button.innerHTML = '<svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="rgb(255, 99, 107)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="18 15 12 9 6 15"></polyline></svg>';
+            button.innerHTML = '<svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="18 15 12 9 6 15"></polyline></svg>';
             div.style.display = "flex";
         }else if(div.style.display === "flex"){
-            button.innerHTML = '<svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="rgb(255, 99, 107)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>';
+            button.innerHTML = '<svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>';
             div.style.display = "none";
         }
     },

views/shared/css/general.css

@@ -36,21 +36,23 @@ button::-moz-focus-inner{
     border: none;
     text-decoration: none;
     padding: 10px 25px;
-    color: rgb(255, 99, 107);
     cursor: pointer;
     text-align: center;
     font-size: 15px;
     min-width: 100px;
     margin: 5px;
     max-height: 52px;
+    color: white;
 }
 
     .button:hover{
         background: rgb(179, 191, 209);
+        color: black;
     }
 
     .button:active{
         background: rgb(240, 252, 255);
+        color: black;
     }
 
 .dangerButton{