Update less rules

Author: bhasher

src/publics/css/base.less

@@ -2,8 +2,6 @@
 |      Generic      |
 \*******************/
 
-@bg-color: #222;
-
 *{
     margin: 0;
     padding: 0;
@@ -21,7 +19,7 @@
 }
 
 body{
-    background-color: @bg-color;
+    background-color: #222222;
     color: white;
     font-family: sans-serif;
     height:100vh;
@@ -47,13 +45,13 @@ body{
     border: 1px solid royalblue;
     size: 8px;
     text-align: center;
-}
 
-.alertCard h3{
-    display: block;
-    text-align: center;
-    text-transform: uppercase;
-    margin-bottom: 5px;
+    h3{
+        display: block;
+        text-align: center;
+        text-transform: uppercase;
+        margin-bottom: 5px;
+    }
 }
 
 /******************\
@@ -70,19 +68,19 @@ header{
     width: 100vw;
     box-sizing: border-box;
     z-index: 200;
-}
 
-header h1{
-    float: left;
-}
+    h1{
+        float: left;
+    }
 
-header .title-1{
-    font-size: 40px;
-}
+    .title-1{
+        font-size: 40px;
+    }
 
-header a{
-    color: inherit;
-    text-decoration: inherit;
+    a{
+        color: inherit;
+        text-decoration: inherit;
+    }
 }
 
 /*******************\
@@ -98,49 +96,49 @@ div#welcome{
     background-color: rgba(10, 10, 10, 0.5);
     display: none;
     z-index: 4;
-}
-
-div#welcome div#welcome-text{
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    min-width: 350px;
-    max-width: 500px;
-    -webkit-transform: translate(-50%, -50%);
-    transform: translate(-50%, -50%);
-    color: #111111;
-    background-color: #d5e6ed;
-    margin: 0 auto;
-    padding: 1em;
-    border-radius: 20px;
-    border: 1px solid forestgreen;
-    box-shadow: forestgreen 0 0 10px;
-}
-
-div#welcome .welcome-content{
-    text-align: justify;
-    padding: 10px 0;
-    letter-spacing: 0.9px;
-    line-height: 25px;
-}
 
-div#welcome .welcome-enjoy{
-    float: left;
-}
-
-div#welcome button{
-    float: right;
-    width: 150px;
-    height: 45px;
-    background-color: forestgreen;
-    border: none;
-    border-radius: 10px;
-    letter-spacing: 2px;
-    color: white;
-}
-
-div#welcome button:hover{
-    cursor: pointer;
+    div#welcome-text{
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        min-width: 350px;
+        max-width: 500px;
+        -webkit-transform: translate(-50%, -50%);
+        transform: translate(-50%, -50%);
+        color: #111111;
+        background-color: #d5e6ed;
+        margin: 0 auto;
+        padding: 1em;
+        border-radius: 20px;
+        border: 1px solid forestgreen;
+        box-shadow: forestgreen 0 0 10px;
+    }
+
+    .welcome-content{
+        text-align: justify;
+        padding: 10px 0;
+        letter-spacing: 0.9px;
+        line-height: 25px;
+    }
+
+    .welcome-enjoy{
+        float: left;
+    }
+
+    button{
+        float: right;
+        width: 150px;
+        height: 45px;
+        background-color: forestgreen;
+        border: none;
+        border-radius: 10px;
+        letter-spacing: 2px;
+        color: white;
+    }
+
+    button:hover{
+        cursor: pointer;
+    }
 }
 
 .blur-background > *:not(#body):not(#welcome) {
@@ -172,27 +170,27 @@ div#welcome button:hover{
     padding: 15px 0 5px 0;
     border-top: 1px solid rgb(53, 58, 60);
     text-align: center;
-}
-
-#footer #links{
-    margin-bottom: 20px;
-}
-
-#footer #links a{
-    margin: 0 25px;
-    font-size: 12px;
-    color: lightgray;
-    text-decoration: none;
-}
-
-#footer #links a[href="#"]{
-    color: #555;
-    text-decoration: line-through;
-    font-style: italic;
-}
 
-#footer #links #link-welcome[id]{
-    color: lightgray;
-    text-decoration: none;
-    font-style: normal;
+    #links{
+        margin-bottom: 20px;
+
+        a{
+            margin: 0 25px;
+            font-size: 12px;
+            color: lightgray;
+            text-decoration: none;
+        }
+
+        a[href="#"]{
+            color: #555;
+            text-decoration: line-through;
+            font-style: italic;
+        }
+
+        #link-welcome[id]{
+            color: lightgray;
+            text-decoration: none;
+            font-style: normal;
+        }
+    }
 }

src/publics/css/editor.less

@@ -1,38 +1,50 @@
-header #actions{
-    float: right;
-    padding: 5px 20px;
-}
+/******************\
+|      Header      |
+\******************/
+
+header{
+    #actions{
+        float: right;
+        padding: 5px 20px;
+    }
 
-header #download{
-    display: inline-block;
-    background-color: #333333;
-    color: white;
-    padding: 10px;
-    border-radius: 5px;
-    text-decoration: none;
+    header #download{
+        display: inline-block;
+        background-color: #333333;
+        color: white;
+        padding: 10px;
+        border-radius: 5px;
+        text-decoration: none;
+    }
 }
 
+/*******************\
+|      Section      |
+\*******************/
+
 section#editor{
     counter-reset: thecodenumbering;
     line-height: 22px;
-}
 
-section#editor div{
-    font-family: "Courier New", monospace;
-    counter-increment: thecodenumbering;
-    width: 100%;
-    white-space: pre-wrap;
-}
-section#editor div:before{
-    padding-right:10px;
-    content: counter(thecodenumbering);
-    display:inline-block;
-    width:3em;
-    text-align: center;
-}
+    div{
+        font-family: "Courier New", monospace;
+        counter-increment: thecodenumbering;
+        width: 100%;
+        white-space: pre-wrap;
+    }
 
-section#colorful{
-    font-weight: normal !important;
+    div:before{
+        padding-right:10px;
+        content: counter(thecodenumbering);
+        display:inline-block;
+        width:3em;
+        text-align: center;
+    }
+
+    .noteditable{
+        background-color: #181818;
+        opacity: 50%;
+    }
 }
 
 .pointer{
@@ -45,8 +57,3 @@ section#colorful{
     background-color: red;
     border-radius: 10px;
 }
-
-.noteditable{
-    background-color: #181818;
-    opacity: 50%;
-}