Tip: Arregla tus temas oscuros en Xfce (gtk) y Firefox

Más de alguna vez hemos querido utilizar algún tema oscuro, pero tarde o temprano encontramos algún inconveniente. Actualmente estoy utilizando Xfce con XMonad como gestor de ventanas. Así pues, configuro la apariencia desde la aplicación que Xfce trae para ello. Buscando, me topé con un tema oscuro bastante interesante: Xfce-dusk. Lo probé un tiempo y todo parecía perfecto hasta que me topé con lo siguiente:

Así pues: Google súper útil no viendo lo que estamos buscando

Si bien, aún es utilizable es muy incómodo así que me puse a revisar como arreglarlo. Resulta que el problema es que al aplicar un tema gtk+, se aplica a todos los programas que lo utilicen, y bueno Firefox no es la excepción. Eso no sería problema pues normalmente las cajas de texto (como los email en texto plano) mantienen la lógica del tema gtk, vale decir: fondo negro y letras blancas:

Sólo funciona en texto plano, en «texto enriquecido» se ve el fondo blanco y letras negras (como si no hubiera tema)

El asunto es que a veces algunos sitios no respetan estos estándares (como la primera imagen) y nos vemos obligados a encontrar alguna forma de lidiar con ellos. Así, me encontré con 4 soluciones que les detallo a continuación:

1. Utilizar Stylish con Midnight Surfing o Light text on black background,
2. Crear un estilo ad-hoc de Stylish (sugiero empezar por Google y Facebook),
3. Modificar el tema gtk, u
4. Olvidarnos de utilizar un tema oscuro :P

Finalmente me decidí por la tercera. Descarté la primera, porque intentaba abarcar demasiado (aunque sin duda para otra persona podría ser sumamente útil). Suponer que es posible modificar los estilos para toda la web sin romper nada no me parece plausible, aunque lo que alcancé a probar lo hacía bastante bien. Lo segundo es una buena alternativa si navegas por una cantidad limitada de sitios y los puedes identificar mejor, pero también significaba aprender un poco mejor cono funciona Stylish y aprender como sobreponer los estilos «propios» a los de la página web (pista: utiliza !important como condenado aunque sepas que es mala práctica). Esto último por supuesto es un tema que merece un artículo propio.

Decidí modificar el tema gtk porque imaginé que el problema de que algunos desarrolladores no respetaran estándares no pasaría sólo en Firefox y seguramente me toparía con el problema nuevamente. Así que decidí que en vez de utilzar el texto blanco, utilizaría un color intermedio entre negro y blanco para que contraste independientemente del fondo. Contrario a lo que me imaginaba, modificar un tema no es tan difícil como parecía (especialmente los gtk3 porque es básicamente CSS).

Lo primero entonces, es copiar el tema original a ~/.themes y cambiar el nombre. En mi caso le puse Xfce-dusk-fix. Dentro de esa carpeta deberíamos encontrar dos carpetas gtk-2.0 y gtk-3.0, cada una con un archivo: gtkrc y gtk.css respectivamente.

En el primero (gtkrc) hay que buscar las siguientes líneas (los [...] significa que hay código irrelevante):

[text]
GtkEntry::cursor_color = "#fcfcfc"
GtkEntry::secondary_cursor_color = "#fcfcfc"
GtkTextView::cursor_color = "#fcfcfc"
GtkTextView::secondary_cursor_color = "#fcfcfc"

[…]

text[ACTIVE] = "#fcfcfc"
[…]
text[NORMAL] = "#fcfcfc"
[/text]

Y cambiarlas a:

[text]
GtkEntry::cursor_color = "#777777"
GtkEntry::secondary_cursor_color = "#777777"
GtkTextView::cursor_color = "#777777"
GtkTextView::secondary_cursor_color = "#777777"

[…]

text[ACTIVE] = "#777777"
[…]
text[NORMAL] = "#777777"
[/text]

En el segundo archivo (gtk.css), sólo hay que cambiar 4 líneas (no vienen juntas, así que a buscarlas):

[css]
@define-color text_active #fcfcfc;
[…]
@define-color text_normal #fcfcfc;
[…]
-GtkWidget-cursor-color : #fcfcfc;
-GtkWidget-secondary-cursor-color: #fcfcfc;
[/css]

Por:

[css]
@define-color text_active #777777;
[…]
@define-color text_normal #777777;
[…]
-GtkWidget-cursor-color : #777777;
-GtkWidget-secondary-cursor-color: #777777;
[/css]

Una advertencia… no se pongan creativos e intenten cambiar todos los #fcfcfc por #777777 porque si no romperán todo.

Si quieren sencillamente descargar los archivos del tema Xfce-dusk ya modificado, lo pueden hacer desde el gist que cree para ello.

Los resultados finales son los siguientes:

Cualquier pregunta o comentario ya saben donde ;)

Nota final: Luego de utilizar un tiempo esta combinación, quizá no es mala idea buscar un tono de gris que esté más cerca del blanco, pues me queda la sensación que a pesar de que #777777 está justo en la mitad, su contraste con blanco es notablemente mejor que con el negro (en ocasiones cuesta un poco leerlo). Si alguien tiene alguna mejor idea, o ha probado con otro tono, que me cuente :)

Referencias:

• Xfce-dusk problem white text « Xfce Forums
• Sun Setting On Water de Peter Mazurek « stock.xchng