☰

Civitai Auto Dark/Light Theme

Automatically switches the color scheme on Civitai based on system settings

// ==UserScript==
// @name         Civitai Auto Dark/Light Theme
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Automatically switches the color scheme on Civitai based on system settings
// @author       none
// @match        https://civitai.com/*
// @icon         https://civitai.com/favicon.ico
// @grant        none
// @license      GNU GPLv3
// ==/UserScript==

(function() {
    'use strict';

    // Function to set the theme
    function setTheme(theme) {
        const htmlElement = document.documentElement;
        htmlElement.setAttribute('data-mantine-color-scheme', theme);

        // Update body class if needed (optional, based on site implementation)
        document.body.className = theme;
    }

    // Check system preference
    function updateTheme() {
        if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
            setTheme('dark');
        } else {
            setTheme('light');
        }
    }

    // Initial theme setup
    updateTheme();

    // Listen for system theme changes
    window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', updateTheme);
})();