2 Creating a new theme

n1474335 edited this page 2017-08-10 11:57:24 +01:00

Table of Contents

• How to create a new theme

How to create a new theme

It's very easy to add a new theme, there are just a few simple steps:

1. Add a new <option> element to select#theme in src/web/html/index.html with the name of your theme.

   <option value="mytheme">My Theme</option>
   

2. Copy the contents of src/web/stylesheets/themes/_dark.css into a new file with the name of your theme i.e. src/web/stylesheets/themes/_mytheme.css.

3. Modify the JSDoc comment appropriately.

4. Change the class name attached to the :root selector to be the same as the value you gave the <option> tag in step 1.

   :root.mytheme {
   

5. Add an import for your theme in src/web/stylesheets/index.css.

   @import "./themes/mytheme.css";
   

6. Change the values of the CSS properties to modify the theme to your taste.

7. Submit a pull request!