From b2a05322fda23fe8d1ca4b00dc29395757557873 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Javi=20Mart=C3=ADn?= <javim@elretirao.net>
Date: Thu, 20 May 2021 00:12:57 +0200
Subject: [PATCH] Simplify using current color on borders

Using `currentcolor` is IMHO more expressive, since it shows the
intention of styling the border with the same color as the text.

This is particularly useful for CONSUL installations using custom
styles. Consider the following code:

```
.is-active {
  border: 1px solid $brand;
  color: $brand;
}
```

If we'd like to customize the way active items look, we'd have to
override two colors:

```
.is-active {
  border: 1px solid $brand-secondary;
  color: $brand-secondary;
}
```

Consider the scenario where we use `currentcolor` (which is the default
border color):

```
.is-active {
  border: 1px solid;
  color: $brand;
}
```

Now we only need to override one color to change the styles:

```
.is-active {
  color: $brand-secondary;
}
```
---
 app/assets/stylesheets/admin.scss         | 2 +-
 app/assets/stylesheets/dashboard.scss     | 4 ++--
 app/assets/stylesheets/layout.scss        | 8 ++++----
 app/assets/stylesheets/participation.scss | 8 ++++----
 4 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/app/assets/stylesheets/admin.scss b/app/assets/stylesheets/admin.scss
index 007fa2d41..17a3739d0 100644
--- a/app/assets/stylesheets/admin.scss
+++ b/app/assets/stylesheets/admin.scss
@@ -581,7 +581,7 @@ code {
   background: #fafafa;
   border-bottom-left-radius: rem-calc(6);
   border-bottom-right-radius: rem-calc(6);
-  border-top: 2px solid #000;
+  border-top: 2px solid;
   font-size: $small-font-size;
   padding: $line-height / 2;
 }
diff --git a/app/assets/stylesheets/dashboard.scss b/app/assets/stylesheets/dashboard.scss
index 81cdca0e5..42daef732 100644
--- a/app/assets/stylesheets/dashboard.scss
+++ b/app/assets/stylesheets/dashboard.scss
@@ -340,7 +340,7 @@
 
     &::before {
       background: linear-gradient(to right, rgba(231, 236, 240, 1) 0%, rgba(251, 251, 251, 1) 90%);
-      border-left: 4px solid $brand;
+      border-left: 4px solid;
       content: "";
       height: rem-calc(48);
       left: 0;
@@ -366,7 +366,7 @@
   }
 
   .submenu-active {
-    border-bottom: 2px solid $brand;
+    border-bottom: 2px solid;
 
     .has-tip {
       @include brand-text;
diff --git a/app/assets/stylesheets/layout.scss b/app/assets/stylesheets/layout.scss
index 441358ceb..313d06903 100644
--- a/app/assets/stylesheets/layout.scss
+++ b/app/assets/stylesheets/layout.scss
@@ -101,7 +101,7 @@ a {
 
 .button.hollow {
   @include normal-selection;
-  border: 1px solid $link;
+  border: 1px solid;
   color: $link;
 }
 
@@ -346,7 +346,7 @@ a {
 
       &::after {
         background: $brand;
-        border-bottom: 2px solid $brand;
+        border-bottom: 2px solid;
         bottom: 0;
         content: "";
         left: 0;
@@ -726,7 +726,7 @@ body > header,
 
       @include breakpoint(medium) {
         @include brand-text;
-        border-bottom: 2px solid $brand;
+        border-bottom: 2px solid;
       }
     }
   }
@@ -798,7 +798,7 @@ body > header,
 
   .is-active {
     @include brand-text;
-    border-bottom: 2px solid $brand;
+    border-bottom: 2px solid;
 
     &:hover {
       text-decoration: none;
diff --git a/app/assets/stylesheets/participation.scss b/app/assets/stylesheets/participation.scss
index aba94db5c..167ca4003 100644
--- a/app/assets/stylesheets/participation.scss
+++ b/app/assets/stylesheets/participation.scss
@@ -29,7 +29,7 @@
   .icon-like,
   .icon-unlike {
     background: #fff;
-    border: 2px solid $text-light;
+    border: 2px solid;
     border-radius: rem-calc(3);
     color: $text-light;
     display: inline-block;
@@ -1577,11 +1577,11 @@
   border-bottom: 1px solid #eee;
 
   .column:nth-child(odd) {
-    border-right: 2px solid $text;
+    border-right: 2px solid;
   }
 
   .answer-divider {
-    border-bottom: 2px solid $text;
+    border-bottom: 2px solid;
     border-right: 0 !important;
     margin-bottom: $line-height;
     padding-bottom: $line-height;
@@ -1776,7 +1776,7 @@
   margin: $line-height 0;
 
   span {
-    border-bottom: 1px solid #000;
+    border-bottom: 1px solid;
   }
 }