From 4410eb6270d782cd5443ebc8d139b41aec8054d9 Mon Sep 17 00:00:00 2001
From: DanHillesheim <79476558+DanHillesheim@users.noreply.github.com>
Date: Wed, 9 Nov 2022 09:57:01 -0700
Subject: [PATCH] [PS-1840] - fix for covered dropdown on empty vault (#4019)

* fix for covered dropdown on empty vault

This could be done one of 2-3 ways. I think this might be the least problematic, but could also be done with just changing "position: absolute" to "relative on the ".no-items" class - base.css:461 For some reason, I'm unable to load the spinner to test.

* rename class
---
 apps/browser/src/popup/scss/misc.scss                    | 5 +++++
 apps/browser/src/popup/vault/vault-filter.component.html | 5 ++++-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/apps/browser/src/popup/scss/misc.scss b/apps/browser/src/popup/scss/misc.scss
index 3476c1f3c6..2e832e9286 100644
--- a/apps/browser/src/popup/scss/misc.scss
+++ b/apps/browser/src/popup/scss/misc.scss
@@ -135,6 +135,11 @@ p.lead {
   border-radius: $border-radius;
 }
 
+.select-index-top {
+  position: relative;
+  z-index: 100;
+}
+
 .sr-only {
   position: absolute !important;
   width: 1px !important;
diff --git a/apps/browser/src/popup/vault/vault-filter.component.html b/apps/browser/src/popup/vault/vault-filter.component.html
index c92ae9e1ab..26689a5055 100644
--- a/apps/browser/src/popup/vault/vault-filter.component.html
+++ b/apps/browser/src/popup/vault/vault-filter.component.html
@@ -23,7 +23,10 @@
   </div>
 </header>
 <main tabindex="-1" cdk-scrollable>
-  <app-vault-select (onVaultSelectionChanged)="vaultFilterChanged()"></app-vault-select>
+  <app-vault-select
+    (onVaultSelectionChanged)="vaultFilterChanged()"
+    class="select-index-top"
+  ></app-vault-select>
   <div class="no-items" *ngIf="(!ciphers || !ciphers.length) && !showSearching()">
     <i class="bwi bwi-spinner bwi-spin bwi-3x" *ngIf="!loaded"></i>
     <ng-container *ngIf="loaded">