From 9cf17fe2b923a7dd551c6924708f7d794a1cf0a6 Mon Sep 17 00:00:00 2001
From: Sara <sara@saragerretsen.nl>
Date: Fri, 19 Sep 2025 14:12:26 +0200
Subject: [PATCH] feat: separated panel and list container styles

---
 src/dice_container.c | 18 +++++++-----------
 src/style.h          |  6 +++++-
 2 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/dice_container.c b/src/dice_container.c
index 9608891..d73f874 100644
--- a/src/dice_container.c
+++ b/src/dice_container.c
@@ -36,10 +36,6 @@ void AddDieButton(enum Dice_Die die) {
 			.childAlignment = { CLAY_ALIGN_X_CENTER, CLAY_ALIGN_Y_CENTER },
 		},
 		.image = { GetDiceImage(die, Clay_Hovered()) },
-		.border = {
-			PanelBorder(0),
-			CLAY_BORDER_ALL(1),
-		}
 	}) {
 		Clay_OnHover(&HandleAddDieButtonInteraction, die);
 		CLAY_TEXT(Dice_ToString(die), CLAY_TEXT_CONFIG({
@@ -53,22 +49,22 @@ void AddDieButton(enum Dice_Die die) {
 static inline
 void DiceSelectorContainer() {
 	CLAY(CLAY_ID("DiceSelector"), {
-		.PANEL(0),
 		.layout = {
 			.sizing = { CLAY_SIZING_FIT(), CLAY_SIZING_GROW() },
-			.childAlignment = { CLAY_ALIGN_X_CENTER, CLAY_ALIGN_Y_CENTER },
 		},
+		.PANEL(0),
 	}) {
-		CLAY(CLAY_ID("DiceSelectorInner"), {
+		CLAY_AUTO_ID({
 			.layout = {
 				.layoutDirection = CLAY_TOP_TO_BOTTOM,
-				.childAlignment = { CLAY_ALIGN_X_CENTER, CLAY_ALIGN_Y_CENTER },
-				.sizing = { CLAY_SIZING_FIT(), CLAY_SIZING_FIT() },
+				.sizing = { CLAY_SIZING_GROW(), CLAY_SIZING_GROW() },
 				.padding = { 2, 2, 5, 5 },
+				.childAlignment = { CLAY_ALIGN_X_CENTER, CLAY_ALIGN_Y_TOP },
 			},
 			.clip = {
-				true, true, Clay_GetScrollOffset(),
+				false, true, Clay_GetScrollOffset(),
 			},
+			.LISTCONTAINER(0),
 		}) {
 			AddDieButton(D4);
 			AddDieButton(D6);
@@ -118,9 +114,9 @@ static inline
 void ActiveDiceContainer() {
 	CLAY(CLAY_ID("ActiveDice"), {
 		.layout = {
+			.sizing = { CLAY_SIZING_GROW(), CLAY_SIZING_GROW() },
 			.layoutDirection = CLAY_TOP_TO_BOTTOM,
 			.childAlignment = { CLAY_ALIGN_X_CENTER, CLAY_ALIGN_Y_CENTER },
-			.sizing = { CLAY_SIZING_GROW(), CLAY_SIZING_GROW() },
 		},
 		.PANEL(0),
 	}) {
diff --git a/src/style.h b/src/style.h
index 9603d91..7bdfea6 100644
--- a/src/style.h
+++ b/src/style.h
@@ -36,9 +36,13 @@ constexpr Clay_Padding panelPadding = {
 	24, 24,
 };
 
+#define LISTCONTAINER(depth_)\
+border = { PanelBorder(depth_), CLAY_BORDER_ALL(2) },\
+.cornerRadius = defaultRadiusAll
+
 #define PANEL(depth_)\
 backgroundColor = PanelBackground(depth_),\
-.border = { PanelBackground(depth_), CLAY_BORDER_ALL(2) },\
+.border = { PanelBorder(depth_), CLAY_BORDER_OUTSIDE(2) },\
 .cornerRadius = defaultRadiusAll
 
 ////////////////////////////////////