Question regarding styling input checkbox element
Hi, When using a dark css theme (I like to use a black background), putting a checkmark in a checkbox is invisible (black). I tried messing around with style.css with various configurations for input, but it seems impossible to make the checkmark anything other than black. It's not a huge issue, but when editing bookmarks it becomes a little annoying. Any suggestions, or is this just a limitation of the css implementation? Thanks, Alex
Hi, On Tue, May 20, 2025 at 01:33:43PM +0000, a1ex@dismail.de wrote:
Hi,
When using a dark css theme (I like to use a black background), putting a checkmark in a checkbox is invisible (black). I tried messing around with style.css with various configurations for input, but it seems impossible to make the checkmark anything other than black.
It's not a huge issue, but when editing bookmarks it becomes a little annoying.
Any suggestions, or is this just a limitation of the css implementation?
For some reason is always hardcoded to be black. Here is making it always red: diff --git a/dw/fltkui.cc b/dw/fltkui.cc index db7c94e2..2d3882d2 100644 --- a/dw/fltkui.cc +++ b/dw/fltkui.cc @@ -1172,7 +1172,7 @@ void FltkToggleButtonResource<I>::setWidgetStyle (Fl_Widget *widget, { FltkResource::setWidgetStyle(widget, style); - widget->selection_color(FL_BLACK); + widget->selection_color(FL_RED); } See commit fa967f233fe6da82a98aaf3e2149d7aa5e1516cc for context, but not sure why is not just inheriting the CSS foreground color. Best, Rodrigo.
Hi Rodrigo, Rodrigo Arias <rodarima@gmail.com> wrote:
For some reason is always hardcoded to be black. Here is making it always red:
Thanks, looks great now!
See commit fa967f233fe6da82a98aaf3e2149d7aa5e1516cc for context, but not sure why is not just inheriting the CSS foreground color.
Here is a working patch which I believe fixes it so that it uses the foreground color: diff -upr a/dw/fltkui.cc b/dw/fltkui.cc --- a/dw/fltkui.cc Sun Apr 27 18:56:44 2025 +++ b/dw/fltkui.cc Wed May 21 14:01:08 2025 @@ -1171,8 +1171,12 @@ void FltkToggleButtonResource<I>::setWidgetStyle (Fl_W core::style::Style *style) { FltkResource::setWidgetStyle(widget, style); - - widget->selection_color(FL_BLACK); + FltkColor *bg = (FltkColor*)style->backgroundColor; + int normal_bg = bg->colors[FltkColor::SHADING_NORMAL]; + int style_fg = ((FltkColor*)style->color)->colors + [FltkColor::SHADING_NORMAL]; + Fl_Color fg = fl_contrast(style_fg, normal_bg); + widget->selection_color(fg); } Regards, Alex
<a1ex@dismail.de> wrote:
Here is a working patch which I believe fixes it so that it uses the foreground color:
Sorry, I hit send too fast! It doesn't actually use the CSS foreground color, but creates a contrasting color based on the background. Maybe not ideal, but probably better than the current behavior.
a1ex-J7K0XVabL0iELgA04lAiVw@public.gmane.org wrote:
When using a dark css theme (I like to use a black background), putting a checkmark in a checkbox is invisible (black). I tried messing around with style.css with various configurations for input, but it seems impossible to make the checkmark anything other than black.
It's not a huge issue, but when editing bookmarks it becomes a little annoying.
I've got visible checkboxes on a black background with this style.css in Dillo 3.2.0: * {color: #00f400} html {background-color: gray !important} body, div, span, nav, p, a, form, h1, h2, h3, h4, h5, h6, ul, ol, li, table, tr, td {background-color: black} img, map {background-color: gray !important} :link {text-decoration: none !important; color: #00f5e8 !important} :visited {text-decoration: none !important; color: #a020f0 !important} That style does make the bookmarks page look pretty odd with its CSS enabled, but it's intended to avoid dark-on-black content on some websites.
participants (3)
-
a1ex＠dismail.de -
Kevin Koster -
Rodrigo Arias