From c372a4db3a28dd292793756f0ca36e9460d24b33 Mon Sep 17 00:00:00 2001 From: Sara Date: Sun, 26 Oct 2025 21:11:54 +0100 Subject: [PATCH] feat: style is now a struct --- elements.cpp | 14 +++---- elements.h | 4 +- style.cpp | 22 +++++----- style.h | 112 +++++++++++++++++++++++++-------------------------- 4 files changed, 76 insertions(+), 76 deletions(-) diff --git a/elements.cpp b/elements.cpp index 4650361..ac8fd47 100644 --- a/elements.cpp +++ b/elements.cpp @@ -7,13 +7,13 @@ void TextButton(Clay_String text, Clay_Color color, OnHoveredFn onHovered, intpt Clay_Color hovered{ cera::ToHoveredColor(color) }; CLAY_AUTO_ID({ .layout = { - .padding = cera::buttonPadding, + .padding = theme->buttonPadding, .childAlignment = { CLAY_ALIGN_X_CENTER, CLAY_ALIGN_Y_CENTER }, }, .backgroundColor = Clay_Hovered() ? hovered : color, - .cornerRadius = cera::buttonRadii, + .cornerRadius = theme->buttonRadii, .border = { cera::ToHoveredColor(Clay_Hovered() ? hovered : color), CLAY_BORDER_ALL(2) @@ -21,7 +21,7 @@ void TextButton(Clay_String text, Clay_Color color, OnHoveredFn onHovered, intpt }) { Clay_OnHover(onHovered, onHoveredData); cera::Body(text, { - .textColor = cera::textColor, + .textColor = theme->textColor, .textAlignment = CLAY_TEXT_ALIGN_CENTER, }); } @@ -56,16 +56,16 @@ void Toggle(Clay_String label, Clay_Color selected, bool &state) { }, .backgroundColor = (state ? selected - : cera::color::transparent + : color::transparent ), - .cornerRadius = cera::buttonRadii, + .cornerRadius = theme->buttonRadii, .border = { color, CLAY_BORDER_OUTSIDE(3) }, }) { } Body(label, { - .textColor = cera::textColor + .textColor = theme->textColor }); } } @@ -78,7 +78,7 @@ void Body(Clay_String string, Clay_TextElementConfig baseCfg) { void Header(Clay_String string, size_t header, Clay_TextElementConfig baseCfg) { baseCfg.fontId = cera::FONT_BOLD; - baseCfg.fontSize = cera::headerSizes[(header)-1]; + baseCfg.fontSize = theme->headerSizes[(header)-1]; CLAY_TEXT(string, CLAY_TEXT_CONFIG(baseCfg)); } } diff --git a/elements.h b/elements.h index c9a6881..5c1cff5 100644 --- a/elements.h +++ b/elements.h @@ -8,8 +8,8 @@ namespace cera { typedef void(*OnHoveredFn)(Clay_ElementId element, Clay_PointerData pointer, intptr_t data); void TextButton(Clay_String text, Clay_Color color, OnHoveredFn onHovered, intptr_t onHoveredData = 0); void Toggle(Clay_String label, Clay_Color selected, bool &state); -void Body(Clay_String string, Clay_TextElementConfig baseCfg = {.textColor = cera::textColor}); -void Header(Clay_String string, size_t header, Clay_TextElementConfig baseCfg = {.textColor = cera::textColor}); +void Body(Clay_String string, Clay_TextElementConfig baseCfg = {.textColor = theme->textColor}); +void Header(Clay_String string, size_t header, Clay_TextElementConfig baseCfg = {.textColor = theme->textColor}); } #endif // !ELEMENTS_H diff --git a/style.cpp b/style.cpp index 616b284..166ae4c 100644 --- a/style.cpp +++ b/style.cpp @@ -4,22 +4,26 @@ #include namespace cera { +Style themeDark{}; +Style themeLight{}; +Style *theme{&themeDark}; + Clay_ElementDeclaration ListContainer(Clay_ElementDeclaration baseCfg) { baseCfg.border = { - .color = panelBorder, + .color = theme->panelBorder, .width = CLAY_BORDER_ALL(2) }; - baseCfg.cornerRadius = defaultRadiusAll; + baseCfg.cornerRadius = CLAY_CORNER_RADIUS(theme->defaultRadius); return baseCfg; } Clay_ElementDeclaration PanelContainer(Clay_ElementDeclaration baseCfg) { - baseCfg.backgroundColor = panelBackground; + baseCfg.backgroundColor = theme->panelBackground; baseCfg.border = { - .color = panelBorder, + .color = theme->panelBorder, .width = CLAY_BORDER_OUTSIDE(2) }; - baseCfg.cornerRadius = defaultRadiusAll; + baseCfg.cornerRadius = CLAY_CORNER_RADIUS(theme->defaultRadius); baseCfg.layout.padding = CLAY_PADDING_ALL(8); return baseCfg; } @@ -27,7 +31,7 @@ Clay_ElementDeclaration PanelContainer(Clay_ElementDeclaration baseCfg) { Clay_ElementDeclaration LeftPanelContainer(Clay_ElementDeclaration baseCfg) { baseCfg = PanelContainer(baseCfg); baseCfg.border.width = { 0, 2, 2, 2, 0 }; - baseCfg.cornerRadius = { 0, defaultRadius, 0, defaultRadius }; + baseCfg.cornerRadius = { 0, theme->defaultRadius, 0, theme->defaultRadius }; baseCfg.layout.sizing.height = CLAY_SIZING_GROW(); return baseCfg; } @@ -35,7 +39,7 @@ Clay_ElementDeclaration LeftPanelContainer(Clay_ElementDeclaration baseCfg) { Clay_ElementDeclaration RightPanelContainer(Clay_ElementDeclaration baseCfg) { baseCfg = PanelContainer(baseCfg); baseCfg.border.width = { 2, 0, 2, 2, 0 }; - baseCfg.cornerRadius = { defaultRadius, 0, defaultRadius, 0 }; + baseCfg.cornerRadius = { theme->defaultRadius, 0, theme->defaultRadius, 0 }; baseCfg.layout.sizing.height = CLAY_SIZING_GROW(); return baseCfg; } @@ -44,11 +48,11 @@ Clay_ElementDeclaration Window() { return { .layout = { .sizing = { CLAY_SIZING_GROW(), CLAY_SIZING_GROW() }, - .padding = CLAY_PADDING_ALL(windowPadding), + .padding = CLAY_PADDING_ALL(theme->windowPadding), .childGap = 0, .layoutDirection = CLAY_LEFT_TO_RIGHT }, - .backgroundColor = windowColor + .backgroundColor = theme->windowColor }; } diff --git a/style.h b/style.h index 409396b..162040f 100644 --- a/style.h +++ b/style.h @@ -5,83 +5,79 @@ #include namespace cera { -//////////////////////////////////// -// WINDOW STYLE -//////////////////////////////////// +struct Style { + //////////////////////////////////// + // WINDOW STYLE + //////////////////////////////////// -constexpr uint16_t windowPadding{1}; -constexpr Clay_Color windowColor{20, 20, 20, 255}; + uint16_t windowPadding{1}; + Clay_Color windowColor{20, 20, 20, 255}; -//////////////////////////////////// -// CONTAINER STYLE -//////////////////////////////////// + //////////////////////////////////// + // CONTAINER STYLE + //////////////////////////////////// -constexpr uint16_t containerGap{10}; -constexpr double defaultRadius{5.0}; + uint16_t containerGap{10}; + float defaultRadius{5.0}; -constexpr Clay_Color panelBackground{ 0,0,0,0 }; -constexpr Clay_Color panelBorder { 150, 150, 150, 150 }; + Clay_Color panelBackground{ 0,0,0,0 }; + Clay_Color panelBorder { 150, 150, 150, 150 }; -constexpr Clay_Padding panelPadding = { - 24, 24, - 24, 24, + Clay_Padding panelPadding = { + 24, 24, + 24, 24, + }; + + //////////////////////////////////// + // TEXT STYLE + //////////////////////////////////// + + float paragraphGap = 10; + + uint16_t headerSizes[4]{64, 32, 28, 16}; + + Clay_Color textColor{170, 170, 170, 255}; + + //////////////////////////////////// + // BUTTONS + //////////////////////////////////// + + Clay_Color warningButton = { + 177, 56, 52, 255 + }; + Clay_Color proceedButton = { + 49, 181, 99, 255 + }; + Clay_Color actionButton = { + 49, 142, 181, 255 + }; + + Clay_Padding buttonPadding = { + 24, 24, + 4, 4, + }; + Clay_CornerRadius buttonRadii = { + 3, 3, 3, 3 + }; }; +extern Style themeDark; +extern Style themeLight; +extern Style *theme; + Clay_ElementDeclaration ListContainer(Clay_ElementDeclaration baseCfg = {}); Clay_ElementDeclaration PanelContainer(Clay_ElementDeclaration baseCfg = {}); Clay_ElementDeclaration LeftPanelContainer(Clay_ElementDeclaration baseCfg = {}); Clay_ElementDeclaration RightPanelContainer(Clay_ElementDeclaration baseCfg = {}); Clay_ElementDeclaration Window(); -//////////////////////////////////// -// TEXT STYLE -//////////////////////////////////// - -constexpr float paragraphGap = 10; -constexpr uint16_t baseFontSize = 16; - -constexpr uint16_t headerSizes[] = {64, 32, 28, 16}; - -constexpr Clay_Color textColor{170, 170, 170, 255}; - -//////////////////////////////////// -// BUTTONS -//////////////////////////////////// - -constexpr Clay_Color warningButton = { - 177, 56, 52, 255 -}; -constexpr Clay_Color proceedButton = { - 49, 181, 99, 255 -}; -constexpr Clay_Color actionButton = { - 49, 142, 181, 255 -}; - -constexpr Clay_Padding buttonPadding = { - 24, 24, - 4, 4, -}; -constexpr Clay_CornerRadius buttonRadii = { - 3, 3, 3, 3 -}; - Clay_Color ToHoveredColor(Clay_Color color); -//////////////////////////////////// -// COMPILATIONS -// | Functions and expressions that combine styling data from the settings above. -//////////////////////////////////// - constexpr Clay_Sizing layoutExpand = { .width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_GROW(0) }; - -constexpr Clay_CornerRadius defaultRadiusAll = { - defaultRadius, defaultRadius, - defaultRadius, defaultRadius -}; +constexpr uint16_t baseFontSize = 16; namespace color { constexpr Clay_Color transparent{ 255, 255, 255, 0 };