Refactoring some theme colors

This commit is contained in:
2026-07-24 14:11:17 -07:00
parent 3697575f54
commit 2283d156ea
2 changed files with 8 additions and 9 deletions
+3 -4
View File
@@ -15,9 +15,9 @@ const ResponsiveGridLayout = WidthProvider(Responsive);
export default function MyDashboard() {
// 🌗 Let's adjust for our light and dark mode
const frameBg = useColorModeValue("gray.100", "#1E1E2B");
const titleColor = useColorModeValue("gray.800", "gray.100");
const iconColor = useColorModeValue("gray.600", "gray.400");
const frameBg = useColorModeValue("FFFFFF0A", "#FFFFFF0A");
const titleColor = useColorModeValue("gray.800", "#FFFFFF");
const iconColor = useColorModeValue("gray.600", "#FFFFFF");
const iconHoverBg = useColorModeValue("gray.100", "gray.700");
// ☁️ Database Connection
@@ -154,7 +154,6 @@ export default function MyDashboard() {
{widgets.map(widget => (
<Box
key={widget.id}
bg="white"
borderRadius="md"
boxShadow={isEditing ? "outline" : "sm"} // Visual cue when editing
border={isEditing ? "2px dashed gray" : "1px solid"}
+5 -5
View File
@@ -33,7 +33,7 @@ const sidebarRecipe = defineSlotRecipe({
base: {
root: {
// 1. Semi-transparent backgrounds
bg: { base: "linear-gradient(to bottom right, #99000040 20%, #FF660040 60%, #EEEE0040 100%)", _dark: "rgba(20, 20, 20, 0.4)" },
bg: { base: "linear-gradient(to bottom right, #99000040 20%, #FF660040 60%, #EEEE0040 100%)", _dark: "linear-gradient(to bottom right, #9900003C 20%, #FF66003C 60%, #FFC0003C 100%)" },
// 2. The glass blur effect
backdropFilter: "blur(12px)",
@@ -258,10 +258,10 @@ const config = defineConfig({
primaryLt: { value: {base: "#98cdffff", _dark: "#98cdffff"}},
secondaryBG: { value: {base: "#EDF1F1", _dark: "#121212"}},
border: {value: {base: "#000000", _dark: "#cbcbcb84"}},
text: {value: {base: "#000000", _dark: "lightgrey"}},
textInverted: {value: "#000000"},
icon: {value: {base: "#000000", _dark: "lightgrey"}},
testBackground: { value: {base: "#F9F9F9", _dark: "#191613"} },
text: {value: {base: "#000000", _dark: "#FFFFFF"}},
textInverted: {value: {base: "#000000", _dark: "#FFFFFF"}},
icon: {value: {base: "#000000", _dark: "#FFFFFF"}},
testBackground: { value: {base: "#F9F9F9", _dark: "#141414"} },
testSidebar: { value: {base: "#FBFBFB", _dark: "#272421"} },
testButton: { value: {base: "#FFFFFF", _dark: "#C09754"} },