mirror of
https://github.com/LBPUnion/ProjectLighthouse.git
synced 2025-08-09 05:18:47 +00:00
Fix UI inconsistencies in checkboxes
This commit is contained in:
parent
7839082c30
commit
07aee8347d
1 changed files with 17 additions and 8 deletions
|
@ -61,30 +61,30 @@ function onSubmit(){
|
|||
<textarea name="description" id="description" spellcheck="false" placeholder="Description">@HttpUtility.HtmlDecode(Model.Slot.Description)</textarea>
|
||||
</div>
|
||||
<div class="ui divider"></div>
|
||||
<label class="ui red label" for="initiallyLocked">
|
||||
<label class="ui button label" id="labelInitiallyLocked" for="checkboxInitiallyLocked">
|
||||
<i class="lock icon"></i>
|
||||
Locked
|
||||
<input type="checkbox" name="initiallyLocked" id="initiallyLocked" style="margin-left: 5px;" @(Model.Slot.InitiallyLocked ? "checked" : "") value="true">
|
||||
<input type="checkbox" name="initiallyLocked" id="checkboxInitiallyLocked" style="margin-left: 5px;" onchange="onCheckboxChange(this)" @(Model.Slot.InitiallyLocked ? "checked" : "") value="true">
|
||||
</label>
|
||||
<label class="ui green label" for="shareable">
|
||||
<label class="ui button label" id="labelShareable" for="checkboxShareable">
|
||||
<i class="check icon"></i>
|
||||
Copyable
|
||||
<input type="checkbox" name="shareable" id="shareable" style="margin-left: 5px;" @(Model.Slot.Shareable == 1 ? "checked" : "") value="1">
|
||||
<input type="checkbox" name="shareable" id="checkboxShareable" style="margin-left: 5px;" onchange="onCheckboxChange(this)" @(Model.Slot.Shareable == 1 ? "checked" : "") value="1">
|
||||
</label>
|
||||
@if (Model.Slot.GameVersion != GameVersion.LittleBigPlanet1)
|
||||
{
|
||||
<label class="ui blue label" for="subLevel">
|
||||
<label class="ui button label" id="labelSubLevel" for="checkboxSubLevel">
|
||||
<i class="arrow circle down icon"></i>
|
||||
Sub Level
|
||||
<input type="checkbox" name="subLevel" id="subLevel" style="margin-left: 5px;" @(Model.Slot.SubLevel ? "checked" : "") value="true">
|
||||
<input type="checkbox" name="subLevel" id="checkboxSubLevel" style="margin-left: 5px;" onchange="onCheckboxChange(this)" @(Model.Slot.SubLevel ? "checked" : "") value="true">
|
||||
</label>
|
||||
}
|
||||
else
|
||||
{
|
||||
<label class="ui yellow label" for="lbp1Only">
|
||||
<label class="ui button label" id="labelLbp1Only" for="checkboxLbp1Only">
|
||||
<i class="eye icon"></i>
|
||||
LBP1 Only
|
||||
<input type="checkbox" name="lbp1Only" id="lbp1Only" style="margin-left: 5px;" @(Model.Slot.Lbp1Only ? "checked" : "") value="true">
|
||||
<input type="checkbox" name="lbp1Only" id="checkboxLbp1Only" style="margin-left: 5px;" onchange="onCheckboxChange(this)" @(Model.Slot.Lbp1Only ? "checked" : "") value="true">
|
||||
</label>
|
||||
}
|
||||
<div class="ui divider fitted hidden"></div>
|
||||
|
@ -134,6 +134,15 @@ function onSubmit(){
|
|||
function onHoverStart(btn){
|
||||
generateRandomSkew(btn);
|
||||
}
|
||||
function onCheckboxChange(checkbox) {
|
||||
const labelId = checkbox.id.replace('checkbox', 'label');
|
||||
const label = document.getElementById(labelId);
|
||||
if (checkbox.checked) {
|
||||
label.classList.add('selected');
|
||||
} else {
|
||||
label.classList.remove('selected');
|
||||
}
|
||||
}
|
||||
function generateRandomSkew(element){
|
||||
let rand = Math.random() * 6 - 3;
|
||||
element.style.setProperty("--skew", "rotate(" + rand + "deg)");
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue