From d09aa8f0b71db930d9fb7e2d146d793e023d0d5f Mon Sep 17 00:00:00 2001
From: Kazhnuz <kazhnuz@chlore.net>
Date: Mon, 23 Mar 2020 18:03:17 +0100
Subject: [PATCH] improvement(blog): improve styling

---
 src/scss/_drawing.scss            | 51 +++++++++++++++++++++++++++++++
 src/scss/_typography.scss         |  1 +
 src/scss/components/_buttons.scss | 14 ++++++---
 src/scss/components/_cards.scss   | 14 ++++++++-
 4 files changed, 75 insertions(+), 5 deletions(-)

diff --git a/src/scss/_drawing.scss b/src/scss/_drawing.scss
index 8eef321..2094474 100644
--- a/src/scss/_drawing.scss
+++ b/src/scss/_drawing.scss
@@ -10,3 +10,54 @@
 @import 'components/buttons';
 
 @import 'components/previews';
+
+.article-meta, .article-nav {
+  display: flex;
+  justify-content: space-between;
+  padding-bottom: 1.5rem;
+}
+
+.article-category-link {
+    @include button($button_small);
+    padding-left: $button_small;
+    padding-right: $button_small;
+    @include button-color($color-info, $color-button-light);
+      &:hover, &:active {
+          @include borders();
+      }
+
+      p &:last-child {
+          margin-bottom:0;
+      }
+}
+
+a.article-nav-link-wrap {
+  @include button($button_large);
+  padding-left: $button_large;
+  padding-right: $button_large;
+    &:hover, &:active {
+        @include borders();
+    }
+
+    p &:last-child {
+        margin-bottom:0;
+    }
+    @include button-color($color-info, $color-button-light);
+}
+
+.article-more-link {
+  text-align: center;
+  a {
+      @include button($button_large);
+      padding-left: $button_large;
+      padding-right: $button_large;
+        &:hover, &:active {
+            @include borders();
+        }
+
+        p &:last-child {
+            margin-bottom:0;
+        }
+      @include button-fullcontrol(transparent, rgba(0,0,0,0.05), $color-primary);
+  }
+}
diff --git a/src/scss/_typography.scss b/src/scss/_typography.scss
index bd9fb22..13f4a6f 100644
--- a/src/scss/_typography.scss
+++ b/src/scss/_typography.scss
@@ -55,6 +55,7 @@ p {
 
 ul, ol {
   @include paragraph();
+  list-style: disc;
   ul, ol {
     padding-bottom:0;
     margin:0;
diff --git a/src/scss/components/_buttons.scss b/src/scss/components/_buttons.scss
index 93edd0a..6435356 100644
--- a/src/scss/components/_buttons.scss
+++ b/src/scss/components/_buttons.scss
@@ -11,6 +11,11 @@ $button_large: $lineheight;
 $button_small: $lineheight_quarter;
 
 @mixin button($size) {
+  @include button-nobiseau($size);
+  @include biseau($size);
+}
+
+@mixin button-nobiseau($size) {
     padding: $size;
     padding-top: $size/3;
     padding-bottom: $size/3;
@@ -31,8 +36,6 @@ $button_small: $lineheight_quarter;
         background-color:transparent;
     }
 
-    @include biseau($size);
-
     &:focus {
         outline: none;
 	    box-shadow: $narrow-shadow, $inset-shadow, 0px 0px 0px 2px rgba(0, 0, 0, 0);
@@ -53,7 +56,10 @@ $button_small: $lineheight_quarter;
 
 @mixin button-fullcontrol($background-color, $hover-color, $text-color) {
     @include colorize-button($background-color, $text-color);
-    &, &:not(.disabled):not(:disabled) {
+    &:visited {
+      @include colorize-button($background-color, $text-color);
+    }
+    &, &:visited, &:not(.disabled):not(:disabled) {
         &:hover, &:active, &:focus, a:hover > &, a:active > &, a:focus > & {
         @include colorize-button($hover-color, lighten($text-color, 5%));
         }
@@ -91,7 +97,7 @@ $button_small: $lineheight_quarter;
 // NAVBAR SPECIAL BUTTONS
 
 .navbar .btn-link {
-    @include button-fullcontrol(transparent, rgba(0,0,0,0.2), $color-light)
+    @include button-fullcontrol(transparent, rgba(0,0,0,0.2), $color-light);
 }
 
 .btn-readmore {
diff --git a/src/scss/components/_cards.scss b/src/scss/components/_cards.scss
index 4d80583..db5c892 100644
--- a/src/scss/components/_cards.scss
+++ b/src/scss/components/_cards.scss
@@ -73,7 +73,19 @@ $card-smallpad: $lineheight_half;
     &-menu  {
         display:flex;
         flex-direction: column;
-        .menu-element, .menu-element-link {
+
+        ul {
+          margin:0;
+          padding:0;
+        }
+
+        li {
+          list-style: none;
+          padding:0;
+          margin:0;
+        }
+
+        .menu-element, .menu-element-link, li a {
             display:flex;
             line-height:$lineheight;
             padding-right:$lineheight_half;