Initialized repo

.gitignore

@@ -0,0 +1,10 @@
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+!.vscode/*.code-snippets
+!*.code-workspace
+
+# Built Visual Studio Code Extensions
+*.vsix

assets/js/auto-style-switch.js

@@ -0,0 +1,15 @@
+/**
+ * Detects system/browser color scheme and sets the "style_variant" cookie accordingly.
+ * Reloads the page if the variant changes.
+ */
+
+(function () {
+  const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+  const cookie = document.cookie.split('; ').find(r => r.startsWith('style_variant='));
+  const current = cookie ? cookie.split('=')[1] : '';
+  const desired = prefersDark ? '01-evening' : 'default'; // Customize variant names as needed
+  if (current !== desired) {
+    document.cookie = "style_variant=" + desired + "; path=/; max-age=31536000";
+    location.reload();
+  }
+})();

includes/Config.php

@@ -0,0 +1,12 @@
+<?php
+/**
+ * Configuration constants for Theme Style Darkmode plugin.
+ */
+
+namespace LasLie\ThemeStyleDarkmode;
+
+class Config {
+    public const PATH = DIRNAME;
+    public const URL = DIRURL;
+    public const VERSION = '1.0.0';
+}

includes/Functions.php

@@ -0,0 +1,66 @@
+<?php
+/**
+ * Theme Style Darkmode Functions.
+ * Load and enqueue variant-specific CSS based on system color scheme preference.
+ */
+
+namespace LasLie\ThemeStyleDarkmode;
+
+/**
+ * Load and enqueue variant-specific CSS.
+ * Reads the style variant from cookie and injects its color palette
+ * as CSS custom properties.
+ *
+ * @return void
+ */
+function enqueue_variant_styles(): void {
+    $variant = sanitize_text_field( wp_unslash( $_COOKIE['style_variant'] ?? '' ) );
+
+    if ( empty( $variant ) ) {
+        return;
+    }
+
+    // Sanitize the cookie value and build path to the JSON variant file
+    $variant = sanitize_file_name( $variant );
+    $variant_json = get_theme_file_path( "styles/{$variant}.json" );
+
+    // Stop if the JSON file does not exist
+    if ( ! file_exists( $variant_json ) ) {
+        return;
+    }
+
+    // Read and decode the JSON
+    $file_content = file_get_contents( $variant_json );
+    if ( false === $file_content ) {
+        return;
+    }
+
+    $data = json_decode( $file_content, true );
+    if ( empty( $data['settings']['color']['palette'] ) ) {
+        return;
+    }
+
+    // Build CSS variables from the JSON color palette
+    $css = ":root {\n";
+    foreach ( $data['settings']['color']['palette'] as $color ) {
+        $slug  = sanitize_title( $color['slug'] ?? '' );
+        $value = esc_attr( $color['color'] ?? '' );
+        if ( $slug && $value ) {
+            $css .= "  --wp--preset--color--{$slug}: {$value};\n";
+        }
+    }
+    $css .= "}\n";
+
+    // Optional: apply additional top-level text color if available
+    if ( ! empty( $data['styles']['color']['text'] ) ) {
+        $text_color = esc_attr( $data['styles']['color']['text'] );
+        $css .= "body { color: {$text_color}; }\n";
+    }
+
+    // Register an empty style handle and add the generated inline CSS
+    wp_register_style( 'll-tsd-variant-generated', false );
+    wp_enqueue_style( 'll-tsd-variant-generated' );
+    wp_add_inline_style( 'll-tsd-variant-generated', $css );
+}
+
+add_action( 'wp_enqueue_scripts', __NAMESPACE__ . '\enqueue_variant_styles', 99 );

includes/Plugin.php

@@ -0,0 +1,43 @@
+<?php
+/**
+ * Main Plugin class for Theme Style Darkmode.
+ * Handles initialization and hooks registration.
+ */
+
+namespace LasLie\ThemeStyleDarkmode;
+
+class Plugin {
+    /**
+     * Initialize the plugin by registering hooks.
+     *
+     * @return void
+     */
+    public function init(): void {
+        add_action( 'plugins_loaded', [ $this, 'load_files' ] );
+        add_action( 'wp_enqueue_scripts', [ $this, 'enqueue_scripts' ] );
+    }
+
+    /**
+     * Load all plugin files systematically.
+     *
+     * @return void
+     */
+    public function load_files(): void {
+        require_once Config::PATH . 'includes/Functions.php';
+    }
+
+    /**
+     * Enqueue plugin scripts and styles.
+     *
+     * @return void
+     */
+    public function enqueue_scripts(): void {
+        wp_enqueue_script(
+            'll-tsd-auto-style-switch',
+            Config::URL . 'assets/js/auto-style-switch.js',
+            [],
+            Config::VERSION,
+            true
+        );
+    }
+}

theme-style-darkmode.php

@@ -0,0 +1,44 @@
+<?php
+/**
+ * Plugin Name:         LL Theme Style Darkmode
+ * Plugin URI:          https://git.laslie.de/wp/plugin-theme-style-darkmode
+ * Description:         Enables automatic switching the theme style variant between light and dark based on the system/browser default.
+ * Version: 1.0.0
+ 
+ * Requires at least: 
+ * Requires PHP:
+ 
+ * Author:              Lasse Liebler
+ * Author URI:          https://dev.laslie.de
+ 
+ * License:             GPLv3
+ * License URI:         https://www.gnu.org/licenses/gpl-3.0.html
+ 
+ * Text Domain:         theme-style-darkmode
+ * Domain Path:         /languages
+  
+ * Network:
+ 
+ * Update URI:          https://git.laslie.de/wp/plugin-theme-style-darkmode
+ 
+ * Requires Plugins:
+ */
+
+namespace LasLie\ThemeStyleDarkmode;
+
+// Abort if accessed directly.
+if ( ! defined( 'ABSPATH' ) ) exit;
+
+// Define constants for Config class.
+if ( ! defined( 'LasLie\ThemeStyleDarkmode\DIRNAME' ) ) {
+	define( 'LasLie\ThemeStyleDarkmode\DIRNAME', plugin_dir_path( __FILE__ ) );
+	define( 'LasLie\ThemeStyleDarkmode\DIRURL', plugin_dir_url( __FILE__ ) );
+}
+
+// Load config and main plugin file.
+require_once plugin_dir_path( __FILE__ ) . 'includes/Config.php';
+require_once plugin_dir_path( __FILE__ ) . 'includes/Plugin.php';
+
+// Initialize the plugin.
+$plugin = new Plugin();
+$plugin->init();