From 2f8fb36229f73def23068e9e104a4562f3f39468 Mon Sep 17 00:00:00 2001
From: Josh Perez <60019601+josh-signal@users.noreply.github.com>
Date: Thu, 7 Apr 2022 19:27:20 -0400
Subject: [PATCH] Fixes calling overlay z-index issue

---
 stylesheets/_modules.scss               | 2 +-
 stylesheets/_variables.scss             | 6 +++---
 stylesheets/components/StoryViewer.scss | 3 ++-
 3 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/stylesheets/_modules.scss b/stylesheets/_modules.scss
index 419aac5d1e46..06f9db33e681 100644
--- a/stylesheets/_modules.scss
+++ b/stylesheets/_modules.scss
@@ -3547,7 +3547,7 @@ button.module-image__border-overlay:focus {
     justify-content: center;
     position: absolute;
     width: 100%;
-    z-index: $z-index-below-popup-overlay;
+    z-index: $z-index-calling;
   }
 
   &__header {
diff --git a/stylesheets/_variables.scss b/stylesheets/_variables.scss
index 08409f10f227..821a48eb8ce9 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-below-popup-overlay: 98;
-$z-index-above-popup: 101;
-$z-index-calling-pip: 102;
+$z-index-calling: 101;
+$z-index-above-popup: 102;
+$z-index-calling-pip: 103;
 $z-index-above-context-menu: 126;
diff --git a/stylesheets/components/StoryViewer.scss b/stylesheets/components/StoryViewer.scss
index 53d945e6f6b6..c784fbc5434c 100644
--- a/stylesheets/components/StoryViewer.scss
+++ b/stylesheets/components/StoryViewer.scss
@@ -29,6 +29,7 @@
   &__close-button {
     @include button-reset;
     @include modal-close-button;
+    top: var(--title-bar-drag-area-height);
   }
 
   &__more {
@@ -36,7 +37,7 @@
     height: 24px;
     position: absolute;
     right: 48px;
-    top: 12px;
+    top: var(--title-bar-drag-area-height);
     width: 24px;
 
     @include color-svg('../images/icons/v2/more-horiz-24.svg', $color-white);