From 89ee33926dc1486f08a4747790e085d2214e1132 Mon Sep 17 00:00:00 2001
From: MuslemRahimi <moslem_rahimi@hotmail.de>
Date: Tue, 4 Jun 2024 20:28:25 +0200
Subject: [PATCH] ui fixes

---
 .../components/CryptoKeyInformation.svelte    |  4 +--
 src/lib/components/ETFKeyInformation.svelte   | 16 +++++------
 src/lib/components/StockKeyInformation.svelte | 28 +++++++++----------
 src/routes/stocks/[tickerID]/+page.svelte     |  6 ++--
 4 files changed, 27 insertions(+), 27 deletions(-)

diff --git a/src/lib/components/CryptoKeyInformation.svelte b/src/lib/components/CryptoKeyInformation.svelte
index e6362d60..bbf0e7a9 100644
--- a/src/lib/components/CryptoKeyInformation.svelte
+++ b/src/lib/components/CryptoKeyInformation.svelte
@@ -26,10 +26,10 @@ export let cryptoProfile;
   <!--Start Crypto Modal-->
   <div class="drawer drawer-end z-40 overflow-hidden w-screen">
     <input id="tickerModal" type="checkbox" class="drawer-toggle"/>
-    <div class="drawer-side overflow-y-scroll overflow-hidden">
+    <div class="drawer-side overflow-hidden">
     
         
-      <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-y-scroll overflow-hidden">
+      <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-hidden">
   
           <label for="tickerModal" class="absolute left-6 top-6">
             <svg class="w-6 h-6 inline-block mb-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#fff" d="M9.125 21.1L.7 12.7q-.15-.15-.213-.325T.425 12q0-.2.063-.375T.7 11.3l8.425-8.425q.35-.35.875-.35t.9.375q.375.375.375.875t-.375.875L3.55 12l7.35 7.35q.35.35.35.863t-.375.887q-.375.375-.875.375t-.875-.375Z"/></svg>
diff --git a/src/lib/components/ETFKeyInformation.svelte b/src/lib/components/ETFKeyInformation.svelte
index 0692c1d7..1301badb 100644
--- a/src/lib/components/ETFKeyInformation.svelte
+++ b/src/lib/components/ETFKeyInformation.svelte
@@ -60,10 +60,10 @@
 <!--Start ETF Modal-->
 <div class="drawer drawer-end z-40 overflow-hidden w-screen">
   <input id="tickerModal" type="checkbox" class="drawer-toggle"/>
-  <div class="drawer-side overflow-y-scroll overflow-hidden">
+  <div class="drawer-side overflow-hidden">
   
       
-    <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-y-scroll overflow-hidden">
+    <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-hidden">
 
         <label for="tickerModal" class="absolute left-6 top-6">
           <svg class="w-6 h-6 inline-block mb-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#fff" d="M9.125 21.1L.7 12.7q-.15-.15-.213-.325T.425 12q0-.2.063-.375T.7 11.3l8.425-8.425q.35-.35.875-.35t.9.375q.375.375.375.875t-.375.875L3.55 12l7.35 7.35q.35.35.35.863t-.375.887q-.375.375-.875.375t-.875-.375Z"/></svg>
@@ -86,10 +86,10 @@
   <!--Start Similar Modal-->
 <div class="drawer drawer-end z-40 overflow-hidden w-screen">
   <input id="similarTickerModal" type="checkbox" class="drawer-toggle"/>
-  <div class="drawer-side overflow-y-scroll overflow-hidden">
+  <div class="drawer-side overflow-hidden">
   
       
-    <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-y-scroll overflow-hidden">
+    <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-hidden">
 
         <label for="similarTickerModal" class="absolute left-6 top-6">
           <svg class="w-6 h-6 inline-block mb-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#fff" d="M9.125 21.1L.7 12.7q-.15-.15-.213-.325T.425 12q0-.2.063-.375T.7 11.3l8.425-8.425q.35-.35.875-.35t.9.375q.375.375.375.875t-.375.875L3.55 12l7.35 7.35q.35.35.35.863t-.375.887q-.375.375-.875.375t-.875-.375Z"/></svg>
@@ -109,10 +109,10 @@
   <!--Start Top Holding Modal-->
   <div class="drawer drawer-end z-40 overflow-hidden w-screen">
     <input id="topHoldingModal" type="checkbox" class="drawer-toggle"/>
-    <div class="drawer-side overflow-y-scroll overflow-hidden">
+    <div class="drawer-side overflow-hidden">
     
         
-      <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-y-scroll overflow-hidden">
+      <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-hidden">
   
           <label for="topHoldingModal" class="absolute left-6 top-6">
             <svg class="w-6 h-6 inline-block mb-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#fff" d="M9.125 21.1L.7 12.7q-.15-.15-.213-.325T.425 12q0-.2.063-.375T.7 11.3l8.425-8.425q.35-.35.875-.35t.9.375q.375.375.375.875t-.375.875L3.55 12l7.35 7.35q.35.35.35.863t-.375.887q-.375.375-.875.375t-.875-.375Z"/></svg>
@@ -153,10 +153,10 @@
 <!--Start Dividend Modal-->
   <div class="drawer drawer-end z-40 overflow-hidden w-screen">
     <input id="dividendModal" type="checkbox" class="drawer-toggle"/>
-    <div class="drawer-side overflow-y-scroll overflow-hidden">
+    <div class="drawer-side overflow-hidden">
     
         
-      <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-y-scroll overflow-hidden">
+      <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-hidden">
   
           <label for="dividendModal" class="absolute left-6 top-6">
             <svg class="w-6 h-6 inline-block mb-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#fff" d="M9.125 21.1L.7 12.7q-.15-.15-.213-.325T.425 12q0-.2.063-.375T.7 11.3l8.425-8.425q.35-.35.875-.35t.9.375q.375.375.375.875t-.375.875L3.55 12l7.35 7.35q.35.35.35.863t-.375.887q-.375.375-.875.375t-.875-.375Z"/></svg>
diff --git a/src/lib/components/StockKeyInformation.svelte b/src/lib/components/StockKeyInformation.svelte
index 1a75e115..ef82386b 100644
--- a/src/lib/components/StockKeyInformation.svelte
+++ b/src/lib/components/StockKeyInformation.svelte
@@ -34,9 +34,9 @@ $: {
   
 
 
-<section class="mt-4 ">
+<section class="mt-4 overflow-hidden">
 
-  <div class="grid grid-cols-3 gap-x-4 gap-y-2">
+  <div class="grid grid-cols-3 gap-x-4 gap-y-2 overflow-hidden">
     <label for="tickerModal" class="w-auto border border-gray-300 flex px-4 py-2 mb-2 justify-center items-center text-xs font-medium rounded-xl text-gray-200">
       Details
     </label>
@@ -71,10 +71,10 @@ $: {
   <!--Start Executive Modal-->
   <div class="drawer drawer-end z-40 overflow-hidden w-screen">
     <input id="secFilingModal" type="checkbox" class="drawer-toggle"/>
-    <div class="drawer-side overflow-y-scroll overflow-hidden">
+    <div class="drawer-side overflow-hidden">
     
         
-      <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-y-scroll overflow-hidden">
+      <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-hidden">
   
           <label for="secFilingModal" class="absolute left-6 top-6">
             <svg class="w-6 h-6 inline-block mb-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#fff" d="M9.125 21.1L.7 12.7q-.15-.15-.213-.325T.425 12q0-.2.063-.375T.7 11.3l8.425-8.425q.35-.35.875-.35t.9.375q.375.375.375.875t-.375.875L3.55 12l7.35 7.35q.35.35.35.863t-.375.887q-.375.375-.875.375t-.875-.375Z"/></svg>
@@ -98,10 +98,10 @@ $: {
   <!--Start Executive Modal-->
   <div class="drawer drawer-end z-40 overflow-hidden w-screen">
     <input id="executiveModal" type="checkbox" class="drawer-toggle"/>
-    <div class="drawer-side overflow-y-scroll overflow-hidden">
+    <div class="drawer-side overflow-hidden">
     
         
-      <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-y-scroll overflow-hidden">
+      <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-hidden">
   
           <label for="executiveModal" class="absolute left-6 top-6">
             <svg class="w-6 h-6 inline-block mb-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#fff" d="M9.125 21.1L.7 12.7q-.15-.15-.213-.325T.425 12q0-.2.063-.375T.7 11.3l8.425-8.425q.35-.35.875-.35t.9.375q.375.375.375.875t-.375.875L3.55 12l7.35 7.35q.35.35.35.863t-.375.887q-.375.375-.875.375t-.875-.375Z"/></svg>
@@ -124,10 +124,10 @@ $: {
 <!--Start Ticker Modal-->
 <div class="drawer drawer-end z-40 overflow-hidden w-screen">
     <input id="tickerModal" type="checkbox" class="drawer-toggle"/>
-    <div class="drawer-side overflow-y-scroll overflow-hidden">
+    <div class="drawer-side overflow-hidden">
     
         
-      <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-y-scroll overflow-hidden">
+      <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-hidden">
   
           <label for="tickerModal" class="absolute left-6 top-6">
             <svg class="w-6 h-6 inline-block mb-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#fff" d="M9.125 21.1L.7 12.7q-.15-.15-.213-.325T.425 12q0-.2.063-.375T.7 11.3l8.425-8.425q.35-.35.875-.35t.9.375q.375.375.375.875t-.375.875L3.55 12l7.35 7.35q.35.35.35.863t-.375.887q-.375.375-.875.375t-.875-.375Z"/></svg>
@@ -153,10 +153,10 @@ $: {
 <!--Start ESG Modal-->
 <div class="drawer drawer-end z-40 overflow-hidden w-screen">
   <input id="esgModal" type="checkbox" class="drawer-toggle"/>
-  <div class="drawer-side overflow-y-scroll overflow-hidden">
+  <div class="drawer-side overflow-hidden">
   
       
-    <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-y-scroll overflow-hidden">
+    <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-hidden">
 
         <label for="esgModal" class="absolute left-6 top-6">
           <svg class="w-6 h-6 inline-block mb-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#fff" d="M9.125 21.1L.7 12.7q-.15-.15-.213-.325T.425 12q0-.2.063-.375T.7 11.3l8.425-8.425q.35-.35.875-.35t.9.375q.375.375.375.875t-.375.875L3.55 12l7.35 7.35q.35.35.35.863t-.375.887q-.375.375-.875.375t-.875-.375Z"/></svg>
@@ -177,10 +177,10 @@ $: {
 <!--Start Similar Modal-->
 <div class="drawer drawer-end z-40 overflow-hidden w-screen">
   <input id="similarTickerModal" type="checkbox" class="drawer-toggle"/>
-  <div class="drawer-side overflow-y-scroll overflow-hidden">
+  <div class="drawer-side overflow-hidden">
   
       
-    <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-y-scroll overflow-hidden">
+    <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-hidden">
 
         <label for="similarTickerModal" class="absolute left-6 top-6">
           <svg class="w-6 h-6 inline-block mb-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#fff" d="M9.125 21.1L.7 12.7q-.15-.15-.213-.325T.425 12q0-.2.063-.375T.7 11.3l8.425-8.425q.35-.35.875-.35t.9.375q.375.375.375.875t-.375.875L3.55 12l7.35 7.35q.35.35.35.863t-.375.887q-.375.375-.875.375t-.875-.375Z"/></svg>
@@ -200,10 +200,10 @@ $: {
 <!--Start Similar Modal-->
 <div class="drawer drawer-end z-40 overflow-hidden w-screen">
   <input id="topETFTickerHolderModal" type="checkbox" class="drawer-toggle"/>
-  <div class="drawer-side overflow-y-scroll overflow-hidden">
+  <div class="drawer-side overflow-hidden">
   
       
-    <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-y-scroll overflow-hidden">
+    <div class="bg-[#000] min-h-screen w-screen pb-20 overflow-hidden">
 
         <label for="topETFTickerHolderModal" class="absolute left-6 top-6">
           <svg class="w-6 h-6 inline-block mb-0.5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#fff" d="M9.125 21.1L.7 12.7q-.15-.15-.213-.325T.425 12q0-.2.063-.375T.7 11.3l8.425-8.425q.35-.35.875-.35t.9.375q.375.375.375.875t-.375.875L3.55 12l7.35 7.35q.35.35.35.863t-.375.887q-.375.375-.875.375t-.875-.375Z"/></svg>
diff --git a/src/routes/stocks/[tickerID]/+page.svelte b/src/routes/stocks/[tickerID]/+page.svelte
index 7e8a5185..39b7fdd0 100644
--- a/src/routes/stocks/[tickerID]/+page.svelte
+++ b/src/routes/stocks/[tickerID]/+page.svelte
@@ -742,9 +742,9 @@ function changeChartType() {
   </svelte:head>
     
   
-  <section class="bg-[#0F0F0F] min-h-screen pb-40">
+  <section class="bg-[#0F0F0F] min-h-screen pb-40 overflow-hidden">
   
-              <div class="w-full max-w-3xl m-auto ">
+              <div class="w-full max-w-3xl m-auto overflow-hidden">
   
           
                     <div class="md:flex md:justify-between md:divide-x md:divide-slate-800">
@@ -1205,7 +1205,7 @@ function changeChartType() {
 
 
                                 {#if $screenWidth <= 1022} <!--BUG: Dont remove since when changing ETF symbol display freezes-->
-                                  <div class="w-full mt-10 m-auto sm:p-6 lg:hidden">
+                                  <div class="w-full mt-10 m-auto sm:p-6 lg:hidden ">
                                     <h3 class="cursor-pointer flex flex-row items-center text-white text-xl sm:text-3xl font-bold">
                                       Key Information
                                     </h3>