# LL Dynamic Theme Style

Dynamic selection of theme style variants. Supports URL-based selection and automatic switching based on system/browser preference. Cookie-based selections persist and are only changed via the URL parameter (except default <-> 01-evening preference switch).

## Features

- 🌓 Auto-detects system color scheme via `prefers-color-scheme`
- 🎨 Injects theme colors as CSS variables from `styles/*.json`

## Requirements

- Theme variant files: `styles/default.json` and `styles/01-evening.json`

## Configuration

### Theme Variants

Create variant files in your theme:

```
your-theme/styles/
├── default.json      # Light theme
└── 01-evening.json   # Dark theme
```

Example structure:
```json
{
  "settings": {
    "color": {
      "palette": [
        { "slug": "primary", "color": "#0066cc" },
        { "slug": "secondary", "color": "#666666" }
      ]
    }
  },
  "styles": { "color": { "text": "#1a1a1a" } }
}
```

### URL Parameter

Change the active variant by adding `?style=your-variant` to the URL. This will store the selection in a cookie and is the only way to change the stored variant programmatically. Example: `?style=01-evening` or `?style=default`.

### Customize Variants

Edit [auto-style-switch.js](assets/js/auto-style-switch.js) to change the default variant names if needed.

## Architecture

- **Plugin.php** – Main class with hooks
- **Config.php** – Constants (PATH, URL, VERSION)
- **Functions.php** – Namespaced helper functions
- **auto-style-switch.js** – Frontend detection

All code uses `LasLie\DynamicThemeStyle` namespace.

## License

GPLv3 | https://www.gnu.org/licenses/gpl-3.0.html

---

**Author**

Lasse Liebler | [dev.laslie.de](https://dev.laslie.de)  

**Credits**
- AI-assisted development
- Repository icon by Freepik on [flaticon.com](https://www.flaticon.com)