From a80583a9d24d0ecd08d91dbfcb5198f7becca02c Mon Sep 17 00:00:00 2001
From: Eric Eastwood <contact@ericeastwood.com>
Date: Tue, 18 Jul 2017 09:58:12 -0500
Subject: Update avatar border to be opaque for better stacking

Fix https://gitlab.com/gitlab-org/gitlab-ce/issues/32561
---
 app/assets/stylesheets/framework/avatar.scss    | 4 ++--
 app/assets/stylesheets/framework/variables.scss | 2 +-
 app/assets/stylesheets/pages/issuable.scss      | 6 +-----
 3 files changed, 4 insertions(+), 8 deletions(-)

(limited to 'app')

diff --git a/app/assets/stylesheets/framework/avatar.scss b/app/assets/stylesheets/framework/avatar.scss
index 4ae2b164d2e..06f7af33f94 100644
--- a/app/assets/stylesheets/framework/avatar.scss
+++ b/app/assets/stylesheets/framework/avatar.scss
@@ -60,7 +60,7 @@
   }
 
   &:not([href]):hover {
-    border-color: rgba($avatar-border, .2);
+    border-color: darken($avatar-border, 10%);
   }
 }
 
@@ -99,7 +99,7 @@
 .avatar-counter {
   background-color: $gray-darkest;
   color: $white-light;
-  border: 1px solid $border-color;
+  border: 1px solid $avatar-border;
   border-radius: 1em;
   font-family: $regular_font;
   font-size: 9px;
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index 8bd69faf84c..7016208f624 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -379,7 +379,7 @@ $issue-boards-card-shadow: rgba(186, 186, 186, 0.5);
 * Avatar
 */
 $avatar_radius: 50%;
-$avatar-border: rgba(0, 0, 0, .1);
+$avatar-border: $border-color;
 $gl-avatar-size: 40px;
 
 /*
diff --git a/app/assets/stylesheets/pages/issuable.scss b/app/assets/stylesheets/pages/issuable.scss
index e858ef427b0..aa04e490649 100644
--- a/app/assets/stylesheets/pages/issuable.scss
+++ b/app/assets/stylesheets/pages/issuable.scss
@@ -346,13 +346,9 @@
         display: none;
       }
 
-      .avatar:hover,
-      .avatar-counter:hover {
-        border-color: $issuable-sidebar-color;
-      }
-
       .avatar-counter:hover {
         color: $issuable-sidebar-color;
+        border-color: $issuable-sidebar-color;
       }
 
       .btn-clipboard {
-- 
cgit v1.2.1