updated to loop through btns

Instead of listing each button it now loops through

client/src/theme.js

@@ -49,47 +49,21 @@ const sidebarRecipe = defineSlotRecipe({
   }
 });
 
-
-// const sidebarRecipe = defineRecipe({
-//   base: {
-//     bg: "{primaryBG}",
-//     borderRight: "1px solid",
-//     borderColor: "{border}", 
-//     width: "100%",
-//     height: "100%",
-//     display: "flex",
-//     flexDirection: "column",
-//     justifyContent: "start", 
-//     alignItems: "start",
-//     gap: 2,
-//     p: 2,
-//   },
-//   variants: {
-//     dark: {
-//       borderRight: "2px solid",
-//     }
-//   }
-// });
-
-// const sidebarBtnRecipe = defineRecipe({
-//   base: {
-//     bg: "{sidebarBtnBG}"
-//   }
-// });
-
 const config = defineConfig({
   theme: {
     semanticTokens: {
       colors: {
         base100: { value: {base: "#f7f9fa", _dark: "#787b73"}},
-        base200: { value: {base: "#eef2f6", _dark: "#484c42"}},
+        base200: { value: {base: "#eef2f6", _dark: "#242424"}},
         base300: { value: {base: "#dfe5ed", _dark: "#60645a"}},
         primary: { value: {base: "#9cd855", _dark: "#629631"}},
         primaryLt: { value: {base: "#c9e9a0", _dark: "#92948e"}},
         secondaryBG: { value: {base: "#EDF1F1", _dark: "#121212"}},
         border: {value: {base: "#000000", _dark: "#CBCBCB"}},
         text: {value: {base: "#19332D", _dark: "#CBCBCB"}},
-        iconFill: { value: {base: "#FFFFFF", _dark: "#CBCBCB"}},
+        iconFillPush: { value: {base: "#19332D", _dark: "#CBCBCB"}},
+        iconFillAdmin: { value: {base: "#eef2f6", _dark: "#CBCBCB"}},
+        iconStroke: { value: {base: "#19332D", _dark: "#CBCBCB"}},
         icon: {value: {base: "#19332D", _dark: "#CBCBCB"}},
       },
     },