menu bar visual simplifications

src/raddbg/raddbg_core.c

@@ -7616,7 +7616,10 @@ rd_window_frame(void)
                   }
                   
                   // rjf: make ui
-                  for(U64 idx = 0; idx < ArrayCount(items); idx += 1)
+                  UI_TagF("implicit")
+                    UI_VisualMargin(ui_top_font_size()*0.45f)
+                    UI_CornerRadius(ui_top_font_size()*0.5f)
+                    for(U64 idx = 0; idx < ArrayCount(items); idx += 1)
                   {
                     ui_set_next_fastpath_codepoint(items[idx].codepoint);
                     B32 alt_fastpath_key = 0;
@@ -7628,24 +7631,27 @@ rd_window_frame(void)
                     {
                       ui_set_next_flags(UI_BoxFlag_DrawTextFastpathCodepoint);
                     }
-                    UI_Signal sig = rd_menu_bar_button(items[idx].name);
-                    wm_window_push_custom_title_bar_client_area(ws->os, sig.box->rect);
-                    if(menu_open)
+                    UI_TagF(!ui_ctx_menu_is_open(items[idx].menu_key) ? "weak" : "")
                     {
-                      if((ui_hovering(sig) && !ui_ctx_menu_is_open(items[idx].menu_key)) || (open_menu_idx_prime == idx && open_menu_idx_prime != open_menu_idx))
+                      UI_Signal sig = rd_menu_bar_button(items[idx].name);
+                      wm_window_push_custom_title_bar_client_area(ws->os, sig.box->rect);
+                      if(menu_open)
                       {
-                        ui_ctx_menu_open(items[idx].menu_key, sig.box->key, v2f32(0, sig.box->rect.y1-sig.box->rect.y0));
+                        if((ui_hovering(sig) && !ui_ctx_menu_is_open(items[idx].menu_key)) || (open_menu_idx_prime == idx && open_menu_idx_prime != open_menu_idx))
+                        {
+                          ui_ctx_menu_open(items[idx].menu_key, sig.box->key, v2f32(0, sig.box->rect.y1-sig.box->rect.y0));
+                        }
                       }
-                    }
-                    else if(ui_pressed(sig) || alt_fastpath_key)
-                    {
-                      if(ui_ctx_menu_is_open(items[idx].menu_key))
+                      else if(ui_pressed(sig) || alt_fastpath_key)
                       {
-                        ui_ctx_menu_close();
-                      }
-                      else
-                      {
-                        ui_ctx_menu_open(items[idx].menu_key, sig.box->key, v2f32(0, sig.box->rect.y1-sig.box->rect.y0));
+                        if(ui_ctx_menu_is_open(items[idx].menu_key))
+                        {
+                          ui_ctx_menu_close();
+                        }
+                        else
+                        {
+                          ui_ctx_menu_open(items[idx].menu_key, sig.box->key, v2f32(0, sig.box->rect.y1-sig.box->rect.y0));
+                        }
                       }
                     }
                   }
@@ -7661,6 +7667,9 @@ rd_window_frame(void)
           UI_PrefWidth(ui_px(dim_2f32(top_bar_rect).y, 1))
           RD_Font(RD_FontSlot_Icons)
           UI_FontSize(ui_top_font_size()*0.85f)
+          UI_TagF("implicit")
+          UI_CornerRadius(ui_top_font_size()*1.f)
+          UI_VisualMargin(ui_top_font_size()*0.5f)
         {
           Temp scratch = scratch_begin(0, 0);
           CFG_NodePtrList targets = cfg_node_top_level_list_from_string(scratch.arena, str8_lit("target"));
@@ -7748,11 +7757,12 @@ rd_window_frame(void)
           
           // rjf: loaded project viz
           if(do_user_prof)
+            UI_VisualMargin(ui_top_font_size()*0.5f)
+            UI_CornerRadius(ui_top_font_size()*0.5f)
           {
             ui_set_next_pref_width(ui_children_sum(1));
             ui_set_next_child_layout_axis(Axis2_X);
             UI_Box *prof_box = ui_build_box_from_stringf(UI_BoxFlag_Clickable|
-                                                         UI_BoxFlag_DrawBorder|
                                                          UI_BoxFlag_DrawBackground|
                                                          UI_BoxFlag_DrawHotEffects|
                                                          UI_BoxFlag_DrawActiveEffects,
@@ -7805,6 +7815,10 @@ rd_window_frame(void)
           }
           
           // rjf: min/max/close buttons
+          UI_TagF("implicit")
+            UI_TagF("weak")
+            UI_VisualMargin(ui_top_font_size()*0.5f)
+            UI_CornerRadius(ui_top_font_size()*0.9f)
           {
             UI_Signal min_sig = {0};
             UI_Signal max_sig = {0};
@@ -7818,9 +7832,10 @@ rd_window_frame(void)
               max_sig = rd_icon_buttonf(wm_window_is_maximized(ws->os) ? RD_IconKind_WindowRestore : RD_IconKind_Window, 0, "##maximize");
             }
             UI_PrefWidth(ui_px(button_dim, 1.f))
-              UI_TagF("bad_pop")
+              UI_FontSize(ui_top_font_size()*0.85f)
+              // UI_TagF("bad_pop")
             {
-              cls_sig = rd_icon_buttonf(RD_IconKind_X,      0, "##close");
+              cls_sig = rd_icon_buttonf(RD_IconKind_X, 0, "##close");
             }
             if(ui_clicked(min_sig))
             {
@@ -9390,17 +9405,19 @@ rd_window_frame(void)
       // rjf: draw background
       if(box->flags & UI_BoxFlag_DrawBackground)
       {
+        Rng2F32 box_bg_rect = pad_2f32(box->rect, -box->visual_margin);
+        
         // rjf: hot effect extension (drop shadow)
         if(box->flags & UI_BoxFlag_DrawHotEffects)
         {
-          Rng2F32 drop_shadow_rect = shift_2f32(pad_2f32(box->rect, 8), v2f32(4, 4));
+          Rng2F32 drop_shadow_rect = shift_2f32(pad_2f32(box_bg_rect, 8), v2f32(4, 4));
           Vec4F32 color = drop_shadow_color;
           color.w *= t*box_background_color.w;
           dr_rect(drop_shadow_rect, color, 0.8f, 0, 8.f);
         }
         
         // rjf: draw background
-        R_Rect2DInst *inst = dr_rect(pad_2f32(box->rect, 1.f), box_background_color, 0, 0, border_softness*1.f);
+        R_Rect2DInst *inst = dr_rect(pad_2f32(box_bg_rect, 1.f), box_background_color, 0, 0, border_softness*1.f);
         MemoryCopyArray(inst->corner_radii, box_corner_radii);
         
         // rjf: hot effect extension
@@ -9414,7 +9431,7 @@ rd_window_frame(void)
           {
             Vec4F32 color = hover_color;
             color.w *= 0.015f;
-            R_Rect2DInst *inst = dr_rect(pad_2f32(box->rect, 1.f), v4f32(0, 0, 0, 0), 0, 0, border_softness*1.f);
+            R_Rect2DInst *inst = dr_rect(pad_2f32(box_bg_rect, 1.f), v4f32(0, 0, 0, 0), 0, 0, border_softness*1.f);
             inst->colors[Corner_00] = color;
             inst->colors[Corner_10] = color;
             inst->colors[Corner_01] = color;
@@ -9423,7 +9440,7 @@ rd_window_frame(void)
           }
           
           // rjf: soft circle around mouse
-          if(box->hot_t > 0.01f) DR_ClipScope(intersect_2f32(box->rect, dr_top_clip()))
+          if(box->hot_t > 0.01f && dim_2f32(box->rect).x > box->font_size*8.f) DR_ClipScope(intersect_2f32(box_bg_rect, dr_top_clip()))
           {
             Vec4F32 color = hover_color;
             color.w *= 0.025f;
@@ -9447,15 +9464,15 @@ rd_window_frame(void)
           shadow_color.w *= 0.5f*box->active_t;
           Vec2F32 shadow_size =
           {
-            (box->rect.x1 - box->rect.x0)*0.60f*box->active_t,
-            (box->rect.y1 - box->rect.y0)*0.60f*box->active_t,
+            (box_bg_rect.x1 - box_bg_rect.x0)*0.60f*box->active_t,
+            (box_bg_rect.y1 - box_bg_rect.y0)*0.60f*box->active_t,
           };
           shadow_size.x = Clamp(0, shadow_size.x, box->font_size*2.f);
           shadow_size.y = Clamp(0, shadow_size.y, box->font_size*2.f);
           
           // rjf: top -> bottom dark effect
           {
-            R_Rect2DInst *inst = dr_rect(r2f32p(box->rect.x0, box->rect.y0, box->rect.x1, box->rect.y0 + shadow_size.y), v4f32(0, 0, 0, 0), 0, 0, 1.f);
+            R_Rect2DInst *inst = dr_rect(r2f32p(box_bg_rect.x0, box_bg_rect.y0, box_bg_rect.x1, box_bg_rect.y0 + shadow_size.y), v4f32(0, 0, 0, 0), 0, 0, 1.f);
             inst->colors[Corner_00] = inst->colors[Corner_10] = shadow_color;
             inst->colors[Corner_01] = inst->colors[Corner_11] = v4f32(0.f, 0.f, 0.f, 0.0f);
             MemoryCopyArray(inst->corner_radii, box_corner_radii);
@@ -9463,7 +9480,7 @@ rd_window_frame(void)
           
           // rjf: bottom -> top light effect
           {
-            R_Rect2DInst *inst = dr_rect(r2f32p(box->rect.x0, box->rect.y1 - shadow_size.y, box->rect.x1, box->rect.y1), v4f32(0, 0, 0, 0), 0, 0, 1.f);
+            R_Rect2DInst *inst = dr_rect(r2f32p(box_bg_rect.x0, box_bg_rect.y1 - shadow_size.y, box_bg_rect.x1, box_bg_rect.y1), v4f32(0, 0, 0, 0), 0, 0, 1.f);
             inst->colors[Corner_00] = inst->colors[Corner_10] = v4f32(0, 0, 0, 0);
             inst->colors[Corner_01] = inst->colors[Corner_11] = v4f32(1.0f, 1.0f, 1.0f, 0.08f*box->active_t);
             MemoryCopyArray(inst->corner_radii, box_corner_radii);
@@ -9471,7 +9488,7 @@ rd_window_frame(void)
           
           // rjf: left -> right dark effect
           {
-            R_Rect2DInst *inst = dr_rect(r2f32p(box->rect.x0, box->rect.y0, box->rect.x0 + shadow_size.x, box->rect.y1), v4f32(0, 0, 0, 0), 0, 0, 1.f);
+            R_Rect2DInst *inst = dr_rect(r2f32p(box_bg_rect.x0, box_bg_rect.y0, box_bg_rect.x0 + shadow_size.x, box_bg_rect.y1), v4f32(0, 0, 0, 0), 0, 0, 1.f);
             inst->colors[Corner_10] = inst->colors[Corner_11] = v4f32(0.f, 0.f, 0.f, 0.f);
             inst->colors[Corner_00] = shadow_color;
             inst->colors[Corner_01] = shadow_color;
@@ -9480,7 +9497,7 @@ rd_window_frame(void)
           
           // rjf: right -> left dark effect
           {
-            R_Rect2DInst *inst = dr_rect(r2f32p(box->rect.x1 - shadow_size.x, box->rect.y0, box->rect.x1, box->rect.y1), v4f32(0, 0, 0, 0), 0, 0, 1.f);
+            R_Rect2DInst *inst = dr_rect(r2f32p(box_bg_rect.x1 - shadow_size.x, box_bg_rect.y0, box_bg_rect.x1, box_bg_rect.y1), v4f32(0, 0, 0, 0), 0, 0, 1.f);
             inst->colors[Corner_00] = inst->colors[Corner_01] = v4f32(0.f, 0.f, 0.f, 0.f);
             inst->colors[Corner_10] = shadow_color;
             inst->colors[Corner_11] = shadow_color;
@@ -9617,7 +9634,7 @@ rd_window_frame(void)
           if(b->flags & UI_BoxFlag_DrawBorder)
           {
             Vec4F32 border_color = b->border_color;
-            Rng2F32 b_border_rect = pad_2f32(b->rect, 1.f);
+            Rng2F32 b_border_rect = pad_2f32(b->rect, 1.f - b->visual_margin);
             R_Rect2DInst *inst = dr_rect(b_border_rect, border_color, 0, 1.f, border_softness*1.f);
             MemoryCopyArray(inst->corner_radii, b_corner_radii);
             

src/ui/generated/ui.meta.c

@@ -36,6 +36,7 @@
 #define UI_CornerRadius01(v) DeferLoop(ui_push_corner_radius_01(v), ui_pop_corner_radius_01())
 #define UI_CornerRadius10(v) DeferLoop(ui_push_corner_radius_10(v), ui_pop_corner_radius_10())
 #define UI_CornerRadius11(v) DeferLoop(ui_push_corner_radius_11(v), ui_pop_corner_radius_11())
+#define UI_VisualMargin(v) DeferLoop(ui_push_visual_margin(v), ui_pop_visual_margin())
 #define UI_BlurSize(v) DeferLoop(ui_push_blur_size(v), ui_pop_blur_size())
 #define UI_TextPadding(v) DeferLoop(ui_push_text_padding(v), ui_pop_text_padding())
 #define UI_TextAlignment(v) DeferLoop(ui_push_text_alignment(v), ui_pop_text_alignment())
@@ -71,6 +72,7 @@ internal F32 ui_top_corner_radius_00(void) { UI_StackTopImpl(ui_state, CornerRad
 internal F32 ui_top_corner_radius_01(void) { UI_StackTopImpl(ui_state, CornerRadius01, corner_radius_01) }
 internal F32 ui_top_corner_radius_10(void) { UI_StackTopImpl(ui_state, CornerRadius10, corner_radius_10) }
 internal F32 ui_top_corner_radius_11(void) { UI_StackTopImpl(ui_state, CornerRadius11, corner_radius_11) }
+internal F32 ui_top_visual_margin(void) { UI_StackTopImpl(ui_state, VisualMargin, visual_margin) }
 internal F32 ui_top_blur_size(void) { UI_StackTopImpl(ui_state, BlurSize, blur_size) }
 internal F32 ui_top_text_padding(void) { UI_StackTopImpl(ui_state, TextPadding, text_padding) }
 internal UI_TextAlign ui_top_text_alignment(void) { UI_StackTopImpl(ui_state, TextAlignment, text_alignment) }
@@ -105,6 +107,7 @@ internal F32 ui_bottom_corner_radius_00(void) { UI_StackBottomImpl(ui_state, Cor
 internal F32 ui_bottom_corner_radius_01(void) { UI_StackBottomImpl(ui_state, CornerRadius01, corner_radius_01) }
 internal F32 ui_bottom_corner_radius_10(void) { UI_StackBottomImpl(ui_state, CornerRadius10, corner_radius_10) }
 internal F32 ui_bottom_corner_radius_11(void) { UI_StackBottomImpl(ui_state, CornerRadius11, corner_radius_11) }
+internal F32 ui_bottom_visual_margin(void) { UI_StackBottomImpl(ui_state, VisualMargin, visual_margin) }
 internal F32 ui_bottom_blur_size(void) { UI_StackBottomImpl(ui_state, BlurSize, blur_size) }
 internal F32 ui_bottom_text_padding(void) { UI_StackBottomImpl(ui_state, TextPadding, text_padding) }
 internal UI_TextAlign ui_bottom_text_alignment(void) { UI_StackBottomImpl(ui_state, TextAlignment, text_alignment) }
@@ -139,6 +142,7 @@ internal F32 ui_push_corner_radius_00(F32 v) { UI_StackPushImpl(ui_state, Corner
 internal F32 ui_push_corner_radius_01(F32 v) { UI_StackPushImpl(ui_state, CornerRadius01, corner_radius_01, F32, v) }
 internal F32 ui_push_corner_radius_10(F32 v) { UI_StackPushImpl(ui_state, CornerRadius10, corner_radius_10, F32, v) }
 internal F32 ui_push_corner_radius_11(F32 v) { UI_StackPushImpl(ui_state, CornerRadius11, corner_radius_11, F32, v) }
+internal F32 ui_push_visual_margin(F32 v) { UI_StackPushImpl(ui_state, VisualMargin, visual_margin, F32, v) }
 internal F32 ui_push_blur_size(F32 v) { UI_StackPushImpl(ui_state, BlurSize, blur_size, F32, v) }
 internal F32 ui_push_text_padding(F32 v) { UI_StackPushImpl(ui_state, TextPadding, text_padding, F32, v) }
 internal UI_TextAlign ui_push_text_alignment(UI_TextAlign v) { UI_StackPushImpl(ui_state, TextAlignment, text_alignment, UI_TextAlign, v) }
@@ -173,6 +177,7 @@ internal F32 ui_pop_corner_radius_00(void) { UI_StackPopImpl(ui_state, CornerRad
 internal F32 ui_pop_corner_radius_01(void) { UI_StackPopImpl(ui_state, CornerRadius01, corner_radius_01) }
 internal F32 ui_pop_corner_radius_10(void) { UI_StackPopImpl(ui_state, CornerRadius10, corner_radius_10) }
 internal F32 ui_pop_corner_radius_11(void) { UI_StackPopImpl(ui_state, CornerRadius11, corner_radius_11) }
+internal F32 ui_pop_visual_margin(void) { UI_StackPopImpl(ui_state, VisualMargin, visual_margin) }
 internal F32 ui_pop_blur_size(void) { UI_StackPopImpl(ui_state, BlurSize, blur_size) }
 internal F32 ui_pop_text_padding(void) { UI_StackPopImpl(ui_state, TextPadding, text_padding) }
 internal UI_TextAlign ui_pop_text_alignment(void) { UI_StackPopImpl(ui_state, TextAlignment, text_alignment) }
@@ -207,6 +212,7 @@ internal F32 ui_set_next_corner_radius_00(F32 v) { UI_StackSetNextImpl(ui_state,
 internal F32 ui_set_next_corner_radius_01(F32 v) { UI_StackSetNextImpl(ui_state, CornerRadius01, corner_radius_01, F32, v) }
 internal F32 ui_set_next_corner_radius_10(F32 v) { UI_StackSetNextImpl(ui_state, CornerRadius10, corner_radius_10, F32, v) }
 internal F32 ui_set_next_corner_radius_11(F32 v) { UI_StackSetNextImpl(ui_state, CornerRadius11, corner_radius_11, F32, v) }
+internal F32 ui_set_next_visual_margin(F32 v) { UI_StackSetNextImpl(ui_state, VisualMargin, visual_margin, F32, v) }
 internal F32 ui_set_next_blur_size(F32 v) { UI_StackSetNextImpl(ui_state, BlurSize, blur_size, F32, v) }
 internal F32 ui_set_next_text_padding(F32 v) { UI_StackSetNextImpl(ui_state, TextPadding, text_padding, F32, v) }
 internal UI_TextAlign ui_set_next_text_alignment(UI_TextAlign v) { UI_StackSetNextImpl(ui_state, TextAlignment, text_alignment, UI_TextAlign, v) }

src/ui/generated/ui.meta.h

@@ -38,6 +38,7 @@ typedef struct UI_CornerRadius00Node UI_CornerRadius00Node; struct UI_CornerRadi
 typedef struct UI_CornerRadius01Node UI_CornerRadius01Node; struct UI_CornerRadius01Node{UI_CornerRadius01Node *next; F32 v;};
 typedef struct UI_CornerRadius10Node UI_CornerRadius10Node; struct UI_CornerRadius10Node{UI_CornerRadius10Node *next; F32 v;};
 typedef struct UI_CornerRadius11Node UI_CornerRadius11Node; struct UI_CornerRadius11Node{UI_CornerRadius11Node *next; F32 v;};
+typedef struct UI_VisualMarginNode UI_VisualMarginNode; struct UI_VisualMarginNode{UI_VisualMarginNode *next; F32 v;};
 typedef struct UI_BlurSizeNode UI_BlurSizeNode; struct UI_BlurSizeNode{UI_BlurSizeNode *next; F32 v;};
 typedef struct UI_TextPaddingNode UI_TextPaddingNode; struct UI_TextPaddingNode{UI_TextPaddingNode *next; F32 v;};
 typedef struct UI_TextAlignmentNode UI_TextAlignmentNode; struct UI_TextAlignmentNode{UI_TextAlignmentNode *next; UI_TextAlign v;};
@@ -76,6 +77,7 @@ UI_CornerRadius00Node corner_radius_00_nil_stack_top;\
 UI_CornerRadius01Node corner_radius_01_nil_stack_top;\
 UI_CornerRadius10Node corner_radius_10_nil_stack_top;\
 UI_CornerRadius11Node corner_radius_11_nil_stack_top;\
+UI_VisualMarginNode visual_margin_nil_stack_top;\
 UI_BlurSizeNode blur_size_nil_stack_top;\
 UI_TextPaddingNode text_padding_nil_stack_top;\
 UI_TextAlignmentNode text_alignment_nil_stack_top;\
@@ -113,6 +115,7 @@ state->corner_radius_00_nil_stack_top.v = 0;\
 state->corner_radius_01_nil_stack_top.v = 0;\
 state->corner_radius_10_nil_stack_top.v = 0;\
 state->corner_radius_11_nil_stack_top.v = 0;\
+state->visual_margin_nil_stack_top.v = 0;\
 state->blur_size_nil_stack_top.v = 0;\
 state->text_padding_nil_stack_top.v = 0;\
 state->text_alignment_nil_stack_top.v = UI_TextAlign_Left;\
@@ -152,6 +155,7 @@ struct { UI_CornerRadius00Node *top; F32 bottom_val; UI_CornerRadius00Node *free
 struct { UI_CornerRadius01Node *top; F32 bottom_val; UI_CornerRadius01Node *free; U64 gen; B32 auto_pop; } corner_radius_01_stack;\
 struct { UI_CornerRadius10Node *top; F32 bottom_val; UI_CornerRadius10Node *free; U64 gen; B32 auto_pop; } corner_radius_10_stack;\
 struct { UI_CornerRadius11Node *top; F32 bottom_val; UI_CornerRadius11Node *free; U64 gen; B32 auto_pop; } corner_radius_11_stack;\
+struct { UI_VisualMarginNode *top; F32 bottom_val; UI_VisualMarginNode *free; U64 gen; B32 auto_pop; } visual_margin_stack;\
 struct { UI_BlurSizeNode *top; F32 bottom_val; UI_BlurSizeNode *free; U64 gen; B32 auto_pop; } blur_size_stack;\
 struct { UI_TextPaddingNode *top; F32 bottom_val; UI_TextPaddingNode *free; U64 gen; B32 auto_pop; } text_padding_stack;\
 struct { UI_TextAlignmentNode *top; UI_TextAlign bottom_val; UI_TextAlignmentNode *free; U64 gen; B32 auto_pop; } text_alignment_stack;\
@@ -189,6 +193,7 @@ state->corner_radius_00_stack.top = &state->corner_radius_00_nil_stack_top; stat
 state->corner_radius_01_stack.top = &state->corner_radius_01_nil_stack_top; state->corner_radius_01_stack.bottom_val = 0; state->corner_radius_01_stack.free = 0; state->corner_radius_01_stack.auto_pop = 0;\
 state->corner_radius_10_stack.top = &state->corner_radius_10_nil_stack_top; state->corner_radius_10_stack.bottom_val = 0; state->corner_radius_10_stack.free = 0; state->corner_radius_10_stack.auto_pop = 0;\
 state->corner_radius_11_stack.top = &state->corner_radius_11_nil_stack_top; state->corner_radius_11_stack.bottom_val = 0; state->corner_radius_11_stack.free = 0; state->corner_radius_11_stack.auto_pop = 0;\
+state->visual_margin_stack.top = &state->visual_margin_nil_stack_top; state->visual_margin_stack.bottom_val = 0; state->visual_margin_stack.free = 0; state->visual_margin_stack.auto_pop = 0;\
 state->blur_size_stack.top = &state->blur_size_nil_stack_top; state->blur_size_stack.bottom_val = 0; state->blur_size_stack.free = 0; state->blur_size_stack.auto_pop = 0;\
 state->text_padding_stack.top = &state->text_padding_nil_stack_top; state->text_padding_stack.bottom_val = 0; state->text_padding_stack.free = 0; state->text_padding_stack.auto_pop = 0;\
 state->text_alignment_stack.top = &state->text_alignment_nil_stack_top; state->text_alignment_stack.bottom_val = UI_TextAlign_Left; state->text_alignment_stack.free = 0; state->text_alignment_stack.auto_pop = 0;\
@@ -226,6 +231,7 @@ if(state->corner_radius_00_stack.auto_pop) { ui_pop_corner_radius_00(); state->c
 if(state->corner_radius_01_stack.auto_pop) { ui_pop_corner_radius_01(); state->corner_radius_01_stack.auto_pop = 0; }\
 if(state->corner_radius_10_stack.auto_pop) { ui_pop_corner_radius_10(); state->corner_radius_10_stack.auto_pop = 0; }\
 if(state->corner_radius_11_stack.auto_pop) { ui_pop_corner_radius_11(); state->corner_radius_11_stack.auto_pop = 0; }\
+if(state->visual_margin_stack.auto_pop) { ui_pop_visual_margin(); state->visual_margin_stack.auto_pop = 0; }\
 if(state->blur_size_stack.auto_pop) { ui_pop_blur_size(); state->blur_size_stack.auto_pop = 0; }\
 if(state->text_padding_stack.auto_pop) { ui_pop_text_padding(); state->text_padding_stack.auto_pop = 0; }\
 if(state->text_alignment_stack.auto_pop) { ui_pop_text_alignment(); state->text_alignment_stack.auto_pop = 0; }\
@@ -262,6 +268,7 @@ internal F32                        ui_top_corner_radius_00(void);
 internal F32                        ui_top_corner_radius_01(void);
 internal F32                        ui_top_corner_radius_10(void);
 internal F32                        ui_top_corner_radius_11(void);
+internal F32                        ui_top_visual_margin(void);
 internal F32                        ui_top_blur_size(void);
 internal F32                        ui_top_text_padding(void);
 internal UI_TextAlign               ui_top_text_alignment(void);
@@ -297,6 +304,7 @@ internal F32                        ui_bottom_corner_radius_00(void);
 internal F32                        ui_bottom_corner_radius_01(void);
 internal F32                        ui_bottom_corner_radius_10(void);
 internal F32                        ui_bottom_corner_radius_11(void);
+internal F32                        ui_bottom_visual_margin(void);
 internal F32                        ui_bottom_blur_size(void);
 internal F32                        ui_bottom_text_padding(void);
 internal UI_TextAlign               ui_bottom_text_alignment(void);
@@ -332,6 +340,7 @@ internal F32                        ui_push_corner_radius_00(F32 v);
 internal F32                        ui_push_corner_radius_01(F32 v);
 internal F32                        ui_push_corner_radius_10(F32 v);
 internal F32                        ui_push_corner_radius_11(F32 v);
+internal F32                        ui_push_visual_margin(F32 v);
 internal F32                        ui_push_blur_size(F32 v);
 internal F32                        ui_push_text_padding(F32 v);
 internal UI_TextAlign               ui_push_text_alignment(UI_TextAlign v);
@@ -367,6 +376,7 @@ internal F32                        ui_pop_corner_radius_00(void);
 internal F32                        ui_pop_corner_radius_01(void);
 internal F32                        ui_pop_corner_radius_10(void);
 internal F32                        ui_pop_corner_radius_11(void);
+internal F32                        ui_pop_visual_margin(void);
 internal F32                        ui_pop_blur_size(void);
 internal F32                        ui_pop_text_padding(void);
 internal UI_TextAlign               ui_pop_text_alignment(void);
@@ -402,6 +412,7 @@ internal F32                        ui_set_next_corner_radius_00(F32 v);
 internal F32                        ui_set_next_corner_radius_01(F32 v);
 internal F32                        ui_set_next_corner_radius_10(F32 v);
 internal F32                        ui_set_next_corner_radius_11(F32 v);
+internal F32                        ui_set_next_visual_margin(F32 v);
 internal F32                        ui_set_next_blur_size(F32 v);
 internal F32                        ui_set_next_text_padding(F32 v);
 internal UI_TextAlign               ui_set_next_text_alignment(UI_TextAlign v);

src/ui/ui.mdesk

@@ -58,6 +58,9 @@ UI_StackTable:
   { CornerRadius10                     corner_radius_10              F32                   0                                  }
   { CornerRadius11                     corner_radius_11              F32                   0                                  }
   
+  //- rjf: visual margin
+  { VisualMargin                       visual_margin                 F32                   0                                  }
+
   //- rjf: blur size
   { BlurSize                           blur_size                     F32                   0                                  }
   

src/ui/ui_core.c

@@ -2524,6 +2524,7 @@ ui_build_box_from_key(UI_BoxFlags flags, UI_Key key)
     box->corner_radii[Corner_01] = ui_state->corner_radius_01_stack.top->v;
     box->corner_radii[Corner_10] = ui_state->corner_radius_10_stack.top->v;
     box->corner_radii[Corner_11] = ui_state->corner_radius_11_stack.top->v;
+    box->visual_margin = ui_state->visual_margin_stack.top->v;
     box->blur_size = ui_state->blur_size_stack.top->v;
     box->transparency = ui_state->transparency_stack.top->v;
     box->squish = ui_state->squish_stack.top->v;

src/ui/ui_core.h

@@ -402,6 +402,7 @@ struct UI_Box
   F32 tab_size;
   FNT_RasterFlags text_raster_flags;
   F32 corner_radii[Corner_COUNT];
+  F32 visual_margin;
   F32 blur_size;
   F32 transparency;
   F32 squish;
@@ -993,6 +994,7 @@ internal F32                        ui_top_corner_radius_00(void);
 internal F32                        ui_top_corner_radius_01(void);
 internal F32                        ui_top_corner_radius_10(void);
 internal F32                        ui_top_corner_radius_11(void);
+internal F32                        ui_top_visual_margin(void);
 internal F32                        ui_top_blur_size(void);
 internal F32                        ui_top_text_padding(void);
 internal UI_TextAlign               ui_top_text_alignment(void);
@@ -1028,6 +1030,7 @@ internal F32                        ui_bottom_corner_radius_00(void);
 internal F32                        ui_bottom_corner_radius_01(void);
 internal F32                        ui_bottom_corner_radius_10(void);
 internal F32                        ui_bottom_corner_radius_11(void);
+internal F32                        ui_bottom_visual_margin(void);
 internal F32                        ui_bottom_blur_size(void);
 internal F32                        ui_bottom_text_padding(void);
 internal UI_TextAlign               ui_bottom_text_alignment(void);
@@ -1063,6 +1066,7 @@ internal F32                        ui_push_corner_radius_00(F32 v);
 internal F32                        ui_push_corner_radius_01(F32 v);
 internal F32                        ui_push_corner_radius_10(F32 v);
 internal F32                        ui_push_corner_radius_11(F32 v);
+internal F32                        ui_push_visual_margin(F32 v);
 internal F32                        ui_push_blur_size(F32 v);
 internal F32                        ui_push_text_padding(F32 v);
 internal UI_TextAlign               ui_push_text_alignment(UI_TextAlign v);
@@ -1098,6 +1102,7 @@ internal F32                        ui_pop_corner_radius_00(void);
 internal F32                        ui_pop_corner_radius_01(void);
 internal F32                        ui_pop_corner_radius_10(void);
 internal F32                        ui_pop_corner_radius_11(void);
+internal F32                        ui_pop_visual_margin(void);
 internal F32                        ui_pop_blur_size(void);
 internal F32                        ui_pop_text_padding(void);
 internal UI_TextAlign               ui_pop_text_alignment(void);
@@ -1133,6 +1138,7 @@ internal F32                        ui_set_next_corner_radius_00(F32 v);
 internal F32                        ui_set_next_corner_radius_01(F32 v);
 internal F32                        ui_set_next_corner_radius_10(F32 v);
 internal F32                        ui_set_next_corner_radius_11(F32 v);
+internal F32                        ui_set_next_visual_margin(F32 v);
 internal F32                        ui_set_next_blur_size(F32 v);
 internal F32                        ui_set_next_text_padding(F32 v);
 internal UI_TextAlign               ui_set_next_text_alignment(UI_TextAlign v);
@@ -1174,6 +1180,7 @@ internal F32      ui_top_px_height(void);
 #define UI_Tag(v) DeferLoop(ui_push_tag(v), ui_pop_tag())
 #define UI_BackgroundColor(v) DeferLoop(ui_push_background_color(v), ui_pop_background_color())
 #define UI_TextColor(v) DeferLoop(ui_push_text_color(v), ui_pop_text_color())
+#define UI_BorderColor(v) DeferLoop(ui_push_border_color(v), ui_pop_border_color())
 #define UI_Squish(v) DeferLoop(ui_push_squish(v), ui_pop_squish())
 #define UI_HoverCursor(v) DeferLoop(ui_push_hover_cursor(v), ui_pop_hover_cursor())
 #define UI_Font(v) DeferLoop(ui_push_font(v), ui_pop_font())
@@ -1184,6 +1191,7 @@ internal F32      ui_top_px_height(void);
 #define UI_CornerRadius01(v) DeferLoop(ui_push_corner_radius_01(v), ui_pop_corner_radius_01())
 #define UI_CornerRadius10(v) DeferLoop(ui_push_corner_radius_10(v), ui_pop_corner_radius_10())
 #define UI_CornerRadius11(v) DeferLoop(ui_push_corner_radius_11(v), ui_pop_corner_radius_11())
+#define UI_VisualMargin(v) DeferLoop(ui_push_visual_margin(v), ui_pop_visual_margin())
 #define UI_BlurSize(v) DeferLoop(ui_push_blur_size(v), ui_pop_blur_size())
 #define UI_TextPadding(v) DeferLoop(ui_push_text_padding(v), ui_pop_text_padding())
 #define UI_TextAlignment(v) DeferLoop(ui_push_text_alignment(v), ui_pop_text_alignment())