Hi list, Attached is a screenshot of Dillo with a simple "Dark Mode" theme. For those interested in how to do this, here is a small tutorial: Put this in ~/.dillo/style.css: * { background-color: #000000 !important; color: #999999 !important; } :link { color: #ffffff !important; text-decoration: none !important; } :visited { color: #ffffff !important; text-decoration: underline !important; } Put this in ~/.dillo/dillorc: bg_color=000000 ui_fg_color=999999 ui_main_bg_color=000000 ui_text_bg_color=000000 ui_selection_color=444444 ui_button_highlight_color=ffffff ui_tab_active_bg_color=999999 ui_tab_active_fg_color=000000 ui_tab_bg_color=000000 And then we can tighten up the UI to taste: panel_size=tiny small_icons=YES show_search=NO show_help=NO Hopefully someone will find this useful :) Regards, Alex
bg_color=000000 ui_fg_color=999999 ui_main_bg_color=000000 ui_text_bg_color=000000 ui_selection_color=444444 ui_button_highlight_color=ffffff ui_tab_active_bg_color=999999 ui_tab_active_fg_color=000000 ui_tab_bg_color=000000
Correction, the hex color codes above should obviously be prefixed with a '#', otherwise Dillo will complain on the console: prefs: Color '000000' not recognized. correct: bg_color=#000000 Interesting that it somehow still works without the '#' though, despite the warning...
On Sun, 5 May 2024 18:00:26 +0200 <a1ex@dismail.de> wrote:
Attached is a screenshot of Dillo with a simple "Dark Mode" theme.
For those interested in how to do this, here is a small tutorial:
Put this in ~/.dillo/style.css:
* { background-color: #000000 !important; color: #999999 ! important; } :link { color: #ffffff !important; text-decoration: none !important; } :visited { color: #ffffff !important; text-decoration: underline !important; }
One issue with dark background colours is that PNG/GIF images with transparent backgrounds often have text in black and therefore become unreadable, such as this image on Wikipedia: https://en.wikipedia.org/wiki/File:Unix_timeline.en.svg I'm not good at CSS, but I just made an attempt to work around this by not setting img elements to black in my version of a dark-theme style.css, but it doesn't work, images backgrounds are still black: * {color: #00f400} 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} I don't know whether my CSS is invalid or if it's a bug in Dillo, but hints for applying black background-color to everything except images would be welcome. The image background is also black when I open it on its own with "isolate image" from the right-click menu, even though there it's on a light-colour background due to the 'bg_color' setting in dillorc being set to default. Presumably that's because the image in the cache already, loading a new PNG image URL the background is bg_color: https://upload.wikimedia.org/wikipedia/commons/thumb/c/cd/Unix_timeline.en.s...
Hi, On Tue, Jul 02, 2024 at 11:28:01AM +1000, Kevin Koster wrote:
One issue with dark background colours is that PNG/GIF images with transparent backgrounds often have text in black and therefore become unreadable, such as this image on Wikipedia: https://en.wikipedia.org/wiki/File:Unix_timeline.en.svg
I'm not good at CSS, but I just made an attempt to work around this by not setting img elements to black in my version of a dark-theme style.css, but it doesn't work, images backgrounds are still black:
* {color: #00f400} 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}
I don't know whether my CSS is invalid or if it's a bug in Dillo, but hints for applying black background-color to everything except images would be welcome. The image background is also black when I open it on its own with "isolate image" from the right-click menu, even though there it's on a light-colour background due to the 'bg_color' setting in dillorc being set to default. Presumably that's because the image in the cache already, loading a new PNG image URL the background is bg_color: https://upload.wikimedia.org/wikipedia/commons/thumb/c/cd/Unix_timeline.en.s...
The implementation seems to be incomplete: https://github.com/dillo-browser/dillo/blob/8c97be233a600f414952e458f59768e9... The background color of the image is being assigned from the color of the <html> background. Try this patch to override it from the current element: diff --git a/src/html.cc b/src/html.cc index a55fd2a8..649e7556 100644 --- a/src/html.cc +++ b/src/html.cc @@ -2156,6 +2156,9 @@ DilloImage *a_Html_image_new(DilloHtml *html, const char *tag, int tagsize) if (HT2TB(html)->getBgColor()) image->bg_color = HT2TB(html)->getBgColor()->getColor(); + if (html->styleEngine->backgroundColor()) + image->bg_color = html->styleEngine->backgroundColor()->getColor(); + DilloHtmlImage *hi = dNew(DilloHtmlImage, 1); hi->url = url; html->images->increase();
On Tue, Jul 02, 2024 at 08:24:59PM +0200, Rodrigo Arias wrote:
The implementation seems to be incomplete:
https://github.com/dillo-browser/dillo/blob/8c97be233a600f414952e458f59768e9...
The background color of the image is being assigned from the color of the <html> background. Try this patch to override it from the current element:
diff --git a/src/html.cc b/src/html.cc index a55fd2a8..649e7556 100644 --- a/src/html.cc +++ b/src/html.cc @@ -2156,6 +2156,9 @@ DilloImage *a_Html_image_new(DilloHtml *html, const char *tag, int tagsize) if (HT2TB(html)->getBgColor()) image->bg_color = HT2TB(html)->getBgColor()->getColor();
+ if (html->styleEngine->backgroundColor()) + image->bg_color = html->styleEngine->backgroundColor()->getColor(); + DilloHtmlImage *hi = dNew(DilloHtmlImage, 1); hi->url = url; html->images->increase();
And this extra rule in style.css: html {background-color: gray !important} (I need to check it in more detail)
Rodrigo Arias <rodarima-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
On Tue, Jul 02, 2024 at 08:24:59PM +0200, Rodrigo Arias wrote:
The background color of the image is being assigned from the color of the <html> background. Try this patch to override it from the current element:
diff --git a/src/html.cc b/src/html.cc index a55fd2a8..649e7556 100644 --- a/src/html.cc +++ b/src/html.cc @@ -2156,6 +2156,9 @@ DilloImage *a_Html_image_new(DilloHtml *html, const char *tag, int tagsize) if (HT2TB(html)->getBgColor()) image->bg_color = HT2TB(html)->getBgColor()->getColor();
+ if (html->styleEngine->backgroundColor()) + image->bg_color = html->styleEngine->backgroundColor()->getColor(); + DilloHtmlImage *hi = dNew(DilloHtmlImage, 1); hi->url = url; html->images->increase();
And this extra rule in style.css:
html {background-color: gray !important}
Thanks, yes together those changes work to set the PNG background colour.
participants (3)
-
a1ex＠dismail.de -
Kevin Koster -
Rodrigo Arias