Force Light Mode for LikeC4 Apps

Force light theme on LikeC4 static web apps regardless of OS/browser theme

您需要先安装一个扩展,例如 篡改猴Greasemonkey暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴Userscripts ,之后才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。

您需要先安装用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name         Force Light Mode for LikeC4 Apps
// @namespace    http://tampermonkey.net/
// @version      1.0
// @license      MIT
// @description  Force light theme on LikeC4 static web apps regardless of OS/browser theme
// @icon         https://likec4.dev/favicon.svg
// @match        *://*/*
// @grant        none
// ==/UserScript==

(function () {
    'use strict';

    // Utility: Check if it's a LikeC4 app (basic heuristic)
    function isLikeC4App() {
        return document.querySelector('[data-likec4-app]') !== null ||
               document.querySelector('meta[name="generator"][content*="likec4"]') ||
               document.querySelector('#likec4-root');
    }

    // Override theme detection
    function forceLightTheme() {
        // Override prefers-color-scheme
        const style = document.createElement('style');
        style.textContent = `
            @media (prefers-color-scheme: dark) {
                :root {
                    color-scheme: light !important;
                }
            }
        `;
        document.head.appendChild(style);

        document.documentElement.setAttribute('data-mantine-color-scheme', 'light');
    }

    window.addEventListener('load', () =>{
        if (isLikeC4App()) {
            //console.log('found likec4 site')

            forceLightTheme();
        }
        else {
            //console.log('no likec4 site found');
        }
    });
})();