mirror of
https://github.com/2009scape/2009scape.github.io.git
synced 2024-10-26 22:52:31 +02:00
Very nice checkboxes uwu uwu uwu
This commit is contained in:
parent
0b57aece5c
commit
d4732fed5f
@ -591,35 +591,45 @@ English
|
|||||||
<form action="./hiscores.html" method="post" class="no_margin">
|
<form action="./hiscores.html" method="post" class="no_margin">
|
||||||
<div id="remember">
|
<div id="remember">
|
||||||
<label for="rem">
|
<label for="rem">
|
||||||
<table class="center" style="margin: 0 auto; padding-top: 4px;">
|
<table class="center" style="margin: 0 auto; padding-top: 6px; padding-bottom: 8px;">
|
||||||
<tr>
|
<tr>
|
||||||
<td onmouseover="this.style.background='rgba(20, 20, 20, 0.3)';"
|
<td>
|
||||||
onmouseout="this.style.background='rgba(0, 0, 0, 0)';"
|
<span style="white-space: nowrap;">
|
||||||
onclick="document.getElementById('check_iron').checked = !document.getElementById('check_iron').checked">
|
<img src="../../site/img/osrsimg/ironman.png" style="height: 11px; padding-right: 30px;">
|
||||||
<img src="../../site/img/osrsimg/ironman.png" style="height: 11px;">
|
<label class="control control-checkbox">
|
||||||
<input type="checkbox" name="check_iron" id="check_iron" value="1" class="checkbox"
|
<input type="checkbox" name="check_iron" id="check_iron" value="1" class="checkbox"
|
||||||
style="pointer-events: none;">
|
style="pointer-events: none;" />
|
||||||
|
<div class="control_indicator"></div>
|
||||||
|
</label>
|
||||||
|
</span>
|
||||||
</td>
|
</td>
|
||||||
<td onmouseover="this.style.background='rgba(20, 20, 20, 0.3)';"
|
<td>
|
||||||
onmouseout="this.style.background='rgba(0, 0, 0, 0)';"
|
<span style="white-space: nowrap;">
|
||||||
onclick="document.getElementById('check_ultiron').checked = !document.getElementById('check_ultiron').checked">
|
<img src="../../site/img/osrsimg/ultimateironman.png" style="height: 11px; padding-right: 25px;">
|
||||||
<img src="../../site/img/osrsimg/ultimateironman.png" style="height: 11px;">
|
<label class="control control-checkbox">
|
||||||
<input type="checkbox" name="check_ultiron" id="check_ultiron" value="1" class="checkbox"
|
<input type="checkbox" name="check_ultiron" id="check_ultiron" value="1" class="checkbox"
|
||||||
style="pointer-events: none;">
|
style="pointer-events: none;" />
|
||||||
|
<div class="control_indicator"></div>
|
||||||
|
</label>
|
||||||
|
</span>
|
||||||
</td>
|
</td>
|
||||||
<td onmouseover="this.style.background='rgba(20, 20, 20, 0.3)';"
|
<td>
|
||||||
onmouseout="this.style.background='rgba(0, 0, 0, 0)';"
|
<span style="white-space: nowrap;">
|
||||||
onclick="document.getElementById('check_hciron').checked = !document.getElementById('check_hciron').checked">
|
<img src="../../site/img/osrsimg/hcim.png" style="height: 11px; padding-right: 25px;">
|
||||||
<img src="../../site/img/osrsimg/hcim.png" style="height: 11px;">
|
<label class="control control-checkbox">
|
||||||
<input type="checkbox" name="check_hciron" id="check_hciron" value="1" class="checkbox"
|
<input type="checkbox" name="check_hciron" id="check_hciron" value="1" class="checkbox"
|
||||||
style="pointer-events: none;">
|
style="pointer-events: none;" />
|
||||||
|
<div class="control_indicator"></div>
|
||||||
|
</label>
|
||||||
|
</span>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
<table class="center" style="margin: 0 auto; padding-top: 4px;">
|
<table class="center" style="margin: 0 auto; padding-top: 4px;">
|
||||||
<tr>
|
<tr>
|
||||||
<td>
|
<td>
|
||||||
<input class="nonBlueInputSlider" id="maxXP" type="range" min="1" max="10" value="10" step="0.5"
|
<input class="nonBlueInputSlider" id="maxXP" type="range" min="1" max="10" value="10"
|
||||||
|
step="0.5"
|
||||||
oninput="this.nextElementSibling.nextElementSibling.value = this.value % 1 != 0 ? this.value : this.value + '.0'">
|
oninput="this.nextElementSibling.nextElementSibling.value = this.value % 1 != 0 ? this.value : this.value + '.0'">
|
||||||
<br>
|
<br>
|
||||||
Max XP Rate: <output id="maxXPoutput">10</output>
|
Max XP Rate: <output id="maxXPoutput">10</output>
|
||||||
@ -628,7 +638,8 @@ English
|
|||||||
</table>
|
</table>
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
<input id="filter_submit" type="submit" name="submit" class="buttonmedium" value="Filter" style="margin-top: 2px;">
|
<input id="filter_submit" type="submit" name="submit" class="buttonmedium" value="Filter"
|
||||||
|
style="margin-top: 2px;">
|
||||||
<div id="filter_clear_div">
|
<div id="filter_clear_div">
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
@ -792,7 +792,11 @@
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/*
|
||||||
|
All of this was autogenerated
|
||||||
|
Started here: https://stackoverflow.com/questions/28283332/style-lower-and-upper-fill-in-html5-range-input
|
||||||
|
Found this here: http://danielstern.ca/range.css/#/
|
||||||
|
*/
|
||||||
input[type=range] {
|
input[type=range] {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin: 5.3px 0;
|
margin: 5.3px 0;
|
||||||
@ -883,3 +887,71 @@ how to remove the virtical space around the range input in IE*/
|
|||||||
/*Edge starts the margin from the thumb, not the track as other browsers do*/
|
/*Edge starts the margin from the thumb, not the track as other browsers do*/
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/*
|
||||||
|
Autogenerated from https://doodlenerd.com/html-control/css-checkbox-generator
|
||||||
|
*/
|
||||||
|
.control {
|
||||||
|
font-family: arial;
|
||||||
|
display: block;
|
||||||
|
position: relative;
|
||||||
|
margin-left: 15px;
|
||||||
|
margin-bottom: -13px;
|
||||||
|
padding-top: 0px;
|
||||||
|
cursor: pointer;
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
.control input {
|
||||||
|
position: absolute;
|
||||||
|
z-index: -1;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
.control_indicator {
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
left: 0;
|
||||||
|
height: 14px;
|
||||||
|
width: 14px;
|
||||||
|
background: #e9dfc5;
|
||||||
|
border: 1px outset #272525;
|
||||||
|
border-radius: 2px;
|
||||||
|
}
|
||||||
|
.control:hover input ~ .control_indicator {
|
||||||
|
background: #926f36;
|
||||||
|
}
|
||||||
|
|
||||||
|
.control input:checked ~ .control_indicator {
|
||||||
|
background: #654717;
|
||||||
|
}
|
||||||
|
.control:hover input:not([disabled]):checked ~ .control_indicator,
|
||||||
|
.control input:checked:focus ~ .control_indicator {
|
||||||
|
background: #654717;
|
||||||
|
}
|
||||||
|
.control input:disabled ~ .control_indicator {
|
||||||
|
background: #e6e6e6;
|
||||||
|
opacity: 0.6;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
.control_indicator:after {
|
||||||
|
box-sizing: unset;
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.control input:checked ~ .control_indicator:after {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.control-checkbox .control_indicator:after {
|
||||||
|
left: 4px;
|
||||||
|
top: 1px;
|
||||||
|
width: 3px;
|
||||||
|
height: 7px;
|
||||||
|
border: solid #e9dfc5;
|
||||||
|
border-width: 0 2px 2px 0;
|
||||||
|
transform: rotate(45deg);
|
||||||
|
}
|
||||||
|
.control-checkbox input:disabled ~ .control_indicator:after {
|
||||||
|
border-color: #7b7b7b;
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user