removed (hid) the checkboxes on method steps since they looked bad

This commit is contained in:
Lynne Megido 2020-03-06 05:01:59 +10:00
parent ebcb267739
commit 641fbd7c74
Signed by: lynnesbian
GPG key ID: F0A184B5213D9F90
3 changed files with 24 additions and 8 deletions

View file

@ -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>

View file

@ -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");
} }
}) })
} }

View file

@ -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 {