WPHammer
Log in

Appearance

WPHammer supports three appearance modes that control the application's visual theme. You can change your preference from /settings/appearance.

Theme options

Mode Icon Behavior
Light Sun Always uses the light theme
Dark Moon Always uses the dark theme
System Computer desktop Follows your operating system's appearance setting

The appearance setting is a segmented radio group — select your preferred mode and it applies immediately.

How it works

Theme switching is handled entirely on the client side using Alpine.js and Flux's $flux.appearance store. There is no server-side persistence — the preference is stored in the browser via Flux's built-in mechanism and applies instantly without a page reload.

The Livewire component for the appearance page has no server-side properties or methods. All interaction happens through Alpine.js directives bound to the $flux.appearance value.

Dark mode across the application

The dark mode toggle in the docs layout header and the main application layout both use the same $flux.dark Alpine.js property:

x-on:click="$flux.dark = ! $flux.dark"

This toggle switches between light and dark regardless of the system preference. The appearance settings page provides finer control by also offering the system-following mode.

Related