De la couleur dans l'IHM 2.7

[mimi85]

N'ayant pu compiler sous Ubuntu , j'ai pris la version compilée de Windows, pour mettre de la couleur dans l'interface comme je l'ai fait pour les versions précédentes. Le fichier darktable.css ayant fortement changé par les soins de notre ami @aurélienpierre, je suis donc reparti de ce nouveau fichier.
Première chose, créer un dossier "themes" dans user/AppData/Local/darktable (Le dossier "themes" doit être créé manuellement). Pour Ubuntu et autres distro c'est dans .config/darktable
2) Ouvrir un éditeur de texte (pour Windows j'ai pris Wordpad)
3) Copier/Coller les lignes ci-dessous

Code :

@import 'C:/Program Files/darktable/share/darktable/themes/darktable.css';
/*
   This file is part of darktable,
   copyright (c) 2019 Aurélien Pierre.

   darktable is free software: you can redistribute it and/or modify
   it under the terms of the GNU General Public License as published by
   the Free Software Foundation, either version 3 of the License, or
   (at your option) any later version.

   darktable is distributed in the hope that it will be useful,
   but WITHOUT ANY WARRANTY; without even the implied warranty of
   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
   GNU General Public License for more details.

   You should have received a copy of the GNU General Public License
   along with darktable.  If not, see <http://www.gnu.org/licenses/>.
*/

/* This has been tested with GTK 3.24 on Gnome */

/* Perceptually uniform grey gradient */

/* grey_00 = pure black is forbidden for visual assessment */
@define-color grey_05 #111111;
@define-color grey_10 #1b1b1b;
@define-color grey_15 #262626;
@define-color grey_20 #303030;
@define-color grey_25 #3b3b3b;
@define-color grey_30 #474747;
@define-color grey_35 #525252;
@define-color grey_40 #5e5e5e;
@define-color grey_45 #666666;
@define-color grey_50 #777777;
@define-color grey_55 #848484;
@define-color grey_60 #919191;
@define-color grey_65 #9e9e9e;
@define-color grey_70 #ababab;
@define-color grey_75 #b9b9b9;
@define-color grey_80 #c6c6c6;
@define-color grey_85 #d4d4d4;
@define-color grey_90 #e2e2e2;
@define-color grey_95 #f1f1f1;
/* grey_100 = pure white is forbidden for visual assessment */
@define-color yellow_05 #ffff00;
@define-color yellow_10 #DD9944;
@define-color yellow_15 #ffcc66;

/* General rules :

 * keep just enough contrast in the UI to make text readable, but not
 too much to avoid distractions from the picture,
 * avoid sharp and unnecessary details for the same reason (shadows,
 borders, colors, fancy bits). Use plain shapes and flat design.
 * keep 50 % distance between background and foreground colors for active controls
 * keep 30 % distance between background and foreground colors for labels and info
 * keep 10 % distance between background and foreground colors for insensitive controls
 * events are ± 20 % from the normal color
 * borders and accents are ± 5 % from the background
 * buttons and control follow Google Material Design principles :
   https://material.io/design/
 * create optical margins by aligning content properly, not by using borders.
*/


/* General */
@define-color selected_bg_color @grey_25; /* legacy stuff */
@define-color border_color @grey_10; /* border, when used */
@define-color bg_color @grey_15; /* general background */
@define-color fg_color @yellow_10; /* general text */
@define-color base_color @fg_color; /* legacy stuff */
@define-color text_color @yellow_10; /* same */
@define-color disabled_fg_color @grey_40; /* disabled controls */

/* Scroll bars (sliders) */
@define-color scroll_bar_inactive @grey_40;
@define-color scroll_bar_active @grey_50;
@define-color scroll_bar_focus @grey_45;
@define-color scroll_bar_bg @grey_10;

/* Modules box (plugins) */
@define-color plugin_bg_color @grey_20;
@define-color plugin_fg_color @yellow_10;
@define-color section_label @yellow_10;
@define-color plugin_label_color @yellow_10;

/* Modules controls (sliders and comboboxes) */
@define-color bauhaus_fg @yellow_15;
@define-color bauhaus_border shade(@plugin_bg_color, 0.5);
@define-color bauhaus_indicator_border @grey_20;
@define-color bauhaus_fill @yellow_05;
@define-color bauhaus_bg @grey_15;
@define-color bauhaus_fg_hover @grey_90;
@define-color bauhaus_fg_insensitive alpha(@yellow_15, 0.5);

/* GTK Buttons and tabs */
@define-color button_bg @grey_25;
@define-color button_fg @yellow_05;
@define-color button_border @grey_30;
@define-color button_focus_bg @grey_45;
@define-color button_focus_fg @grey_95;
@define-color button_checked_bg @grey_45;
@define-color button_checked_fg @grey_95;
@define-color button_hover_bg @grey_55;
@define-color button_hover_fg @grey_15;

/* text fields */
@define-color field_bg @grey_05;
@define-color field_fg @yellow_10;
@define-color field_active_bg @grey_20;
@define-color field_active_fg @yellow_10;
@define-color field_hover_bg @grey_45;
@define-color field_hover_fg @yellow_10;
@define-color field_select_bg @grey_05;

/* Tooltips and contextual helpers */
@define-color tooltip_bg_color @grey_05;
@define-color tooltip_fg_color @yellow_05;
@define-color really_dark_bg_color @grey_05;

/* Views */
@define-color darkroom_bg_color @grey_50;
@define-color darkroom_preview_bg_color @grey_25;
@define-color lighttable_bg_color @grey_50;
@define-color lighttable_preview_bg_color @grey_25;

/* Brushes */
@define-color brush_cursor alpha(white, .9);
@define-color brush_trace alpha(black, .8);

/* Lighttable and film-strip */
@define-color thumbnail_bg_color @grey_45; /* area between border and outline */
@define-color thumbnail_selected_bg_color @grey_65;
@define-color thumbnail_hover_bg_color @grey_80;
@define-color thumbnail_outline_color @grey_20; /* square around image+metadata */
@define-color thumbnail_selected_outline_color @grey_45;
@define-color thumbnail_hover_outline_color @grey_65;
@define-color thumbnail_font_color @grey_45;
@define-color thumbnail_selected_font_color @yellow_05;
@define-color thumbnail_hover_font_color @yellow_10;
@define-color thumbnail_border_color @grey_15; /* rectangle directly around image */
@define-color thumbnail_selected_border_color @grey_90;
@define-color filmstrip_bg_color @lighttable_bg_color;
@define-color preview_border_color @grey_15;
@define-color preview_hover_border_color @grey_90;

/* Graphs : histogram, navigation thumbnail and some items on tone curve */
@define-color graph_bg @grey_10;
@define-color graph_border @grey_05;
@define-color graph_fg @yellow_10;
@define-color graph_fg_active @yellow_05;
@define-color graph_grid #000;
@define-color inset_histogram alpha(@grey_65, 0.50);

/* Reset GTK defaults - Otherwise dt inherits Adwaita default theme dark */

*
{
 background-color: @bg_color;
 background-image: none;
 font-family: sans-serif;
 font-size: 1em;
 color: @fg_color;
 text-shadow:none;
 box-shadow:none;
 padding: 0;
 margin: 0;
 border: 0;
 outline-style:none;
 min-width: 0;
 min-height: 0;
}

#lib-plugin-ui,
#iop-plugin-ui,
#lib-modulelist,
#modules-tabs,
#left,
#right,
combobox,
combobox *,
togglebutton,
togglebutton *,
notebook,
notebook *,
notebook tab,
notebook tab *,
table,
table *,
row,
row *,
frame,
frame *,
alignment,
entry,
entry *,
dialog,
dialog *,
colorswatch,
colorswatch *
stack,
stack *,
scrollbar,
scrollbar *,
eventbox,
eventbox *,
scale,
scale *,
button,
button *,
treeview,
treeview *,
menu,
menu *,
separator,
eventbox,
eventbox *,
box,
box *
{
 font-family: sans-serif;
 font-size: 1em;
 background-color: transparent;
 background-image: none;
 text-shadow:none;
 box-shadow:none;
 padding: 0;
 margin: 0;
 border: 0;
 outline-style:none;
 min-width: 0;
 min-height: 0;
}

/* General properties */

*:disabled
{
 color: @disabled_fg_color;
}

/* Side panels */

/* Remember, in gui/gtk.c, outer borders (active areas used to collapse panels)
*  are defined to 5 px × DPI. We cheat by setting inner borders/spacing here to 5 px as well
*/

#outer-border
{
 background-color: #000;
 min-width: 20px;
}

#left
{
 /* left sidebar */
}

#right
{
 /* right sidebar */
}

#left scrolledwindow,
#right scrolledwindow
{
 margin: 0;
 padding: 0;
}

#header-toolbar,
#footer-toolbar
{
 padding: 0.20em 0.40em;
}

/* Frame around modules boxes */
/* NOTE : Bauhaus controls inherit their font properties from there */

#lib-plugin-ui,
#iop-plugin-ui
{
 margin: 0;
 border-radius: 0;
 color: @plugin_fg_color;
 background-color: @plugin_bg_color;
}

#lib-plugin-ui scrolledwindow,
#iop-plugin-ui scrolledwindow
{
 margin: 0;
 padding: 0;
}

#iop-plugin-ui-main,
#lib-plugin-ui-main,
#blending-box
{
 padding: 0.75em;
}

#module-header
{
 /* module name */
 padding: 0.5em 0.5em 0.25em 0.5em;
}


/* GTK Buttons */

button
{
 border-radius: 2px;
 padding: 1px;
 margin: 0;
 border: 1px solid @button_border;
 background-color: @button_bg;
 color: @button_fg;
 font-weight: normal;
 font-family: sans-serif;
 min-height: 1em;
 min-width: 1em;
}

#recent-collection-button,
#history-button
{
 /* Exception because history and recent collections modules make use of a
  * list of GTK buttons but we don't want them to look like action buttons */
 background-color: transparent;
 border-color: transparent;
 border: 0;
 font-weight: normal;
}

button:selected,
button:active,
button:checked,
#recent-collection-button:selected,
#history-button:selected,
#recent-collection-button:active,
#history-button:active,
#recent-collection-button:checked,
#history-button:checked
{
 background-color: @button_checked_bg;
 color: @button_checked_fg;
}

button:hover,
#recent-collection-button:hover,
#history-button:hover
{
 background-color: @button_hover_bg;
 color: @button_hover_fg;
}

button:focus,
#recent-collection-button:focus,
#history-button:focus
{
 background-color: @button_focus_bg;
 color: @button_focus_fg;
}

button:disabled,
#recent-collection-button:disabled,
#history-button:disabled
{
 color: @disabled_fg_color;
 background-color: transparent;
}

#dt-button button,
#dt-toggle-button button,
#dt-icon
{
 border-radius: 2px;
}

#iop-plugin-ui button,
#lib-plugin-ui button
{
 margin: 2pt;
 padding: 2pt;
}

/* Buttons in toolbars in lighttable and darkroom */
#header-toolbar #dt-toggle-button,
#header-toolbar #dt-button,
#footer-toolbar #dt-toggle-button,
#footer-toolbar #dt-button
{
 padding: 0.9em;
 min-height: 1em; /* Align toolbox button height on comboboxe's one */
 min-width: 1em;
 border: 0;
 font-size: .7em;
}

/* Buttons in modules header, near the module name */
#module-preset-button * button,
#module-reset-button * button,
#module-enable-button * button,
#module-instance-button * button,
#module-enable-button * button,
#module-collapse-button * button
{
 background-color: transparent;
 min-height: 1em;
 min-width: 1em;
}

/* Button to open/close the dropdown section, especially header ones */
#control-button
{
   background-color: transparent;
   min-height: 1em;
   min-width: 1em;
   padding: 0.2em;
   margin: 0;
   border: 0;
}

#control-button:hover
{
   color: @button_hover_fg;
   background-color: @button_hover_bg;
   min-height: 1em;
   min-width: 1em;
   padding: 0.2em;
   border: 0;
   margin: 0;
}

/* Adjust size of button arrow to open/close dropdown on panels */
#iop-plugin-ui #control-button,
#lib-plugin-ui #control-button
{
   background-color: transparent;
   min-height: 1em;
   min-width: 1em;
   padding: 0.6em;
   margin: 0;
   border: 0;
}

#right #iop-plugin-ui #control-button /* especially for display arrow option on module filmic and if necessary other modules */
{
   background-color: transparent;
   min-height: 0.9em;
   min-width: 0.9em;
   padding: 0.2em;
   margin: 0;
   border: 0;
}

#iop-plugin-ui #control-button:hover,
#lib-plugin-ui #control-button:hover,
#right #iop-plugin-ui #control-button:hover
{
   color: @button_hover_fg;
   background-color: @button_hover_bg;
}

/* Checkbox */

#lib-plugin-ui checkbutton check,
#iop-plugin-ui checkbutton check,
checkbutton check
{
 background-color: @bauhaus_bg;
 color: @bauhaus_fg;
 border: 1pt solid @border_color;
}

/* Text fields and text boxes */

entry
{
 border-radius: 2pt;
 border: 0.5pt solid @border_color;
 color: @field_fg;
 background-color: @field_bg;
 min-height: 0;
 min-width: 0;
 padding-left: 3pt;
}

entry:hover
{
 color: @field_hover_fg;
 background-color: @field_hover_bg;
}

entry:checked,
entry:active,
entry:focus
{
 color: @field_active_fg;
 background-color: @field_active_bg;
}

entry selection
{
 background-color: @field_select_bg;
}


/* Labels in views */

#header_label,
#darktable_label,
#view_label,
#view_dropdown
{
 background-color: transparent;
 font-size: 1.5em;
 margin:0;
 border:0;
 padding:0;
}

/* Labels in modules */
#iop-panel-label,
#lib-panel-label
{
 background-color: @bg_color;
 color: @plugin_label_color;
 border:0;
 padding: 0 2pt 2pt 0.5em;
 font-weight: normal;
 font-stretch: condensed;
 font-family: sans-serif;
 font-size: 0.9em;
}

/* Labels of controls sections in modules */
#section_label
{
 margin: 0 0 6pt 0;
 padding: 0 0 3pt 0;
 color: @section_label;
 border-bottom: 0.5pt solid  @section_label;
 font-weight: 500;
 font-family: sans-serif;
}

#iop-plugin-ui #section_label,
#lib-plugin-ui #section_label
{
 margin: 12pt 0 6pt 0;
}

/* Special modules */

#lib-modulelist
{
}

#search-box
{
 margin: 0.25em 0.5em;
}

#search-box label
{
 margin-right: 0.5em;
}

#image-info
{
 font-size: 1.2em;
 padding: 0.25em;
}

/* Widget for parametric blending options in modules */

#blending-box #section_label
{
 margin: 0 0 6pt 0;
}

/* GTK sliders and scales */
/* WARNING : sliders IN modules are bauhaus (from a custom lib in darktable), not standard GTK sliders (see below) */

#lib-plugin-ui scrollbar slider,
#iop-plugin-ui scrollbar slider,
scrollbar slider,
dialog scrollbar slider
{
 background-color: @scroll_bar_inactive;
 border: 2pt solid transparent;
 margin: 0;
 min-width: 4pt;
 min-height: 4pt;
}

scale contents trough
{
 background-color: @scroll_bar_bg;
 border-radius: 2pt;
 min-width: 0.5em;
 min-height: 0.5em;
}

scale entry
{
 background-color: @field_bg;
}

scale contents trough highlight
{
 min-height: 0;
 min-width: 0;
 background-color: @button_bg;
}

scale contents trough slider
{
 border: 0.5pt solid @border_color;
 font-size: 1em;
 min-height: 0.5em;
 min-width: 0.5em;
 background-color: @scroll_bar_inactive;
}

scrollbar,
dialog scrollbar
scrollbar,
#iop-plugin-ui scrollbar,
#lib-plugin-ui scrollbar,
dialog scrollbar
{
 border-color: @scroll_bar_bg;
 background: @scroll_bar_bg;
 border-radius: 4pt;
 min-height: 4pt;
 min-width: 4pt;
 margin: 1pt;
}

scrollbar.horizontal slider:hover,
scrollbar.vertical slider:hover,
#iop-plugin-ui scrollbar slider:hover,
#lib-plugin-ui scrollbar slider:hover,
dialog scrollbar slider:hover,
scale contents trough slider:hover
{
 background-color: @scroll_bar_active;
}

scrollbar.horizontal slider:focus,
scrollbar.vertical slider:focus,
#iop-plugin-ui scrollbar slider:focus,
#lib-plugin-ui scrollbar slider:focus,
dialog scrollbar slider:focus,
scale contents trough slider:focus
{
 background-color: @scroll_bar_focus;
}

/* Context menu & tooltips & comboboxes */
/* Basically everything that pops out/over on UI */

combobox,
combobox button
{
 border: 1px solid transparent;
 padding: 1px;
 background-color: transparent;
 border-radius: 2pt;
 color: @bauhaus_fg;
 outline-style: none;
 min-height: 1em;
 min-width: 1em;
}

combobox entry
{
 margin: 0 0.5em;
}

combobox *
{
 min-height: 1em;
 min-width: 1em;
}

context-menu,
menu,
menuitem > menu, /* sub-menu */
menuitem arrow,
tooltip,
popover,
#background_job_eventbox,
combobox window,
dialog combobox window
{
 background-color: @tooltip_bg_color;
 color: @tooltip_fg_color;
 outline-style:none;
 border-radius: 2pt;
 border: 0;
 outline-style: none;
 min-height: 0.5em;
 min-width: 0.5em;
 padding: 0.5em;
}

#view_dropdown,
#view_label
{
 background-color: transparent;
 outline-style:none;
 border-radius: 2px;
 padding: 0.5em;
 color: @section_label;
}

menuitem button,
popover button,
tooltip button
{
 background-color: transparent;
}

menuitem:hover,
menuitem:hover arrow,
#view_dropdown menuitem:hover,
combobox window *:hover,
#view_dropdown:hover,
#view_label:hover
{
 background-color: @button_hover_bg;
 color: @button_hover_fg;
}

menuitem:selected,
combobox window *:selected,
menuitem:active,
combobox window *:active,
menuitem:focus,
combobox window *:focus
{
 background-color: @button_checked_bg;
 color: @button_checked_fg;
}

#view_dropdown *:selected,
#view_label:selected
{
 color: @plugin_fg_color;
}

#view_dropdown *:disabled,
#view_label:disabled
{
 color: @tooltip_bg_color;
}

#header-toolbar combobox,
#footer-toolbar combobox
{
 margin: 0 0.5em;
}

/* Tree view (lists and tables) */

treeview
{
 background-color: @field_bg;
 color: @field_fg;
}

treeview header
{
 background-color: @button_bg;
 color: @button_fg;
}

treeview *:hover
{
   background-color: @field_hover_bg;
   color: @field_hover_fg;
}

treeview *:selected
{
   background-color: @button_bg;
   color: @button_fg;
}

/* GTK Notebooks tabs */

notebook tabs,
#modules-tabs,
#blending-tabs
{
 border: 0;
 padding: 0;
 margin: 0;
 color: @button_fg;
 font-weight: normal;
 font-family: sans-serif;
}

#modules-tabs,
#blending-tabs
{
 background-color: @button_bg;
}

#modules-tabs #dt-toggle-button
{
 min-height: 2em;
 min-width: 2em;
 margin: 0;
 padding: 0.1em;
}

#blending-tabs *
{
 font-size: 0.8em;
 min-height: 1.5em;
 min-width: 1.5em;
 padding: 0.2em;
 margin: 0;
}

notebook tab
{
 border-bottom: 2px solid transparent;
 padding: 3px;
}

notebook tab label /* disabled tabs */
{
 color: shade(@button_checked_fg, 0.75);
}

notebook tab:hover
{
 border-bottom: 2px solid @button_hover_fg;
 color: @button_hover_fg;
 background-color: @button_hover_bg;
}

notebook tab:hover label
{
 color: @button_hover_fg;
}

notebook tab:checked,
notebook tab:focus
{
 border-bottom: 2px solid @button_checked_fg;
 color: @button_checked_fg;
}

notebook tab:checked label,
notebook tab:focus label
{
 color: @button_checked_fg;
}

/* This will avoid have too much height on entry items in dialog windows; label and button are needed as they are related */

#preferences_notebook *
{
 margin: 0;
}

#preferences_notebook scrolledwindow label,
#preferences_notebook scrolledwindow entry,
#preferences_notebook scrolledwindow button
{
 padding: 0px;
 margin: 3px 0;
}

/* Bauhaus controls (sliders and comboboxes in modules) */

#bauhaus-popup
{
 background-color: @really_dark_bg_color;
 color: @bauhaus_fg;
}

#bauhaus-popup:selected
{
 color: @bauhaus_fg;
}

#bauhaus-combobox,
#bauhaus-slider
{
 min-height: 1em;
 background-color: transparent;
 color: @bauhaus_fg;
}

#bauhaus-popup:hover,
#bauhaus-combobox:hover,
#bauhaus-slider:hover
{
 color: @bauhaus_fg_hover;
}

#bauhaus-popup:focus,
#bauhaus-combobox:focus,
#bauhaus-slider:focus
{
 color: @bauhaus_fg_hover;
}

#bauhaus-popup:disabled
{
 color: @plugin_bg;
}


/* separator */

separator, separator:hover
{
 color: transparent;
 border-style: solid;
 border-width: 0.25em;
 border-color: transparent;
 background-color: transparent;
}

/* Dialog window */

dialog
{
 background-color: @bg_color;
}

dialog *
{
 margin: 1px;
 padding: 0;
}

dialog headerbar
{
 background-color: @border_color;
 margin: 0;
 padding: 0.1em 0.6em;
}

dialog headerbar button
{
 padding: 1px 2px;
}

dialog button
{
 padding: 1px;
}

dialog scrolledwindow
{
 padding: 0 1px 0 8px;
 margin: 0;
 background-color: @plugin_bg_color;
}

.dialog-vbox treeview
{
 background-color: @button_bg;
}

/* empty space at top/bottom of sidepanels when scrolled */
undershoot,
undershoot.top,
undershoot.bottom,
undershoot.left,
undershoot.right,
overshoot,
overshoot.top,
overshoot.bottom,
overshoot.left,
overshoot.right
{
 background: transparent;
 border:none;
}


/* Rating stars in lighttable */
#lib-rating-stars
{
 min-height: 1em;
 min-width: 9em;
 margin-right: 1em;
}

/* Special modules */
#navigation-module
{
 background-color: @graph_bg;
}


/* GTK widget inner margins */

#lib-plugin-ui combobox,
#iop-plugin-ui combobox
{
 margin: 2px 0;
}

entry
{
 margin: 2px 0;
}

#left #lib-plugin-ui entry /* This will avoid have too much height on entry items in filter collections modules */
{
 padding: 0px;
 margin: 8px 0px;
}

#left #lib-plugin-ui scrolledwindow entry /* This will avoid having too much height on entry items in clone manager without touching other parts of the UI */
{
 padding: 0px;
 margin: 40px 3px;
 min-width: 150px;
}

#right #lib-plugin-ui entry /* This will adjust entry height on right panel */
{
 padding: 1px;
}

#lib-plugin-ui checkbutton check,
#iop-plugin-ui checkbutton check,
checkbutton check
{
 margin: 5px 8px 5px 0;
}

#left #lib-plugin-ui #dt-button /* arrow size of dropdown button arrow on filter collection */
{
 padding: 0px;
}

#iop-plugin-ui #dt-button  /* arrow size of some buttons on darkroom modules */
{
 padding: 2px;
}

#left #history-button /* choose here spacing between history items in darkroom */
{
 padding: 1px 2px 2px 2px;
 margin: 0px 1px 1px 1px;
}

#iop-bottom-bar
{
   min-height: 1.2em;
}

combobox label
{
 margin: 0 5px 0 0;
}

/* STUFF TO MERGE WITH ABOVE RULES */

aboutdialog,
aboutdialog box,
aboutdialog box *
{
 background-color: @bg_color;
}

aboutdialog headerbar
{
 padding: 2px;
}

progressbar *
{
 background-color: @text_color;
}

filechooserdialog eventbox
{
 background-color: transparent;
}

filechooserdialog sidebar-icon
{
 padding: 0px 5px 0px 10px;
}

filechooserdialog sidebar-row
{
 padding-top: 3px;
}

filechooserdialog sidebar-row:hover
{
 background-color: shade(@selected_bg_color, 1.7);
}

progressbar
{
 background-color: @really_dark_bg_color;
}
progressbar progress
{
 background-color: @fg_color;
}

cell:selected
{
 background-color: shade(@selected_bg_color, 1.2);
}

#show_mask_button
{
   color: #FFFF00;
}

#pref_section
{
   border-bottom: 2px solid @fg_color;
}
#pref_section *
{
   font-size: 1.3em;
   margin-left: 10em;
   margin-right: 10em;
}

/* Color picker */

#color-picker-area
{
   min-height: 9em;
   min-width: 9em;
}

#live-sample
{
   padding: 1pt;
   min-height: 1em;
   min-width: 3em;
}

#live-sample-data
{
  font-family: courier;
  font-weight: bold;
}

/* Accels window reminder */

.accels_window_cat_title
{
  background-color: transparent;
  font-weight: bold;
  font-size: 1.1em;
  padding: 10px 0px;
}

.accels_window_list button
{
  background-color: @button_bg;
  border: 0px;
}

.accels_window_list label
{
  font-weight: bold;
  font-size: 0.9em;
  padding-top: 1px;
  padding-right: 10px;
}

.accels_window_box treeview
{
  background-color: transparent;
}

.accels_window_stick
{
 min-width: 1.8em;
 min-height : 1.8em;
}

4) Enregistez avec le "nom que vous voulez"
5) Lancer darktable
6) Dans les préférences choisir comme thème "nom que vous voulez", puis fermer
7) Enjoy it
ATTENTION_1: Vérifier que la ligne d'import en début de fichier correspond à votre installation de darktable
ATTENTION_2: Le fichier ci-dessus est issu de l'installation Windows, il faut le prendre en entier; pour une distro Linux, je pense que l'on peut arrêter la copie à la ligne (à confirmer):

Code :

/* Reset GTK defaults - Otherwise dt inherits Adwaita default theme dark */