From bae3e3b59080300ba52a4b50ffe2be8e5f0f7402 Mon Sep 17 00:00:00 2001
From: phillimorland <5871230+phillimorland@users.noreply.github.com>
Date: Tue, 28 Dec 2021 14:52:08 +0100
Subject: [PATCH] assets/buttons: adding better focus behaviour for button
 light //list-item: rm link styling as list items are nolonger links

---
 .../meinberlin_contrib/component_library.html |  7 ++-----
 .../assets/scss/components/_button.scss       | 21 ++++++++++++-------
 .../assets/scss/components/_list_item.scss    | 12 -----------
 3 files changed, 15 insertions(+), 25 deletions(-)

diff --git a/meinberlin/apps/contrib/templates/meinberlin_contrib/component_library.html b/meinberlin/apps/contrib/templates/meinberlin_contrib/component_library.html
index 58ec7fbb93..294cb7b428 100644
--- a/meinberlin/apps/contrib/templates/meinberlin_contrib/component_library.html
+++ b/meinberlin/apps/contrib/templates/meinberlin_contrib/component_library.html
@@ -481,11 +481,6 @@ <h2 id="cl-breadcrumbs">Breadcrumbs</h2>
             <h2 id="cl-buttons">Buttons</h2>
 
             <div class="cl-example">
-                <p>
-                    <button class="btn" type="button">Button</button>
-                    <input class="btn" type="button" value="Input Button" />
-                    <a class="btn" href="#">Link as Button</a>
-                </p>
                 <p>
                     <button class="btn btn--light" type="button">Light Button</button>
                     <button class="btn btn--transparent" type="button">Transparent Button</button>
@@ -503,6 +498,8 @@ <h2 id="cl-buttons">Buttons</h2>
                 <p>
                     <button class="btn btn--link" type="button">Button as Link</button>
                     <button class="btn btn--none" type="button">No Button</button>
+                    <a class="btn btn--link" href="#" type="button">Link as Button</a>
+                    <a class="btn btn--link is-disabled" type="button" href="">Link Button disabled</a>
                 </p>
                 <p>
                     <button class="btn btn--select" type="button">Select Button <i class="fa fa-caret-down" aria-hidden="true"></i></button>
diff --git a/meinberlin/assets/scss/components/_button.scss b/meinberlin/assets/scss/components/_button.scss
index 922bb884bc..7060cea47b 100644
--- a/meinberlin/assets/scss/components/_button.scss
+++ b/meinberlin/assets/scss/components/_button.scss
@@ -68,13 +68,16 @@
     @include button-color($body-bg, $bg-secondary);
 
     &,
-    &:focus,
-    &:hover,
-    &:active,
     &:disabled,
     &.is-disabled {
         border-color: $border-color;
     }
+
+    &:focus,
+    &:hover,
+    &:active {
+        border-color: $idea-remark-color;
+    }
 }
 
 .btn--transparent {
@@ -109,19 +112,21 @@
     background-color: transparent;
 
     color: $link-color;
-    text-decoration: underline;
+    text-decoration: underline !important;
     font-weight: normal;
+    cursor: pointer;
 
     &:hover,
     &:focus {
-        color: $link-hover-color;
+        color: $link-hover-color !important;
         border-color: transparent;
         background-color: transparent;
     }
 
-    &.is-disabled,
-    &:disabled {
-        color: $text-color;
+    &.is-disabled {
+        color: $text-color !important;
+        border-color: transparent;
+        background-color: transparent;
         cursor: not-allowed;
     }
 }
diff --git a/meinberlin/assets/scss/components/_list_item.scss b/meinberlin/assets/scss/components/_list_item.scss
index fac5eb9d7b..a4348c28d5 100644
--- a/meinberlin/assets/scss/components/_list_item.scss
+++ b/meinberlin/assets/scss/components/_list_item.scss
@@ -6,18 +6,6 @@
     background-color: $body-bg;
     margin-bottom: $em-spacer;
     page-break-inside: avoid;
-
-    &.selected {
-        background-color: $bg-secondary;
-    }
-
-    &.selected:focus {
-        outline: none;
-    }
-
-    // &:hover:not(.no-hover) {
-    //     background-color: mix($body-bg, $bg-secondary);
-    // }
 }
 
 .list-item--squashed {