add proper tab implementation

src/ui/ui_theme.h

@@ -0,0 +1,71 @@
+#pragma once
+// ui_theme.h - Theme constants and defines for the UI layer.
+// Centralizes colors, sizing, padding, and radius values used across the app.
+
+#include "clay.h"
+
+////////////////////////////////
+// Tab styling
+
+#define TAB_ACTIVE_TOP       Clay_Color{ 70, 120, 160, 255}
+#define TAB_ACTIVE_BOTTOM    Clay_Color{ 30,  55,  80, 255}
+#define TAB_INACTIVE_BG      Clay_Color{ 45,  45,  48, 255}
+#define TAB_INACTIVE_HOVER   Clay_Color{ 55,  55,  60, 255}
+#define TAB_HEIGHT           26
+#define TAB_CORNER_RADIUS    5
+#define TAB_PADDING_H        10
+
+////////////////////////////////
+// Custom render types (for gradient rects via CLAY_RENDER_COMMAND_TYPE_CUSTOM)
+
+enum CustomRenderType {
+    CUSTOM_RENDER_VGRADIENT = 1,
+};
+
+struct CustomGradientData {
+    CustomRenderType type;
+    Clay_Color top_color;
+    Clay_Color bottom_color;
+};
+
+////////////////////////////////
+// Font sizes
+
+#define FONT_SIZE_NORMAL     15
+#define FONT_SIZE_SMALL      12
+
+////////////////////////////////
+// Widget sizing
+
+#define WIDGET_BUTTON_HEIGHT    30
+#define WIDGET_CHECKBOX_HEIGHT  28
+#define WIDGET_CHECKBOX_SIZE    18
+#define WIDGET_RADIO_OUTER      16
+#define WIDGET_RADIO_INNER       8
+#define WIDGET_INPUT_HEIGHT     30
+#define WIDGET_DROPDOWN_HEIGHT  30
+#define WIDGET_DROPDOWN_ITEM_H  28
+
+////////////////////////////////
+// Corner radii
+
+#define CORNER_RADIUS_SM     3
+#define CORNER_RADIUS_MD     6
+#define CORNER_RADIUS_ROUND  8
+
+////////////////////////////////
+// Modal / window styling
+
+#define MODAL_OVERLAY_COLOR  Clay_Color{  0,   0,   0, 120}
+#define MODAL_WIDTH          400
+#define MODAL_CORNER_RADIUS  CORNER_RADIUS_MD
+
+#define WINDOW_CORNER_RADIUS CORNER_RADIUS_MD
+#define WINDOW_TITLE_HEIGHT  32
+
+////////////////////////////////
+// Panel sizing
+
+#define PANEL_BROWSER_WIDTH     200
+#define PANEL_RIGHT_COL_WIDTH   250
+#define PANEL_LOG_HEIGHT        180