Add apply button to scheme swap, make it easier to read
This commit is contained in:
parent
79ba947148
commit
1f9dde81d4
3 changed files with 13 additions and 3 deletions
|
@ -296,6 +296,7 @@ input.file {
|
||||||
table.form tr td textarea,
|
table.form tr td textarea,
|
||||||
table.form tr td input,
|
table.form tr td input,
|
||||||
table.form tr td button,
|
table.form tr td button,
|
||||||
|
button,
|
||||||
form.import input::file-selector-button,
|
form.import input::file-selector-button,
|
||||||
form.import button {
|
form.import button {
|
||||||
background-color: var(--background);
|
background-color: var(--background);
|
||||||
|
@ -314,6 +315,7 @@ table.form tr td button {
|
||||||
}
|
}
|
||||||
|
|
||||||
form.import button:hover,
|
form.import button:hover,
|
||||||
|
button:hover,
|
||||||
form.import input::file-selector-button:hover,
|
form.import input::file-selector-button:hover,
|
||||||
table.form tr td button:hover {
|
table.form tr td button:hover {
|
||||||
color: var(--background);
|
color: var(--background);
|
||||||
|
@ -671,6 +673,12 @@ a:hover img.navbar-icon {
|
||||||
}
|
}
|
||||||
|
|
||||||
.footer p {
|
.footer p {
|
||||||
|
vertical-align: middle;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
line-height: 1.2;
|
line-height: 1.2;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.footer button,
|
||||||
|
.footer select{
|
||||||
|
padding: 5px 10px;
|
||||||
|
}
|
||||||
|
|
|
@ -46,7 +46,8 @@ function cookieExists(cname) {
|
||||||
* Swaps the colorscheme
|
* Swaps the colorscheme
|
||||||
* @param {string} scheme Color scheme ID
|
* @param {string} scheme Color scheme ID
|
||||||
*/
|
*/
|
||||||
function swapScheme(scheme) {
|
function swapScheme() {
|
||||||
|
let scheme = document.getElementById('scheme-selector').value ;
|
||||||
setCookie("colorscheme", scheme, 90);
|
setCookie("colorscheme", scheme, 90);
|
||||||
document.getElementById("css-colorscheme").href = `/css/colorschemes/${scheme}.css`;
|
document.getElementById("css-colorscheme").href = `/css/colorschemes/${scheme}.css`;
|
||||||
console.log(`Set colorscheme to ${getCookie("colorscheme")}`)
|
console.log(`Set colorscheme to ${getCookie("colorscheme")}`)
|
||||||
|
|
|
@ -62,7 +62,7 @@ class="pixel" alt="Wiby - Search Engine for the Classic Web">
|
||||||
href="https://github.com/floppydisk05/diskfloppy.me">Source</a>,
|
href="https://github.com/floppydisk05/diskfloppy.me">Source</a>,
|
||||||
Served by {{ gethostname() }}<br>
|
Served by {{ gethostname() }}<br>
|
||||||
<label for="scheme-selector">Color Scheme:</label>
|
<label for="scheme-selector">Color Scheme:</label>
|
||||||
<select onchange="swapScheme(this.value)" id="scheme-selector">
|
<select id="scheme-selector">
|
||||||
<optgroup label="Misc">
|
<optgroup label="Misc">
|
||||||
<option value="c64">C64</option>
|
<option value="c64">C64</option>
|
||||||
</optgroup>
|
</optgroup>
|
||||||
|
@ -95,7 +95,8 @@ class="pixel" alt="Wiby - Search Engine for the Classic Web">
|
||||||
<option value="slate">Slate</option>
|
<option value="slate">Slate</option>
|
||||||
<option value="solarized-dark">Solarized Dark</option>
|
<option value="solarized-dark">Solarized Dark</option>
|
||||||
</optgroup>
|
</optgroup>
|
||||||
</select></p>
|
</select>
|
||||||
|
<button onclick="swapScheme()">Apply</button></p>
|
||||||
</div>
|
</div>
|
||||||
</div> <!-- footer -->
|
</div> <!-- footer -->
|
||||||
</div> <!-- page -->
|
</div> <!-- page -->
|
||||||
|
|
Loading…
Reference in a new issue