From 090b42ff1b33d57d963b0b4817fc4213169d9853 Mon Sep 17 00:00:00 2001
From: Kazhnuz <kazhnuz@kobold.cafe>
Date: Sat, 24 Jul 2021 16:59:42 +0200
Subject: [PATCH] chore: sync du scss

---
 src/scss/_drawing.scss             | 66 +++++++++++-------------------
 src/scss/_global.scss              | 10 ++++-
 src/scss/_palette.scss             | 13 ------
 src/scss/_typography.scss          | 59 +++++++++-----------------
 src/scss/components/_buttons.scss  | 24 +++++------
 src/scss/components/_cards.scss    | 25 +++++++----
 src/scss/components/_previews.scss | 25 ++++++-----
 src/scss/style.scss                | 24 ++++++-----
 8 files changed, 107 insertions(+), 139 deletions(-)

diff --git a/src/scss/_drawing.scss b/src/scss/_drawing.scss
index 0757664..c20c63f 100644
--- a/src/scss/_drawing.scss
+++ b/src/scss/_drawing.scss
@@ -11,24 +11,9 @@
 
 @import 'components/previews';
 
-.article-meta, .article-nav {
+.flex-that {
   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;
-      }
 }
 
 strong.btn-fake {
@@ -50,37 +35,22 @@ a.article-nav-link-wrap {
     @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);
-  }
-}
-
-.btn-navbar {
-    @include button($button_large);
-    padding-left: $button_small;
-    padding-right: $button_small;
-    @include button-fullcontrol(transparent, rgba(0,0,0,0.1), $color-light);
-}
-
 .pigimg, .mb {
   padding-bottom:1.5rem;
 }
 
-#page-nav {
+.screen-reader-text {
+  visibility: collapse;
+  font-size:0;
+}
+
+nav.pagination {
   padding-bottom:1.5rem;
-  .page-number, .next, .prev {
+  .nav-links {
+    text-align: center;
+    width:100%;
+  }
+  .page-numbers, .next, .prev {
       @include button($button_small);
       padding-left: $button_small;
       padding-right: $button_small;
@@ -95,3 +65,15 @@ a.article-nav-link-wrap {
 .card-select {
   width:100%;
 }
+
+.input-group {
+  padding-bottom:1.5rem;
+
+  input, textarea {
+    width:100%;
+    background-color:$color-light;
+    border-radius:0px;
+    border: 1px solid rgba(0,0,0,0.2);
+    padding:0.375rem;
+  }
+}
diff --git a/src/scss/_global.scss b/src/scss/_global.scss
index 839d7e5..b92863d 100644
--- a/src/scss/_global.scss
+++ b/src/scss/_global.scss
@@ -31,7 +31,7 @@
   /* ------------------ HEADERS ------------------- */
 
 #page-header {
-    background: $color-turquoise url('img/background.png') center bottom repeat-x;
+    background: $color-skyblue url('img/background.png') center bottom repeat-x;
     border-top: 6px solid $color-dark2;
     padding-bottom:3rem;
 
@@ -230,6 +230,12 @@ footer {
         grid-template-columns: 1fr 1fr 1fr;
       }
 
+      a, a:visited {
+        &:hover, &:active, &:visited {
+          color: $color-light;
+        }
+      }
+
     }
 }
 
@@ -244,7 +250,7 @@ ul.social {
         margin:0;
         list-style: none;
         display: inline;
-        a {
+        a, a:visited {
             color: $color-footer-back;
             background-color: $color-footer-text;
             padding:0.3em;
diff --git a/src/scss/_palette.scss b/src/scss/_palette.scss
index 6b7521e..98a87fe 100644
--- a/src/scss/_palette.scss
+++ b/src/scss/_palette.scss
@@ -13,16 +13,13 @@
 
 $color-blue: #268bd2;
 $color-violet: #d33682;
-$color-purple: #6c71c4;
 $color-red: #dc322f;
 $color-orange: #cb4b16;
 $color-green: #859900;
 $color-skyblue: #2aa198;
 $color-dark: #002b36;
 $color-light: #fdf6e3;
-$color-turquoise: #2aa198;
 $color-yellow: #b58900;
-$color-brown: #b58900;
 $color-grey: #586e75;
 
 $color-dark2: #073642;
@@ -56,10 +53,6 @@ $color-success: $color-green;
 
 // Colorize important elements
 
-a, a:hover, a:active {
-    color: $color-link;
-}
-
 ::selection {
     @include background-color($color-selection, $color-light);
 }
@@ -82,16 +75,13 @@ blockquote, pre {
 .bg {
     &-blue { @include background-color($color-blue, $color-light); }
     &-violet { @include background-color($color-violet, $color-light); }
-    &-purple { @include background-color($color-purple, $color-light); }
     &-red { @include background-color($color-red, $color-light); }
     &-orange { @include background-color($color-orange, $color-light); }
     &-green { @include background-color($color-green, $color-light); }
     &-skyblue { @include background-color($color-skyblue, $color-light); }
     &-dark { @include background-color($color-dark, $color-light); }
     &-light { @include background-color($color-light, $color-dark); }
-    &-turquoise { @include background-color($color-turquoise, $color-light); }
     &-yellow { @include background-color($color-yellow, $color-light); }
-    &-brown { @include background-color($color-brown, $color-light); }
     &-grey { @include background-color($color-grey, $color-light); }
 
     &-primary { @include background-color($color-primary, $color-light); }
@@ -107,16 +97,13 @@ blockquote, pre {
 .text {
     &-blue { @include text-color($color-blue); }
     &-violet { @include text-color($color-violet); }
-    &-purple { @include text-color($color-purple); }
     &-red { @include text-color($color-red); }
     &-orange { @include text-color($color-orange); }
     &-green { @include text-color($color-green); }
     &-skyblue { @include text-color($color-skyblue); }
     &-dark { @include text-color($color-dark); }
     &-light { @include text-color($color-light); }
-    &-turquoise { @include text-color($color-turquoise); }
     &-yellow { @include text-color($color-yellow); }
-    &-brown { @include text-color($color-brown); }
     &-grey { @include text-color($color-grey); }
 
     &-primary { @include text-color($color-primary); }
diff --git a/src/scss/_typography.scss b/src/scss/_typography.scss
index dc68d56..1d0e4da 100644
--- a/src/scss/_typography.scss
+++ b/src/scss/_typography.scss
@@ -38,11 +38,19 @@ em {
   font-weight: $fontweight_base;
 }
 
-a {
-  color: $color-link;
+
+a, a:visited {
+  color: $color-light;
+  background-color: $color-link;
   text-decoration:none;
-  &:hover, &:active {
+  padding:0.05rem;
+  padding-left:0.25rem;
+  padding-right:0.25rem;
+  border-radius:0.1rem;
+  &:hover, &:active, &:focus {
     color: $color-link;
+    background-color: transparent;
+    text-decoration:none;
   }
 }
 
@@ -72,6 +80,12 @@ ul, ol {
 
 /* 2.2 - Text Wrapper */
 
+.container-article, .container-typographic {
+  max-width: 800px;
+  margin:auto;
+  margin-bottom: 3rem;
+}
+
 .container-typographic {
   p {
     padding:0;
@@ -238,14 +252,11 @@ code {
   color: $color-red;
 }
 
-.container-typographic {
-  max-width: 800px;
-  margin:auto;
-  margin-bottom: 3rem;
+.small-text {
+  font-size: 0.9em;
 }
 
 
-
 /* 2.6 - Special styling */
 
 mark {
@@ -267,35 +278,6 @@ mark {
 	display: block;
 }
 
-/* 2.6.1 - Colored texts */
-
-@mixin text-color($text-color) {
-  color: $text-color;
-}
-
-.text {
-  &-blue { @include text-color($color-blue); }
-  &-violet { @include text-color($color-violet); }
-  &-purple { @include text-color($color-purple); }
-  &-red { @include text-color($color-red); }
-  &-orange { @include text-color($color-orange); }
-  &-green { @include text-color($color-green); }
-  &-skyblue { @include text-color($color-skyblue); }
-  &-dark { @include text-color($color-dark); }
-  &-light { @include text-color($color-light); }
-  &-turquoise { @include text-color($color-turquoise); }
-  &-yellow { @include text-color($color-yellow); }
-  &-brown { @include text-color($color-brown); }
-  &-grey { @include text-color($color-grey); }
-
-  &-primary { @include text-color($color-primary); }
-  &-secondary { @include text-color($color-secondary); }
-  &-warning { @include text-color($color-warning); }
-  &-danger { @include text-color($color-danger); }
-  &-info { @include text-color($color-info); }
-  &-success { @include text-color($color-success); }
-}
-
 /* Table elements */
 
 @mixin table-color($text-color) {
@@ -327,16 +309,13 @@ th  {
 .table {
   &-blue { @include table-color($color-blue); }
   &-violet { @include table-color($color-violet); }
-  &-purple { @include table-color($color-purple); }
   &-red { @include table-color($color-red); }
   &-orange { @include table-color($color-orange); }
   &-green { @include table-color($color-green); }
   &-skyblue { @include table-color($color-skyblue); }
   &-dark { @include table-color($color-dark); }
   &-light { @include table-color($color-light); }
-  &-turquoise { @include table-color($color-turquoise); }
   &-yellow { @include table-color($color-yellow); }
-  &-brown { @include table-color($color-brown); }
   &-grey { @include table-color($color-grey); }
 
   &-primary { @include table-color($color-primary); }
diff --git a/src/scss/components/_buttons.scss b/src/scss/components/_buttons.scss
index 6435356..c6529cc 100644
--- a/src/scss/components/_buttons.scss
+++ b/src/scss/components/_buttons.scss
@@ -81,11 +81,11 @@ $button_small: $lineheight_quarter;
     }
 }
 
-.label, label.label, a.label, .chip, a.chip {
-    @include biseau($button_small);
-    padding-left: $button_small;
-    padding-right: $button_small;
-    text-decoration:none;
+.btn-small {
+  @include button($button_small);
+  padding-left: $button_small;
+  padding-right: $button_small;
+  text-decoration:none;
 }
 
 .menu-label {
@@ -96,12 +96,14 @@ $button_small: $lineheight_quarter;
 
 // NAVBAR SPECIAL BUTTONS
 
-.navbar .btn-link {
-    @include button-fullcontrol(transparent, rgba(0,0,0,0.2), $color-light);
+.btn-navbar {
+    @include button-fullcontrol(transparent, rgba(0,0,0,0.1), $color-light);
+    padding-left: $button_small;
+    padding-right: $button_small;
 }
 
 .btn-readmore {
-    @include button-fullcontrol(transparent, rgba(0,0,0,0.2), $color-primary);
+    @include button-fullcontrol(transparent, rgba(0,0,0,0.05), $color-primary);
 }
 
 // BUTTONS GROUPS
@@ -137,7 +139,7 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
         display:none;
     }
 
-    a, span {
+    a, & > span {
         display:inline-block;
         @include button($button-large);
         @include button-fullcontrol($color-light2, darken($color-light2, 5%), $color-dark2);
@@ -161,16 +163,13 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
 .btn, a.btn, .badge, .chip, a.chip, a.badge, .label, a.label, label.label {
     &-blue { @include button-color($color-blue, $color-button-light); }
     &-violet { @include button-color($color-violet, $color-button-light); }
-    &-purple { @include button-color($color-purple, $color-button-light); }
     &-red { @include button-color($color-red, $color-button-light); }
     &-orange { @include button-color($color-orange, $color-button-light); }
     &-green { @include button-color($color-green, $color-button-light); }
     &-skyblue { @include button-color($color-skyblue, $color-button-light); }
     &-dark { @include button-color($color-dark, $color-button-light); }
     &-light { @include button-color($color-light2, $color-button-dark); }
-    &-turquoise { @include button-color($color-turquoise, $color-button-light); }
     &-yellow { @include button-color($color-yellow, $color-button-light); }
-    &-brown { @include button-color($color-brown, $color-button-light); }
     &-grey { @include button-color($color-grey, $color-button-light); }
 
     &-primary { @include button-color($color-primary, $color-button-light); }
@@ -186,6 +185,7 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
 
 .share-buttons {
     margin-top: $lineheight;
+    padding-bottom: $lineheight;
   }
 
   .reagir {
diff --git a/src/scss/components/_cards.scss b/src/scss/components/_cards.scss
index c88477a..253352c 100644
--- a/src/scss/components/_cards.scss
+++ b/src/scss/components/_cards.scss
@@ -28,6 +28,7 @@ $card-smallpad: $lineheight_half;
     padding-bottom: $size/2!important;
     margin-bottom:$lineheight_half;
     line-height:$lineheight;
+    white-space: nowrap;
 
     position:relative;
     left: -$size*1.25;
@@ -88,7 +89,7 @@ $card-smallpad: $lineheight_half;
           margin:0;
         }
 
-        .menu-element, .menu-element-link, li a {
+        .menu-element, .menu-element-link, li a, li a:visited {
             display:flex;
             line-height:$lineheight;
             padding-right:$lineheight_half;
@@ -119,7 +120,7 @@ $card-smallpad: $lineheight_half;
             }
         }
 
-        a {
+        a, a:visited {
             text-decoration:none;
             color: $color-violet;
             background-color:transparent;
@@ -169,7 +170,7 @@ $card-smallpad: $lineheight_half;
     }
 }
 
-ul.card-list {
+ul.card-list, .card > ul {
     padding:0;
     margin:0;
     li.list-element {
@@ -202,16 +203,13 @@ ul.card-list {
 .card, .smallcard, .menu {
     &-blue { @include card-color($color-blue, $color-light); }
     &-violet { @include card-color($color-violet, $color-light); }
-    &-purple { @include card-color($color-purple, $color-light); }
     &-red { @include card-color($color-red, $color-light); }
     &-orange { @include card-color($color-orange, $color-light); }
     &-green { @include card-color($color-green, $color-light); }
     &-skyblue { @include card-color($color-skyblue, $color-light); }
     &-dark { @include card-color($color-dark, $color-light); }
     &-light { @include card-color($color-light2, $color-dark); }
-    &-turquoise { @include card-color($color-turquoise, $color-light); }
     &-yellow { @include card-color($color-yellow, $color-light); }
-    &-brown { @include card-color($color-brown, $color-light); }
     &-grey { @include card-color($color-grey, $color-light); }
 
     &-primary { @include card-color($color-primary, $color-light); }
@@ -225,16 +223,13 @@ ul.card-list {
 .toast {
     &-blue { @include background-color($color-blue, $color-light); }
     &-violet { @include background-color($color-violet, $color-light); }
-    &-purple { @include background-color($color-purple, $color-light); }
     &-red { @include background-color($color-red, $color-light); }
     &-orange { @include background-color($color-orange, $color-light); }
     &-green { @include background-color($color-green, $color-light); }
     &-skyblue { @include background-color($color-skyblue, $color-light); }
     &-dark { @include background-color($color-dark, $color-light); }
     &-light { @include background-color($color-light2, $color-dark); }
-    &-turquoise { @include background-color($color-turquoise, $color-light); }
     &-yellow { @include background-color($color-yellow, $color-light); }
-    &-brown { @include background-color($color-brown, $color-light); }
     &-grey { @include background-color($color-grey, $color-light); }
 
     &-primary { @include background-color($color-primary, $color-light); }
@@ -243,4 +238,16 @@ ul.card-list {
     &-danger { @include background-color($color-danger, $color-light); }
     &-info { @include background-color($color-info, $color-light); }
     &-success { @include background-color($color-success, $color-light); }
+
+    a, a:visited {
+      color: $color-light;
+      background-color:rgba(0,0,0,0.15);
+      text-decoration:none;
+      opacity:1;
+      &:hover, &:active, &:visited {
+        color: $color-light;
+        background-color:transparent;
+        opacity:1;
+      }
+    }
   }
diff --git a/src/scss/components/_previews.scss b/src/scss/components/_previews.scss
index 7d2c7d9..1ec760f 100644
--- a/src/scss/components/_previews.scss
+++ b/src/scss/components/_previews.scss
@@ -50,8 +50,9 @@ $preview-height: 8*$lineheight;
   box-shadow: $large-shadow, $inset-shadow;
 }
 
-.preview-link:hover {
-  text-decoration:none!important;
+.preview-link {
+  padding:0;
+  background-color: transparent;
 }
 
 .preview-item {
@@ -156,6 +157,7 @@ $preview-height: 8*$lineheight;
     justify-content:space-between;
     padding-left: $lineheight/2;
     padding-right: $lineheight/2;
+    font-size:0.9em;
   }
 }
 
@@ -190,7 +192,7 @@ $preview-height: 8*$lineheight;
 .author-area {
   display:flex;
 
-  img.author-avatar {
+  img.author-avatar, img.avatar {
     display:block;
     height: 4.5rem;
     width:auto;
@@ -224,15 +226,18 @@ $preview-height: 8*$lineheight;
   margin:auto;
 }
 
-.mwarea {
-  padding-bottom: $lineheight;
+.avatar {
+  background: transparent;
 }
 
-.mwaimg {
-  width:100%;
-  height:auto;
-  display:block;
-  margin:auto;
+.mwarea {
+  padding-bottom: $lineheight;
+  .avatar {
+    width:80%;
+    height:auto;
+    display:block;
+    margin:auto;
+  }
 }
 
 .cover {
diff --git a/src/scss/style.scss b/src/scss/style.scss
index a33570e..e19a142 100644
--- a/src/scss/style.scss
+++ b/src/scss/style.scss
@@ -1,16 +1,18 @@
-/* -------------------------------------------------
-    KAZHNUZ SPACE SCSS
+/*
+  Theme Name: Kazhnuz Space
+  Theme URI: https://git.kobold.cafe/kazhnuz/kspace-wordpress-theme
+  Author: Kazhnuz
+  Author URI: https://kazhnuz.space
+  Description: The default theme for Kazhnuz.space, my personnal blog. Made using spectre.css
+  Version: 0.1
+  License: GNU General Public License v3 or later
+  License URI: http://www.gnu.org/licenses/gpl-2.0.html
+  Tags: blog, two-columns, right-sidebar, artist, solarized
+  Text Domain: kspace-wordpress-theme
 
-    Auteur : Kazhnuz
-    Licence : Creative Common BY-SA
+  This theme is licensed under the GPLv3.
+*/
 
-    Version 0.1
-
-    Thème CSS basé sur Spectre et ForkAwesome
-    créé pour mon blog creatif kazhnuz.space
-
-    CC BY-SA Kazhnuz
-------------------------------------------------- */
 
 @import 'angled-edges';