How to make themes

Help
1

Hi

There is a light and dark theme in jabref.
Can somebody explain how to make my own themes or edit those 2?

So I want to know:

  • where are the files
  • what to edit
  • how to use the file in jabref when I edited it
  • can I download somewhere other themes ready for jabref

In version 5.10 the dark theme has white text compared to the dark theme in 5.9, which has grey text.
Why is that?

2

Hi
you find all the infos here: Custom themes - JabRef
They are basically just CSS files. In the top of the files there are the colors defined.

Regarding the font color: @HoussemNasri had some infos on this.

3

what do you mean by that?

4
5

Hi @thedino-girl, to undo the new lighter color of texts, you can

  1. Download Dark.css
  2. Open Dark.css in a text editor and set -fx-light-text-color to #9aa3af
  3. Finally, load the edited css file into JabRef as a custom theme
1 Like
7

@HoussemNasri
Can you make a screenshot of jabref soo I can see what colors are what variables?

8

About the Dark.css file: there is this variables

-jr-hover: #fff1;
-jr-icon-background-armed: #fff2;

But is #fff1 and #fff2 really correct since a color needs to have 3 groups of 2 digits for R, G and B: HTML HEX Colors
The 2 values here have only 4 digits so how can they work?

1 Like
9

Hi,

I guess it’s one of those shortcuts formats CSS 4 Digit Hex Colors

10

Can you make a screenshot of jabref soo I can see what colors are what variables?

I agree this would be really useful and will help users create custom themes faster. But unfortunately, I can’t commit time to this task right now, especially, since I don’t know the function of the colors off the top of my head.

Most of the components are styled with a set of base colors or with some derivation of those (such as darker or lighter shades). Once you’re familiar with the component names, navigating through the CSS styles should be straightforward. You can refer to this resource to learn about the names of UI components in JavaFX: JavaFX UI Component Names Reference. Also, I recommend having a look at the CSS reference of JavaFX: https://docs.oracle.com/javafx/2/api/javafx/scene/doc-files/cssref.html