User:Canadabonk/sandbox.js: Difference between revisions
Content deleted Content added
Canadabonk (talk | contribs) No edit summary |
Canadabonk (talk | contribs) No edit summary |
||
Line 66:
$(listclass).text(colorlist);
}
$('#cosmostweaks-coloreditor').html(`▼
<h3 style="margin:0;color:black">Use this to visualise what a color scheme will look like!</h3>▼
<p>Anything done here is not saved, this is just for preview purposes.<br>▼
Paste the resulting code into your "Mediawiki:Gadget-cosmostweaks.css" to apply it.<br>▼
This tool can only work with hexcodes (like "#000000"). Swap them out for RGBA values with opacity in the CSS page, if desired.</p>▼
<table style="width:100%;border-collapse:collapse">▼
<tr><td style="width:30%"></td><th>Light mode</th><th>Dark mode</th></tr>▼
${CSSvarsRows()}▼
</table>▼
<p>Light mode colors:</p>▼
<pre class="lightmodevars">▼
</pre>▼
<p>Dark mode colors:</p>▼
<pre class="darkmodevars">▼
</pre>▼
`);▼
$('#cosmostweaks-coloreditor input').change(e => {
Line 84 ⟶ 101:
}
});
▲ $('#cosmostweaks-coloreditor').html(`
▲ <h3 style="margin:0;color:black">Use this to visualise what a color scheme will look like!</h3>
▲ <p>Anything done here is not saved, this is just for preview purposes.<br>
▲ Paste the resulting code into your "Mediawiki:Gadget-cosmostweaks.css" to apply it.<br>
▲ This tool can only work with hexcodes (like "#000000"). Swap them out for RGBA values with opacity in the CSS page, if desired.</p>
▲ <table style="width:100%;border-collapse:collapse">
▲ <tr><td style="width:30%"></td><th>Light mode</th><th>Dark mode</th></tr>
▲ ${CSSvarsRows()}
▲ </table>
▲ <p>Light mode colors:</p>
▲ <pre class="lightmodevars">
▲ </pre>
▲ <p>Dark mode colors:</p>
▲ <pre class="darkmodevars">
▲ </pre>
▲ `);
printcolors(lightmodevars);
| |||