Theme switcher

Global website theme

The theme switcher is a component allowing you to change the global theme of your website easily.
By default, Axentix handles the dark theme.
You still need to create your theme, the theme switcher is only made to help you switch between your themes.

Three themes are already working :

  • Light
  • Dark
  • System (automatically choosing between dark and light depending on the system preferences)
The default theme is System if you enable the Theme component.

Theme enabling

To enable the theme component, use the enable method.

Theme switching

To handle theme switching, use the Theme class.

Mixins

Use the theme mixin to set css depending on the actual theme.
Here is the docs navbar theme handling example :

Methods

Method Description
Axentix.Theme.toggle('dark') Toggles the theme with the name as parameter.
Axentix.Theme.enable() Enable the theme handling component.
Axentix.Theme.disable() Disable the theme handling component.

Events

Event Description
ax.theme.change Event sent when the theme has been changed.