From 5ec2ac00218170519a7f2dd259e244470c75d3c5 Mon Sep 17 00:00:00 2001
From: Kazhnuz <kazhnuz@kobold.cafe>
Date: Wed, 27 Jan 2021 10:51:34 +0100
Subject: [PATCH] feat: nouveau style pour les liens

---
 scss/_palette.scss          |  4 ----
 scss/_typography.scss       | 14 ++++++++---
 scss/components/_cards.scss | 16 +++++++++++--
 style.css                   | 48 ++++++++++++++++++++++++-------------
 4 files changed, 56 insertions(+), 26 deletions(-)

diff --git a/scss/_palette.scss b/scss/_palette.scss
index d64e403..98a87fe 100644
--- a/scss/_palette.scss
+++ b/scss/_palette.scss
@@ -53,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);
 }
diff --git a/scss/_typography.scss b/scss/_typography.scss
index 16a9180..2e20cf3 100644
--- a/scss/_typography.scss
+++ b/scss/_typography.scss
@@ -38,11 +38,19 @@ em {
   font-weight: $fontweight_base;
 }
 
-a {
-  color: $color-link;
+
+a:not(.preview-link), a:visited:not(.preview-link) {
+  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;
   }
 }
 
diff --git a/scss/components/_cards.scss b/scss/components/_cards.scss
index e37056b..253352c 100644
--- a/scss/components/_cards.scss
+++ b/scss/components/_cards.scss
@@ -89,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;
@@ -120,7 +120,7 @@ $card-smallpad: $lineheight_half;
             }
         }
 
-        a {
+        a, a:visited {
             text-decoration:none;
             color: $color-violet;
             background-color:transparent;
@@ -238,4 +238,16 @@ ul.card-list, .card > ul {
     &-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/style.css b/style.css
index 0046edd..b55ddcc 100644
--- a/style.css
+++ b/style.css
@@ -22,9 +22,6 @@
  * également celles spécifiques pour certains sujets (liens, texte)
  *
  */
-a, a:hover, a:active {
-  color: #2aa198; }
-
 ::selection {
   background-color: #2aa198 !important;
   color: #fdf6e3; }
@@ -309,11 +306,18 @@ em {
   font-style: italic;
   font-weight: 400; }
 
-a {
-  color: #2aa198;
-  text-decoration: none; }
-  a:hover, a:active {
-    color: #2aa198; }
+a:not(.preview-link), a:visited:not(.preview-link) {
+  color: #fdf6e3;
+  background-color: #2aa198;
+  text-decoration: none;
+  padding: 0.05rem;
+  padding-left: 0.25rem;
+  padding-right: 0.25rem;
+  border-radius: 0.1rem; }
+  a:not(.preview-link):hover, a:not(.preview-link):active, a:not(.preview-link):focus, a:visited:not(.preview-link):hover, a:visited:not(.preview-link):active, a:visited:not(.preview-link):focus {
+    color: #2aa198;
+    background-color: transparent;
+    text-decoration: none; }
 
 p {
   padding: 0;
@@ -876,7 +880,7 @@ ul.social {
       list-style: none;
       padding: 0;
       margin: 0; }
-    .card-menu .menu-element, .card-menu .menu-element-link, .card-menu li a, .menu-menu .menu-element, .menu-menu .menu-element-link, .menu-menu li a {
+    .card-menu .menu-element, .card-menu .menu-element-link, .card-menu li a, .card-menu li a:visited, .menu-menu .menu-element, .menu-menu .menu-element-link, .menu-menu li a, .menu-menu li a:visited {
       display: flex;
       line-height: 1.5rem;
       padding-right: 0.75rem;
@@ -892,7 +896,7 @@ ul.social {
       position: relative;
       z-index: 1;
       overflow: visible; }
-      .card-menu .menu-element:before, .card-menu .menu-element-link:before, .card-menu li a:before, .menu-menu .menu-element:before, .menu-menu .menu-element-link:before, .menu-menu li a:before {
+      .card-menu .menu-element:before, .card-menu .menu-element-link:before, .card-menu li a:before, .card-menu li a:visited:before, .menu-menu .menu-element:before, .menu-menu .menu-element-link:before, .menu-menu li a:before, .menu-menu li a:visited:before {
         content: " ";
         position: absolute;
         top: 0;
@@ -902,24 +906,24 @@ ul.social {
         z-index: -1;
         transform: skewX(-15deg);
         transition: background-color 0.3s; }
-      .card-menu .menu-element strong, .card-menu .menu-element-link strong, .card-menu li a strong, .menu-menu .menu-element strong, .menu-menu .menu-element-link strong, .menu-menu li a strong {
+      .card-menu .menu-element strong, .card-menu .menu-element-link strong, .card-menu li a strong, .card-menu li a:visited strong, .menu-menu .menu-element strong, .menu-menu .menu-element-link strong, .menu-menu li a strong, .menu-menu li a:visited strong {
         font-weight: 900;
         color: #002b36 !important; }
-      .card-menu .menu-element.noflex, .card-menu .menu-element-link.noflex, .card-menu li a.noflex, .menu-menu .menu-element.noflex, .menu-menu .menu-element-link.noflex, .menu-menu li a.noflex {
+      .card-menu .menu-element.noflex, .card-menu .menu-element-link.noflex, .card-menu li a.noflex, .card-menu li a.noflex:visited, .menu-menu .menu-element.noflex, .menu-menu .menu-element-link.noflex, .menu-menu li a.noflex, .menu-menu li a.noflex:visited {
         justify-content: flex-start; }
-        .card-menu .menu-element.noflex :first-child, .card-menu .menu-element-link.noflex :first-child, .card-menu li a.noflex :first-child, .menu-menu .menu-element.noflex :first-child, .menu-menu .menu-element-link.noflex :first-child, .menu-menu li a.noflex :first-child {
+        .card-menu .menu-element.noflex :first-child, .card-menu .menu-element-link.noflex :first-child, .card-menu li a.noflex :first-child, .card-menu li a.noflex:visited :first-child, .menu-menu .menu-element.noflex :first-child, .menu-menu .menu-element-link.noflex :first-child, .menu-menu li a.noflex :first-child, .menu-menu li a.noflex:visited :first-child {
           min-width: 2rem; }
-    .card-menu a, .menu-menu a {
+    .card-menu a, .card-menu a:visited, .menu-menu a, .menu-menu a:visited {
       text-decoration: none;
       color: #d33682;
       background-color: transparent; }
-      .card-menu a:hover, .menu-menu a:hover {
+      .card-menu a:hover, .card-menu a:visited:hover, .menu-menu a:hover, .menu-menu a:visited:hover {
         text-decoration: none;
         color: #d33682;
         position: relative;
         z-index: 1;
         overflow: visible; }
-        .card-menu a:hover:before, .menu-menu a:hover:before {
+        .card-menu a:hover:before, .card-menu a:visited:hover:before, .menu-menu a:hover:before, .menu-menu a:visited:hover:before {
           content: " ";
           position: absolute;
           top: 0;
@@ -929,7 +933,7 @@ ul.social {
           z-index: -1;
           transform: skewX(-15deg);
           transition: background-color 0.3s; }
-        .card-menu a:hover:before, .menu-menu a:hover:before {
+        .card-menu a:hover:before, .card-menu a:visited:hover:before, .menu-menu a:hover:before, .menu-menu a:visited:hover:before {
           background-color: #e3d9ba; }
     .card-menu .menu-divider, .menu-menu .menu-divider {
       position: relative;
@@ -1191,6 +1195,16 @@ ul.card-list, .card > ul {
   background-color: #859900 !important;
   color: #fdf6e3; }
 
+.toast a, .toast a:visited {
+  color: #fdf6e3;
+  background-color: rgba(0, 0, 0, 0.15);
+  text-decoration: none;
+  opacity: 1; }
+  .toast a:hover, .toast a:active, .toast a:visited, .toast a:visited:hover, .toast a:visited:active, .toast a:visited:visited {
+    color: #fdf6e3;
+    background-color: transparent;
+    opacity: 1; }
+
 /*
  * 3. Buttons and labels
  * All clickable elements