removed (hid) the checkboxes on method steps since they looked bad
This commit is contained in:
parent
ebcb267739
commit
641fbd7c74
3 changed files with 24 additions and 8 deletions
|
@ -8,7 +8,7 @@
|
||||||
<ol class='method' data-cb-prefix='{{ prefix }}'>
|
<ol class='method' data-cb-prefix='{{ prefix }}'>
|
||||||
{% assign i = 1 -%}
|
{% assign i = 1 -%}
|
||||||
{%- for item in page.method -%}
|
{%- for item in page.method -%}
|
||||||
<li><input id='{{ prefix }}-{{ i }}' class='method-checkbox' data-number='{{ i }}' type='checkbox'><label for='{{ prefix }}-{{ i }}'>{{ item }}</label></li>
|
<li><label for='{{ prefix }}-{{ i }}'>{{ item }}</label><input id='{{ prefix }}-{{ i }}' class='method-checkbox' data-number='{{ i }}' type='checkbox'></li>
|
||||||
{% assign i = i | plus: 1 -%}
|
{% assign i = i | plus: 1 -%}
|
||||||
{%- endfor %}
|
{%- endfor %}
|
||||||
</ol>
|
</ol>
|
||||||
|
|
|
@ -10,16 +10,21 @@ window.onload = function () {
|
||||||
if (this.checked) {
|
if (this.checked) {
|
||||||
// check everything before this - if you've done step 6, you've done steps 1-5
|
// check everything before this - if you've done step 6, you've done steps 1-5
|
||||||
for (i = num - 1; i > 0; i--) {
|
for (i = num - 1; i > 0; i--) {
|
||||||
dgel(`${prefix}-${i}`).checked = true;
|
cb = dgel(`${prefix}-${i}`);
|
||||||
|
cb.checked = true;
|
||||||
|
cb.parentElement.classList.add("checked");
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
// uncheck everything after this - you can't have done step 8 if you haven't done step 4
|
// uncheck everything after this - you can't have done step 8 if you haven't done step 4
|
||||||
console.log(num + 1);
|
console.log(num + 1);
|
||||||
for (i = num + 1; i <= max; i++) {
|
for (i = num + 1; i <= max; i++) {
|
||||||
console.log(i);
|
cb = dgel(`${prefix}-${i}`);
|
||||||
dgel(`${prefix}-${i}`).checked = false;
|
cb.checked = false;
|
||||||
|
cb.parentElement.classList.remove("checked");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
this.parentElement.classList.toggle("checked");
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
|
@ -114,10 +114,13 @@ a:not(.recipe-listing):hover {
|
||||||
|
|
||||||
ul {
|
ul {
|
||||||
list-style-type: "- ";
|
list-style-type: "- ";
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
ol {
|
||||||
|
padding-left: 30px;
|
||||||
}
|
}
|
||||||
ul, ol {
|
ul, ol {
|
||||||
list-style-position: inside;
|
list-style-position: outside;
|
||||||
padding-left: 10px;
|
|
||||||
}
|
}
|
||||||
li {
|
li {
|
||||||
padding: 1px 0;
|
padding: 1px 0;
|
||||||
|
@ -167,7 +170,11 @@ a.recipe-listing {
|
||||||
border-top: thin black solid;
|
border-top: thin black solid;
|
||||||
}
|
}
|
||||||
|
|
||||||
.method li input[type=checkbox]:checked + label {
|
.method li input[type=checkbox] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.method li.checked {
|
||||||
color: grey;
|
color: grey;
|
||||||
text-decoration: line-through;
|
text-decoration: line-through;
|
||||||
}
|
}
|
||||||
|
@ -239,7 +246,11 @@ footer, .subtle {
|
||||||
li {
|
li {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
input[type="checkbox"], footer {
|
.method li.checked {
|
||||||
|
text-decoration: none;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
footer {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
h1.scrolling {
|
h1.scrolling {
|
||||||
|
|
Loading…
Reference in a new issue