Filter results
This commit is contained in:
@@ -425,6 +425,45 @@
|
|||||||
color: darkgray;
|
color: darkgray;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.toggle {
|
||||||
|
display: inline-block;
|
||||||
|
cursor: pointer;
|
||||||
|
text-align: center;
|
||||||
|
input {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
label {
|
||||||
|
display: inline-block;
|
||||||
|
text-align: center;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.checkbox {
|
||||||
|
width: 50px;
|
||||||
|
height: 26px;
|
||||||
|
border-radius: 18px;
|
||||||
|
background-color: #F7D6A3;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
padding-left: 5px;
|
||||||
|
padding-right: 5px;
|
||||||
|
cursor: pointer;
|
||||||
|
.circle {
|
||||||
|
background-color: #6B5E8A;
|
||||||
|
transform: translateX(0px);
|
||||||
|
border-radius: 50%;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
transition: 300ms;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
input:checked + .checkbox {
|
||||||
|
background-color: rgb(218, 114, 80);
|
||||||
|
.circle {
|
||||||
|
transform: translateX(20px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@media print {
|
@media print {
|
||||||
|
|
||||||
body {
|
body {
|
||||||
|
@@ -91,43 +91,6 @@
|
|||||||
}
|
}
|
||||||
#search-form {
|
#search-form {
|
||||||
position: relative;
|
position: relative;
|
||||||
.toggle {
|
|
||||||
cursor: pointer;
|
|
||||||
text-align: center;
|
|
||||||
input {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
label {
|
|
||||||
display: block;
|
|
||||||
text-align: center;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.checkbox {
|
|
||||||
width: 50px;
|
|
||||||
height: 26px;
|
|
||||||
border-radius: 18px;
|
|
||||||
background-color: #F7D6A3;
|
|
||||||
display: inline-flex;
|
|
||||||
align-items: center;
|
|
||||||
padding-left: 5px;
|
|
||||||
padding-right: 5px;
|
|
||||||
cursor: pointer;
|
|
||||||
.circle {
|
|
||||||
background-color: #6B5E8A;
|
|
||||||
transform: translateX(0px);
|
|
||||||
border-radius: 50%;
|
|
||||||
width: 20px;
|
|
||||||
height: 20px;
|
|
||||||
transition: 300ms;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
input:checked + .checkbox {
|
|
||||||
background-color: rgb(218, 114, 80);
|
|
||||||
.circle {
|
|
||||||
transform: translateX(20px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
#search-result {
|
#search-result {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@@ -310,7 +273,7 @@
|
|||||||
#results-list {
|
#results-list {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
.player, .result {
|
.player, .result {
|
||||||
background-color: white;
|
background-color: unset;
|
||||||
color: black;
|
color: black;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
&:hover {
|
&:hover {
|
||||||
@@ -326,6 +289,11 @@
|
|||||||
font-style: italic;
|
font-style: italic;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
#results-table {
|
||||||
|
tr.filtered {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* standings section */
|
/* standings section */
|
||||||
|
@@ -53,4 +53,12 @@ onLoad(()=>{
|
|||||||
let newResult = results[(index + 1)%results.length];
|
let newResult = results[(index + 1)%results.length];
|
||||||
setResult(gameId, newResult, oldResult);
|
setResult(gameId, newResult, oldResult);
|
||||||
});
|
});
|
||||||
|
$('#filter').on('click', e=>{
|
||||||
|
let filter = $('#filter-results')[0].checked;
|
||||||
|
if (filter) {
|
||||||
|
$('#results-table tr').filter(':not(:has(td.result[data-result="?"]))').addClass('filtered');
|
||||||
|
} else {
|
||||||
|
$('#results-table tr').removeClass('filtered');
|
||||||
|
}
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
@@ -6,6 +6,13 @@
|
|||||||
<button class="ui floating choose-round next-round button">»</button>
|
<button class="ui floating choose-round next-round button">»</button>
|
||||||
#set($stats = $utils.getResultsStats($games))
|
#set($stats = $utils.getResultsStats($games))
|
||||||
<span class="norbeak">( <span id="known">$stats.known</span> / $stats.total )</span>
|
<span class="norbeak">( <span id="known">$stats.known</span> / $stats.total )</span>
|
||||||
|
<div id="filter" class="toggle">
|
||||||
|
<input id="filter-results" type="checkbox" value="true"/>
|
||||||
|
<div class="filter-results checkbox">
|
||||||
|
<div class="circle"></div>
|
||||||
|
</div>
|
||||||
|
<label>Filter</label>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div id="results-list" class="roundbox">
|
<div id="results-list" class="roundbox">
|
||||||
<table id="results-table" class="ui celled striped table">
|
<table id="results-table" class="ui celled striped table">
|
||||||
|
Reference in New Issue
Block a user