From 1d62c2640eebf7893dd4fd653097f1c5c3039c22 Mon Sep 17 00:00:00 2001
From: TAKAHASHI Shuuji <shuuji3@gmail.com>
Date: Sat, 10 Aug 2024 23:55:05 +0900
Subject: [PATCH] fix(ui): adjust z-index of Embedded Media Player and sticky
 header (#2848)

---
 components/main/MainContent.vue           | 2 +-
 components/search/SearchWidget.vue        | 2 +-
 components/status/StatusEmbeddedMedia.vue | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/components/main/MainContent.vue b/components/main/MainContent.vue
index 312b5e52..dc3ba261 100644
--- a/components/main/MainContent.vue
+++ b/components/main/MainContent.vue
@@ -27,7 +27,7 @@ const containerClass = computed(() => {
 <template>
   <div ref="container" :class="containerClass">
     <div
-      sticky top-0 z10
+      sticky top-0 z-20
       pt="[env(safe-area-inset-top,0)]"
       bg="[rgba(var(--rgb-bg-base),0.7)]"
       class="native:lg:w-[calc(100vw-5rem)] native:xl:w-[calc(135%+(100vw-1200px)/2)]"
diff --git a/components/search/SearchWidget.vue b/components/search/SearchWidget.vue
index ee73f9e1..2234e39f 100644
--- a/components/search/SearchWidget.vue
+++ b/components/search/SearchWidget.vue
@@ -90,7 +90,7 @@ function activate() {
       </button>
     </div>
     <!-- Results -->
-    <div left-0 top-11 absolute w-full z10 group-focus-within="pointer-events-auto visible" invisible pointer-events-none>
+    <div left-0 top-11 absolute w-full z-10 group-focus-within="pointer-events-auto visible" invisible pointer-events-none>
       <div w-full bg-base border="~ base" rounded-3 max-h-100 overflow-auto py2>
         <span v-if="query.trim().length === 0" block text-center text-sm text-secondary>
           {{ t('search.search_desc') }}
diff --git a/components/status/StatusEmbeddedMedia.vue b/components/status/StatusEmbeddedMedia.vue
index 0a997a32..aeb54d19 100644
--- a/components/status/StatusEmbeddedMedia.vue
+++ b/components/status/StatusEmbeddedMedia.vue
@@ -28,7 +28,7 @@ const card = ref(status.card)
         absolute
         w-full
         h-full
-        z-100
+        z-10
         rounded-lg
         style="background: linear-gradient(black, rgba(0,0,0,0.5), transparent, transparent, rgba(0,0,0,0.20))"
       >