From 4162ad30f7b754fd97aff2ed180483cc6518f567 Mon Sep 17 00:00:00 2001
From: Joris
Date: Sat, 23 Jan 2021 12:12:44 +0100
Subject: Improve order list style

---
 public/main.css | 22 ++++++++++------------
 1 file changed, 10 insertions(+), 12 deletions(-)

diff --git a/public/main.css b/public/main.css
index 20d4683..b3359cf 100644
--- a/public/main.css
+++ b/public/main.css
@@ -72,6 +72,7 @@ ul, ol {
   padding-left: var(--size-dog);
   list-style-type: none;
   margin-bottom: var(--size-horse);
+  margin: var(--size-cat) 0 var(--size-dog);
 }
 
 ol {
@@ -80,29 +81,26 @@ ol {
 }
 
 ol > li, ul > li {
-  margin-bottom: var(--size-dog);
+  padding: var(--size-mouse) 0;
 }
 
 ol > li {
-  padding-left: var(--size-camel);
+  padding-left: var(--size-horse);
   position: relative;
   text-align: justify;
+  transition: color 0.1s ease-in;
 }
 
 ol > li::before {
   display: inline;
   position: absolute;
-  top: 0;
+  top: var(--size-mouse);
   left: 0;
   counter-increment: ol;
-  content: counter(ol);
-  margin-right: var(--size-cat);
-  background-color: var(--color-brown);
-  color: white;
-  border-radius: 50%;
+  content: counter(ol) ".";
+  color: var(--color-brown);
   font-weight: bold;
-  width: var(--size-bear);
-  text-align: center;
+  transition: color 0.1s ease-in;
 }
 
 ol > li:hover {
@@ -110,11 +108,11 @@ ol > li:hover {
 }
 
 ol > li.completed {
-  text-decoration: line-through;
+  color: var(--color-gray);
 }
 
 ol > li.completed::before {
-  background-color: var(--color-green);
+  color: var(--color-green);
 }
 
 input {
-- 
cgit v1.2.3