Improve order list style

1 files 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 {