From ed5da924e64bb38640eb66191ea1911a2818d463 Mon Sep 17 00:00:00 2001
From: Josh Perez <60019601+josh-signal@users.noreply.github.com>
Date: Wed, 9 Mar 2022 14:33:43 -0500
Subject: [PATCH] Adjust calling pip z-index

---
 images/icons/v2/stories-outline-24.svg |  2 +-
 stylesheets/_modules.scss              | 18 +++++++-----------
 stylesheets/_variables.scss            |  2 +-
 stylesheets/components/Stories.scss    |  1 +
 4 files changed, 10 insertions(+), 13 deletions(-)

diff --git a/images/icons/v2/stories-outline-24.svg b/images/icons/v2/stories-outline-24.svg
index c1d0bd0623aa..b0dd37e63cb4 100644
--- a/images/icons/v2/stories-outline-24.svg
+++ b/images/icons/v2/stories-outline-24.svg
@@ -1 +1 @@
-<svg fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="m7 4c0-1.65685 1.34315-3 3-3h8c1.6569 0 3 1.34315 3 3v16c0 1.6569-1.3431 3-3 3h-8c-1.65685 0-3-1.3431-3-3zm2 0c0-.55228.44772-1 1-1h8c.5523 0 1 .44772 1 1v16c0 .5523-.4477 1-1 1h-8c-.55228 0-1-.4477-1-1zm-4-1c-1.10457 0-2 .89543-2 2v14c0 1.1046.89543 2 2 2z" fill="#000" fill-rule="evenodd"/></svg>
\ No newline at end of file
+<svg fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="m10.0762 1.20386c-1.51881 0-2.75003 1.23122-2.75003 2.75v16.00004c0 1.5187 1.23122 2.75 2.75003 2.75h8c1.5188 0 2.75-1.2313 2.75-2.75v-16.00004c0-1.51879-1.2312-2.75-2.75-2.75zm-1.25003 2.75c0-.69036.55965-1.25 1.25003-1.25h8c.6903 0 1.25.55964 1.25 1.25v16.00004c0 .6903-.5597 1.25-1.25 1.25h-8c-.69038 0-1.25003-.5597-1.25003-1.25zm-4.32617.04613c0-.33212.04048-.65478.11676-.96332-.92123.17877-1.61676.98982-1.61676 1.96332v14.00001c0 .9735.69553 1.7845 1.61676 1.9633-.07628-.3085-.11676-.6312-.11676-.9633z" fill="#000" fill-rule="evenodd"/></svg>
\ No newline at end of file
diff --git a/stylesheets/_modules.scss b/stylesheets/_modules.scss
index e22d647c948a..83f069a65036 100644
--- a/stylesheets/_modules.scss
+++ b/stylesheets/_modules.scss
@@ -2658,11 +2658,7 @@ button.ConversationDetails__action-button {
     @include keyboard-mode {
       &:focus {
         border-color: $color-ultramarine;
-      }
-    }
-    @include dark-keyboard-mode {
-      &:focus {
-        border-color: $color-ultramarine-light;
+        outline: none;
       }
     }
 
@@ -2702,7 +2698,11 @@ button.ConversationDetails__action-button {
     justify-content: center;
     padding: 2px;
     width: 32px;
-    margin-right: 8px;
+    margin-right: 20px;
+
+    .module-left-pane--width-narrow & {
+      display: none;
+    }
 
     @include light-theme {
       &:hover,
@@ -2726,11 +2726,7 @@ button.ConversationDetails__action-button {
     @include keyboard-mode {
       &:focus {
         border-color: $color-ultramarine;
-      }
-    }
-    @include dark-keyboard-mode {
-      &:focus {
-        border-color: $color-ultramarine-light;
+        outline: none;
       }
     }
 
diff --git a/stylesheets/_variables.scss b/stylesheets/_variables.scss
index 1eb20b7de3cf..08409f10f227 100644
--- a/stylesheets/_variables.scss
+++ b/stylesheets/_variables.scss
@@ -258,7 +258,7 @@ $z-index-on-top-of-everything: 9000;
 // The scroll down button should be above everything in the timeline but
 // popups, tooltips, toasts, and other items should stack above it.
 $z-index-scroll-down-button: 10;
-$z-index-calling-pip: 15;
 $z-index-below-popup-overlay: 98;
 $z-index-above-popup: 101;
+$z-index-calling-pip: 102;
 $z-index-above-context-menu: 126;
diff --git a/stylesheets/components/Stories.scss b/stylesheets/components/Stories.scss
index e82bd0fcc67c..1bc15542df27 100644
--- a/stylesheets/components/Stories.scss
+++ b/stylesheets/components/Stories.scss
@@ -33,6 +33,7 @@
 
       &--title {
         @include font-body-1-bold;
+        color: $color-gray-05;
         display: flex;
         flex: 1;
         justify-content: center;