Označení hotových kroků

sass/_lists.scss

@@ -18,5 +18,7 @@ ol {
 			font-size:2em;
 			color:$primary;
 		}
+
+		&.completed { opacity: .4; }
 	}
 }

templates/index.html

@@ -65,5 +65,6 @@
 	</main>
 	{% endblock content %}
 
+	{% block script %}{% endblock script %}
 </body>
 </html>

templates/page.html

@@ -47,3 +47,12 @@
 
 </main>
 {% endblock content %}
+
+{% block script %}
+<script>
+	let list_items = document.querySelectorAll('ol li');
+	for(let i=0; i<list_items.length; i++){
+		list_items[i].addEventListener('click', function(){ this.classList.toggle("completed"); }, false);
+	}
+</script>
+{% endblock script %}