diff --git a/src/widgets/button.zig b/src/widgets/button.zig index bde519c..a4c2eb2 100644 --- a/src/widgets/button.zig +++ b/src/widgets/button.zig @@ -105,6 +105,16 @@ pub fn buttonRect(ctx: *Context, bounds: Layout.Rect, text: []const u8, config: ctx.pushCommand(Command.rectOutline(bounds.x, bounds.y, bounds.w, bounds.h, theme.border)); } + // Bisel 3D sutil: línea clara arriba, línea oscura abajo (inside) + if (bounds.h >= 4 and bounds.w >= 4 and !config.disabled) { + // Línea superior interna (highlight) + const bevel_light = bg_color.lighten(15); + ctx.pushCommand(Command.rect(bounds.x + 1, bounds.y + 1, bounds.w - 2, 1, bevel_light)); + // Línea inferior interna (shadow) + const bevel_dark = bg_color.darken(15); + ctx.pushCommand(Command.rect(bounds.x + 1, bounds.y + @as(i32, @intCast(bounds.h)) - 2, bounds.w - 2, 1, bevel_dark)); + } + // Draw text centered const char_width: u32 = 8; const char_height: u32 = 8; @@ -193,6 +203,16 @@ pub fn buttonStatefulRect( ctx.pushCommand(Command.rectOutline(bounds.x, bounds.y, bounds.w, bounds.h, theme.border)); } + // Bisel 3D sutil: línea clara arriba, línea oscura abajo (inside) + if (bounds.h >= 4 and bounds.w >= 4 and !config.disabled) { + // Línea superior interna (highlight) + const bevel_light = bg_color.lighten(15); + ctx.pushCommand(Command.rect(bounds.x + 1, bounds.y + 1, bounds.w - 2, 1, bevel_light)); + // Línea inferior interna (shadow) + const bevel_dark = bg_color.darken(15); + ctx.pushCommand(Command.rect(bounds.x + 1, bounds.y + @as(i32, @intCast(bounds.h)) - 2, bounds.w - 2, 1, bevel_dark)); + } + // Draw text centered const char_width: u32 = 8; const char_height: u32 = 8; @@ -237,8 +257,8 @@ test "button generates commands" { _ = button(&ctx, "Click me"); - // Should generate: rect (background) + rect_outline (border) + text - try std.testing.expectEqual(@as(usize, 3), ctx.commands.items.len); + // Should generate: rect (background) + rect_outline (border) + 2 bevel lines + text + try std.testing.expectEqual(@as(usize, 5), ctx.commands.items.len); ctx.endFrame(); }