Interface CSS

[jpg54]

Ha oui, mes réflexes de WinDowsien sont enterrer très loin dans mes neurones.

---

L'erreur était en fait le backslash au lieu du slash entre les répertoires et pas l'espace dans le nom de fichier. En copiant/collant la ligne de code de jpg54 je n'avais pas fait gaffe. Sinon ça fonctionne avec l'espace dans le nom de fichier.

Je viens d'essayer avec :
@import 'C:/Program Files/darktable/share/darktable/darktable.css'
et :
@import 'C:\Progra~1\darktable\share\darktable\darktable.css'
et aussi :
@import 'C:/Progra~1/darktable/share/darktable/darktable.css'
J'ai toujours les grosses icônes et les liserets rouges.

[nicoauffray]

Ha oui, mes réflexes de WinDowsien sont enterrer très loin dans mes neurones.

---

L'erreur était en fait le backslash au lieu du slash entre les répertoires et pas l'espace dans le nom de fichier. En copiant/collant la ligne de code de jpg54 je n'avais pas fait gaffe. Sinon ça fonctionne avec l'espace dans le nom de fichier.

Je viens d'essayer avec :
@import 'C:/Program Files/darktable/share/darktable/darktable.css'
et :
@import 'C:\Progra~1\darktable\share\darktable\darktable.css'
et aussi :
@import 'C:/Progra~1/darktable/share/darktable/darktable.css'
J'ai toujours les grosses icônes et les liserets rouges.

Je vais peut-être dire une connerie, n'ayant pas utilisé Windows depuis (je fais donc appel à ma mémoire) : en ouvrant le terminal Windows (via le champ "Exécuter", taper cmd) et avec la commande cd, tu devrais pouvoir vérifier comment le chemin est noté (avec les slash ou backslash, espace ou pas, etc...) et reprendre le chemin tel quel. A vérifier si ça fonctionne. Bien sûr bien s'assurer que darktable est fermé avant toute modif des fichiers. La commande "Tab" permet comme sous Linux de compléter un chemin commencé (sous-dossier par dossier bien entendu).

[GM1901]

Ca devient surréaliste mais bon je suis belge, le surréalisme ça me connait. Trêve de plaisanterie, chez moi (Windows 10) ça fonctionne avec le code ci-dessous

@import 'C:/Program Files/darktable/share/darktable/darktable.css';

voici d'ailleurs le code complet que j’utilise, comme dit + haut il vient de nicoauffray :

@import 'C:/Program Files/darktable/share/darktable/darktable.css';

/* Couleur de fond général*/
@define-color bg_color #454545;
/* Couleur des filets de séparation de modules*/
@define-color plugin_bg_color #fff;
@define-color plugin_bg_color2 #111;
/* Couleur des titres des modules*/
@define-color fg_color #D2D2D2;
/* ???*/
@define-color base_color #ffffff;
/* Couleur de fond des barres de défilement */
@define-color text_color #3C3C3C;
/* Couleur de fond des options de modules*/
@define-color selected_bg_color #606060;
/* Couleur de certains textes dans les modules*/
@define-color selected_fg_color #f0f0f0;
@define-color tooltip_bg_color #BEBEBE;
@define-color tooltip_fg_color #111111;
/* Couleur du filet du cadre central*/
@define-color really_dark_bg_color #595959;
/* Couleur de fond du cadre central*/
@define-color darkroom_bg_color #696969;
@define-color darkroom_preview_bg_color shade(@darkroom_bg_color, .8);
@define-color lighttable_bg_color @darkroom_bg_color;
@define-color lighttable_preview_bg_color shade(@lighttable_bg_color, .8);
@define-color brush_cursor alpha(white, .9);
@define-color brush_trace alpha(black, .8);

@define-color bauhaus_fg @fg_color;
@define-color bauhaus_border #797979;
@define-color bauhaus_bg #E2E2E2;
@define-color bauhaus_fg_insensitive #E2E2E2;

progressbar *
{
background-color: @selected_bg_color;
}

* {
font: 8pt Sans;
font-family: system-ui, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
color: @fg_color;
background-color: @bg_color;
border-color: #7F7F7F;
text-shadow:none;
/* margin: 0; */ /* this makes scroll bars super wide. */
padding: 0;
background-image: none;
}

button {
background: rgb(90, 90, 90);
border: none;
border-radius: 5px;
}

/* Séparateur de modules */
#iop-plugin-ui,#iop-plugin-uielected,
#lib-plugin-ui
{
border: 1pt solid #353535;
box-shadow: inset 0 0 1pt #3a3a3a;
border-radius: 5px;
margin: 0pt;
padding: 1pt 4pt 1pt 4pt;
color: @selected_fg_color;
background-color: @darkroom_bg_color;
}

[jpg54]

Ha voui, ça marche mieux avec le ; :
@import 'C:/Program Files/darktable/share/darktable/darktable.css';
Oups, il est temps que j'aille me coucher, j'ai les yeux qui papillote !

[techexo]

Salut et merci pour ton travail !
J'ai un souci avec mon CSS, j'utilise le style Lumiroom de benoitdupont, mais je ne vois plus les icônes pipettes: dans filmique, par exemple, je ne vois les pipettes que lorsque je les sélectionne et qu'elles sont actives ; sinon elles sont de la même couleur que le fond.

J'utilise le style Lumiroom avec le @import qui va bien au début du fichier. Quelle est l'instruction à modifier pour cet élément ?

Merci

[nicoauffray]

Salut et merci pour ton travail !
J'ai un souci avec mon CSS, j'utilise le style Lumiroom de benoitdupont, mais je ne vois plus les icônes pipettes: dans filmique, par exemple, je ne vois les pipettes que lorsque je les sélectionne et qu'elles sont actives ; sinon elles sont de la même couleur que le fond.

J'utilise le style Lumiroom avec le @import qui va bien au début du fichier. Quelle est l'instruction à modifier pour cet élément ?

Merci

Les pipettes sont gérées par cette ligne :

@define-color bauhaus_fg_insensitive alpha(@bauhaus_fg, 0.5);

Tu modifies ce qui est après "insensitive" avec les paramètres/couleurs de ton choix. Personnellement, j'ai ça (ça s'adapte du coup si je change les couleurs principales) :

@define-color bauhaus_fg_insensitive @selected_bg_color;

---

voici d'ailleurs le code complet que j’utilise, comme dit + haut il vient de nicoauffray :

Ravi que mon style te plaise. J'ai beaucoup fait évoluer mon style pour m'approcher encore plus du gris moyen. Voici ma nouvelle version si ça intéresse certains (avec de nombreux commentaires pour savoir à quoi correspond chaque ligne ; enfin presque chaque ligne...) :

Code :

@import '/usr/share/darktable/darktable.css';

/* Couleurs principales de l'interface (bg_color étant la couleur du fond) */
@define-color bg_color #777;
@define-color base_color #ffffff;
@define-color text_color @fg_color;
/* Couleur des modules */
@define-color plugin_bg_color @bg_color;
@define-color selected_bg_color #666;
@define-color selected_fg_color #f0f0f0;
/* Couleur des bulles d'aide */
@define-color tooltip_bg_color #BEBEBE;
@define-color tooltip_fg_color #454545;
/* Couleur claire principale */
@define-color fg_color #DDD;
/* Couleur du filet du cadre central */
@define-color really_dark_bg_color #595959;
/* Couleur de fond du cadre central de la chambre noire */
@define-color darkroom_bg_color #777;
@define-color darkroom_preview_bg_color shade(@darkroom_bg_color, .8);
/* Couleur de fond du cadre central de la table lumineuse */
@define-color lighttable_bg_color @darkroom_bg_color;
@define-color lighttable_preview_bg_color shade(@lighttable_bg_color, .8);
/* Couleurs de la brosse - masque */
@define-color brush_cursor alpha(white, .9);
@define-color brush_trace alpha(black, .8);
/* Couleurs des curseurs de modules de la chambre noire */
@define-color bauhaus_fg @fg_color;
@define-color bauhaus_border #696969;
@define-color bauhaus_bg @selected_bg_color;
@define-color bauhaus_fg_insensitive @selected_bg_color; /* Couleur pipettes */

/* Images dans la table lumineuse */
@define-color thumbnail_bg_color #888; /* Couleur autour de l'image */
@define-color thumbnail_selected_bg_color #BBB; /* Couleur autour de l'image sélectionnée */
@define-color thumbnail_hover_bg_color #ccc; /* Couleur autour de l'image survolée */
@define-color thumbnail_outline_color #595959; /* Bordure des "diapos" encadrant les images & métadonnées */
@define-color thumbnail_selected_outline_color #666;
@define-color thumbnail_hover_outline_color #999;
@define-color thumbnail_font_color #6c6c6c;
@define-color thumbnail_selected_font_color #7f7f7f;
@define-color thumbnail_hover_font_color #b2b2b2;
@define-color thumbnail_border_color #555; /* rectangle directly around image */
@define-color thumbnail_selected_border_color #e5e5e5;

/* Barre de progression */
progressbar *
{
background-color: @selected_bg_color;
}

/* Caractéristiques du texte dans darktable */
* {
  font: 8pt Sans;
  font-family: system-ui, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  color: @fg_color;
  background-color: @bg_color;
  border-color: #454545; /* Couleur curseur bas table lumineuse et filets préférences */
  text-shadow:none;
/*  margin: 0; */ /* this makes scroll bars super wide. */
  padding: 0;
  background-image: none;
}

button {
   background: #6D6D6D;
   border: none;
   border-radius: 5px;
}

/* Modules */
#iop-plugin-ui,#iop-plugin-ui:selected,
#lib-plugin-ui
{
  border: 1pt solid #656565;
  box-shadow: inset 0 0 1pt #555;
  border-radius: 5px;
  margin: 0pt;
  padding: 1pt 4pt 1pt 4pt;
  color: @selected_fg_color;
  background-color: #7F7F7F;
}

#iop-plugin-ui notebook tab *:hover,
#lib-plugin-ui notebook tab *:hover
{
  background-color: shade(@selected_bg_color, 1.2);
}

#iop-plugin-ui notebook tab:checked *,
#lib-plugin-ui notebook tab:checked * {
  background-color: shade(@selected_bg_color, 1.1);
}

/* Zones de texte dans les modules */
#iop-plugin-ui entry,
#lib-plugin-ui entry,
entry {
  border-radius: 4px;
  background-color: shade(@selected_bg_color, 1.1);
}

/* buttons in plugins */
#lib-plugin-ui * button,
button
{
  background-color: shade(@selected_bg_color, 1.0);
}

/* Fond barre de défilement des modules */

#iop-plugin-ui scrollbar.horizontal,
#iop-plugin-ui scrollbar.vertical,
#lib-plugin-ui scrollbar.horizontal,
#lib-plugin-ui scrollbar.vertical {
  border-color: @selected_bg_color;
  background-color: shade(@darkroom_bg_color, .9);
}

[jpverrue]

Bonjour à toutes et tous,

Avec la version 2.6 est apparu un nouveau module en chambre noire : gestion des clones. Avec ce module, on peut facilement ajouter ou supprimer des clones, on peut aussi passer de l'un à l'autre très facilement. Et on peut enfin visualiser rapidement un clone sans quitter pour autant la photo que l'on est en train de traiter. C'est génial ! Par contre j'ai un petit problème d'interface avec cette dernière fonctionnalité. J'utilise un thème d'interface clair avec un background pour la zone image de la chambre noire presque blanc (#ddd), mais quand je clique sur un clone pour le visualiser, le background est affiché avec la couleur gris foncé par défaut. J'ai cherché (probablement très mal), dans le fichier /usr/share/darktable/darktable.css un sélecteur qui correspondrait à ce fond pour le changer, mais je n'ai pas trouvé.

Est-ce que ce sélecteur existe ? Ou faudrait-il le rajouter lors d'une prochaine version ?

Merci d'avance pour toute information !

[pascal]

C'est normal

Matthieu a corrigé cela le 6 janvier, ce sera dans la 2.6.1:

Code :

commit 6e177c8ce54ad78613df13fdd4aca31937861dc5
Author: Matthieu Moy <git@matthieu-moy.fr>
Date:   Sun Jan 6 20:20:03 2019 +0100

   duplicate: don't hardcode background color

src/libs/duplicate.c | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)

[jpverrue]

Merci à toi... Et à Matthieu bien sûr

[Thib22]

Bonjour,
J'ai découvert via cette discussion le fait de pouvoir changer les couleurs de l'interface et je trouve ça assez sympa
Donc, ce week-end, je me suis amusé à rechercher les différents endroits du fichier .css (dans une copie) qu'il fallait modifier pour avoir un style qui me plaisait et j'en suis arrivé à ça !


Mais j'ai un petit souci, j'aimerais savoir où inscrire la ligne @import 'C:/Program Files/darktable/share/darktable/darktable.css';
Est-ce qu'en la mettant au dessus de mon fichier copie, il le lie automatiquement au fichier.css du programme ou faut-il faire autre chose ? Etant sous windows, je fais des manipulations avec les dossiers cachés (user,Appdata,...) mais j'aimerais avoir un fichier .css sur mon bureau qui ne me fasse plus passé par cette méthode

Merci