From 2d53ab1f6e88cde70ebf7f10e37281b654118826 Mon Sep 17 00:00:00 2001
From: Kavin <20838718+FireMasterK@users.noreply.github.com>
Date: Wed, 7 Sep 2022 00:13:51 +0530
Subject: [PATCH] Fix search suggestions on smaller screens.

---
 efy/piped.css                        | 2 --
 src/components/SearchSuggestions.vue | 4 +++-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/efy/piped.css b/efy/piped.css
index 32d6e2f7..b23ad859 100644
--- a/efy/piped.css
+++ b/efy/piped.css
@@ -82,8 +82,6 @@ tbody:nth-child(odd), .shaka-overflow-menu button:hover, .shaka-settings-menu bu
 
 /*SVG*/ .svg-inline--fa:not(.video-grid svg, .btn svg, button svg) {margin-right: 5rem}
 
-/*Search Suggestions*/ .suggestions-container {position: absolute; max-width: 600rem; width: 100%; z-index: 10; transform: translateX(-50%); padding: 15rem; background: var(--efy_text2); box-shadow: 0 0 20px var(--efy_text_trans); margin-bottom: 15rem}
-
 .suggestions-container ul {padding: 0; list-style: none; display: grid; gap: 5rem}
 .suggestions-container li {padding: 3rem 10rem}
 .suggestion-selected {box-shadow: 0 0 0 1.5rem var(--efy_color_border), 0 0 0 1.5rem var(--efy_color_border)}
diff --git a/src/components/SearchSuggestions.vue b/src/components/SearchSuggestions.vue
index 757835ca..e8154b74 100644
--- a/src/components/SearchSuggestions.vue
+++ b/src/components/SearchSuggestions.vue
@@ -77,6 +77,8 @@ export default {
 
 <style>
 .suggestions-container {
-    @apply left-1/2 translate-x-[-50%] transform-gpu max-w-3xl w-full box-border p-y-1.25 z-10 lt-md:max-w-[calc(100%-0.5rem)];
+    @apply left-1/2 translate-x-[-50%] transform-gpu max-w-[600rem] w-full box-border p-[15rem] mb-[15rem] z-10 lt-md:max-w-[calc(100%-0.5rem)];
+    background: var(--efy_text2);
+    box-shadow: 0 0 20px var(--efy_text_trans);
 }
 </style>