미디어위키:Gadget-CSSVars.js: 두 판 사이의 차이

새 문서: mw.hook('wikipage.content').add(function ($content) { const el = $content.find('.mw-css-vars').first(); if (!el.length) return; let vars; try { vars = JSON.parse(el.attr('data-vars')); } catch (e) { console.error('CSSVars: invalid JSON', e); return; } const root = document.documentElement; Object.entries(vars).forEach(([key, value]) => { root.style.setProperty(`--${key}`, value); }); });
 
편집 요약 없음
7번째 줄: 7번째 줄:
vars = JSON.parse(el.attr('data-vars'));
vars = JSON.parse(el.attr('data-vars'));
} catch (e) {
} catch (e) {
console.error('CSSVars: invalid JSON', e);
console.error('PageCSSVars: invalid JSON', e);
return;
return;
}
}


const root = document.documentElement;
const root = document.documentElement;
const isDark = window.matchMedia('(prefers-color-scheme: dark)').matches;


Object.entries(vars).forEach(([key, value]) => {
Object.entries(vars).forEach(([key, value]) => {
root.style.setProperty(`--${key}`, value);
let targetKey = key;
let apply = true;
 
if (key.endsWith('-light')) {
targetKey = key.replace(/-light$/, '');
apply = !isDark;
} else if (key.endsWith('-dark')) {
targetKey = key.replace(/-dark$/, '');
apply = isDark;
}
 
if (!apply) return;
 
/* 🔥 !important 강제 */
root.style.setProperty(`--${targetKey}`, value, 'important');
});
});
});
});

2026년 1월 28일 (수) 18:24 판

mw.hook('wikipage.content').add(function ($content) {
	const el = $content.find('.mw-css-vars').first();
	if (!el.length) return;

	let vars;
	try {
		vars = JSON.parse(el.attr('data-vars'));
	} catch (e) {
		console.error('PageCSSVars: invalid JSON', e);
		return;
	}

	const root = document.documentElement;
	const isDark = window.matchMedia('(prefers-color-scheme: dark)').matches;

	Object.entries(vars).forEach(([key, value]) => {
		let targetKey = key;
		let apply = true;

		if (key.endsWith('-light')) {
			targetKey = key.replace(/-light$/, '');
			apply = !isDark;
		} else if (key.endsWith('-dark')) {
			targetKey = key.replace(/-dark$/, '');
			apply = isDark;
		}

		if (!apply) return;

		/* 🔥 !important 강제 */
		root.style.setProperty(`--${targetKey}`, value, 'important');
	});
});