User:Canadabonk/sandbox.js: Difference between revisions
Content added Content deleted
Canadabonk (talk | contribs) No edit summary |
Canadabonk (talk | contribs) No edit summary |
||
Line 22: | Line 22: | ||
text = ""; |
text = ""; |
||
for (var x in variablesList){ |
for (var x in variablesList){ |
||
text += variablesList[x].name + ": " + variablesList[x].val + ";\n"; |
text += " " + variablesList[x].name + ": " + variablesList[x].val + ";\n"; |
||
} |
} |
||
return text; |
return text; |
||
Line 29: | Line 29: | ||
const newCSSVariables = |
const newCSSVariables = |
||
`:root { |
`:root { |
||
${variablesListCSS()} |
|||
}`; |
}`; |
||
Revision as of 16:43, 12 June 2024
$(document).ready(function(){
const
mainBackgroundColor = $('body').css('background-color'),
contentBackgroundColor = $('#mw-content').css('background-color'),
fontColor = $('#mw-content').css('color'),
linkColor = $('#content a:not(.new').css('color');
function cssVar(name, val, desc) {
this.name = name;
this.val = val;
this.desc = desc ? desc : "none";
}
const variablesList = {
mainbgcolor: new cssVar('--main-background-color', mainBackgroundColor),
contentbgcolor: new cssVar('--content-background-color', contentBackgroundColor),
fontcolor: new cssVar('--font-color', fontColor),
linkcolor: new cssVar('--link-color', linkColor)
};
function variablesListCSS() {
text = "";
for (var x in variablesList){
text += " " + variablesList[x].name + ": " + variablesList[x].val + ";\n";
}
return text;
}
const newCSSVariables =
`:root {
${variablesListCSS()}
}`;
mw.util.addCSS(newCSSVariables);
$('#printCSSVars').html(
`<pre>
${newCSSVariables}
</pre>`);
});