Skip to content

themes.md

Latest commit

 

History

History
51 lines (33 loc) · 1021 Bytes

themes.md

File metadata and controls

51 lines (33 loc) · 1021 Bytes

Theme development

Description

In the admin it is possible to create custom themes for templates.

For the styles to have effect you will need to use the #SLIDE_ID to all styling.

#SLIDE_ID will be replaced with an actual id in the Client to isolate the styling on the current slide.

Examples

An example file can be found in this directory: example.css.

Below is an example of variables on the slide container.

#SLIDE_ID {
  /* Default variables */
  --bg-light: #f6f6f6;
  --text-dark: #333333;
  --color-primary: #3761d9;
  --color-secondary: #ef0043;
  --font-family-base: Arial, "sans-serif";
  /* Darkmode overrides */
  --bg-dark: #333333;
  --text-light: #ffffff;
}

Below is a example of simple background color on the whole slide using the template Text and Image.

#SLIDE_ID .template-text-image {
  background-color: hsl(240, 100, 99);
}

Below is a example of setting a color on H1 elements.

#SLIDE_ID h1 {
  color: hsl(240, 3, 7);
}