ui fixes

src/routes/stocks/[tickerID]/dividends/+layout.svelte

@@ -47,7 +47,7 @@
         <aside class="hidden lg:block relative fixed w-1/4 ml-4">
           {#if data?.user?.tier !== "Pro" || data?.user?.freeTrial}
             <div
-              class="w-full bg-[#27272A] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-md h-fit pb-4 mt-4 cursor-pointer"
+              class="w-full border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer"
             >
               <a
                 href="/pricing"
@@ -68,7 +68,7 @@
 
           {#if newsList?.length !== 0}
             <div
-              class="w-full bg-[#27272A] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-md h-fit pb-4 mt-4 cursor-pointer"
+              class="w-full border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer"
             >
               <div class="p-4 text-sm">
                 <h3 class="text-lg text-white font-semibold mb-3">

src/routes/stocks/[tickerID]/dividends/+page.svelte

@@ -144,7 +144,7 @@
           </h1>
 
           <div
-            class="w-full text-white text-start p-3 sm:p-5 mb-10 rounded-lg sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
+            class="w-full text-white text-start p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
           >
             <svg
               class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"
@@ -198,7 +198,7 @@
 
         {#if rawData?.history?.length !== 0}
           <div
-            class="mb-4 grid grid-cols-2 grid-rows-1 divide-gray-500 rounded-lg border border-gray-600 bg-[#272727] shadow md:grid-cols-3 md:grid-rows-1 divide-x"
+            class="mb-4 grid grid-cols-2 grid-rows-1 divide-gray-600 rounded-md border border-gray-600 md:grid-cols-3 md:grid-rows-1 divide-x"
           >
             <div class="p-4 bp:p-5 sm:p-6">
               <label

src/routes/stocks/[tickerID]/insider/+layout.svelte

@@ -120,7 +120,7 @@
         <aside class="hidden lg:block relative fixed w-1/4 ml-4">
           {#if data?.user?.tier !== "Pro" || data?.user?.freeTrial}
             <div
-              class="w-full bg-[#27272A] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-md h-fit pb-4 mt-4 cursor-pointer"
+              class="w-full border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer"
             >
               <a
                 href="/pricing"
@@ -141,7 +141,7 @@
 
           {#if newsList?.length !== 0}
             <div
-              class="w-full sm:hover:text-white text-white border border-gray-800 rounded-md h-fit pb-4 mt-4 cursor-pointer"
+              class="w-full sm:hover:text-white text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer"
             >
               <div class="p-4 text-sm">
                 <h3 class="text-lg text-white font-semibold mb-3">

src/routes/stocks/[tickerID]/insider/+page.svelte

@@ -270,7 +270,7 @@
           <h1 class="text-xl sm:text-2xl text-white font-bold mb-4">
             Insider Trading
           </h1>
-
+          {#if insiderTradingList?.length === 0}
             <div
               class="w-fit text-white p-3 sm:p-5 mb-5 rounded-lg sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
             >
@@ -284,14 +284,10 @@
                 /></svg
               >
 
-            {#if insiderTradingList?.length !== 0}
-              Get detailed insights of Insiders who bought or sold {$displayCompanyName}
-              and the amounts involved!
-            {:else}
               No trading history available for {$displayCompanyName}. Likely no
               insider trading has happened yet.
-            {/if}
             </div>
+          {/if}
         </div>
 
         {#if isLoaded}
@@ -401,11 +397,11 @@
                 >
                   <!--Start Put/Call-->
                   <div
-                    class="flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] shadow-lg rounded-md h-20"
+                    class="flex flex-row items-center flex-wrap w-full px-3 sm:px-4 border border-gray-600 rounded-md h-20"
                   >
                     <div class="flex flex-col items-start">
                       <span
-                        class="font-medium text-gray-200 text-sm sm:text-[1rem]"
+                        class="font-medium text-white text-sm sm:text-[1rem]"
                         >Buy/Sell</span
                       >
                       <span
@@ -463,11 +459,11 @@
                   <!--End Put/Call-->
                   <!--Start Call Flow-->
                   <div
-                    class="flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] shadow-lg rounded-md h-20"
+                    class="flex flex-row items-center flex-wrap w-full px-3 sm:px-4 border border-gray-600 rounded-md h-20"
                   >
                     <div class="flex flex-col items-start">
                       <span
-                        class="font-medium text-gray-200 text-sm sm:text-[1rem]"
+                        class="font-medium text-white text-sm sm:text-[1rem]"
                         >Bought Shares</span
                       >
                       <span
@@ -525,11 +521,11 @@
                   <!--End Call Flow-->
                   <!--Start Put Flow-->
                   <div
-                    class="flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] shadow-lg rounded-md h-20"
+                    class="flex flex-row items-center flex-wrap w-full px-3 sm:px-4 border border-gray-600 rounded-md h-20"
                   >
                     <div class="flex flex-col items-start">
                       <span
-                        class="font-medium text-gray-200 text-sm sm:text-[1rem]"
+                        class="font-medium text-white text-sm sm:text-[1rem]"
                         >Sold Shares</span
                       >
                       <span

src/routes/stocks/[tickerID]/insider/congress-trading/+page.svelte

@@ -14,7 +14,6 @@
   let partyRatio = 0;
   let senateTradingList = [];
   let isLoaded = false;
-  let images = {};
 
   let cloudFrontUrl = import.meta.env.VITE_IMAGE_URL;
 
@@ -133,27 +132,8 @@
             Congress Trading
           </h1>
 
-          <div
-            class="text-white p-3 sm:p-5 mb-10 rounded-lg sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
-          >
-            <svg
-              class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"
-              xmlns="http://www.w3.org/2000/svg"
-              viewBox="0 0 256 256"
-              ><path
-                fill="#a474f6"
-                d="M128 24a104 104 0 1 0 104 104A104.11 104.11 0 0 0 128 24m-4 48a12 12 0 1 1-12 12a12 12 0 0 1 12-12m12 112a16 16 0 0 1-16-16v-40a8 8 0 0 1 0-16a16 16 0 0 1 16 16v40a8 8 0 0 1 0 16"
-              /></svg
-            >
-            Get detailed insights of Corrupt US Politician 🇺🇸 who bought or sold
-            {$displayCompanyName} and the amounts involved!
-          </div>
-        </div>
           {#if isLoaded}
             {#if senateTradingList?.length !== 0}
-            <h3 class="text-white text-xl font-semibold">
-              Congress Statistics
-            </h3>
               <!--Start Widget-->
               <div
                 class="w-full mt-5 mb-10 m-auto flex justify-center items-center"
@@ -163,11 +143,11 @@
                 >
                   <!--Start Buy/Sell-->
                   <div
-                  class="flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] rounded-lg h-20"
+                    class="flex flex-row items-center flex-wrap w-full px-3 sm:px-4 border border-gray-600 rounded-md h-20"
                   >
                     <div class="flex flex-col items-start">
                       <span
-                      class="font-semibold text-gray-200 text-sm sm:text-[1rem]"
+                        class="font-semibold text-white text-sm sm:text-[1rem]"
                         >Buy/Sell</span
                       >
                       <span
@@ -225,11 +205,11 @@
                   <!--End Buy/Sell-->
                   <!--Start Dem/Rep-->
                   <div
-                  class="flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] rounded-lg h-20"
+                    class="flex flex-row items-center flex-wrap w-full px-3 sm:px-4 border border-gray-600 rounded-md h-20"
                   >
                     <div class="flex flex-col items-start">
                       <span
-                      class="font-semibold text-gray-200 text-sm sm:text-[1rem]"
+                        class="font-semibold text-white text-sm sm:text-[1rem]"
                         >Dem/Rep</span
                       >
                       <span
@@ -400,8 +380,8 @@
               <h2
                 class="pl-4 pr-4 flex justify-center items-center text-md sm:text-lg text-center text-slate-200"
               >
-              No trading history available for {$displayCompanyName}. Likely no
+                No trading history available for {$displayCompanyName}. Likely
-              corrupt politican has interest in this stock.
+                no corrupt politican has interest in this stock.
               </h2>
             {/if}
           {:else}
@@ -419,4 +399,5 @@
         </div>
       </div>
     </div>
+  </div>
 </section>

src/routes/stocks/[tickerID]/insider/transcripts/+page.svelte

@@ -124,21 +124,6 @@
             Transcripts
           </h1>
 
-          <div
-            class="text-white p-3 sm:p-5 mb-10 rounded-lg sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
-          >
-            <svg
-              class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"
-              xmlns="http://www.w3.org/2000/svg"
-              viewBox="0 0 256 256"
-              ><path
-                fill="#a474f6"
-                d="M128 24a104 104 0 1 0 104 104A104.11 104.11 0 0 0 128 24m-4 48a12 12 0 1 1-12 12a12 12 0 0 1 12-12m12 112a16 16 0 0 1-16-16v-40a8 8 0 0 1 0-16a16 16 0 0 1 16 16v40a8 8 0 0 1 0 16"
-              /></svg
-            >
-            Discover the earnings call highlights and investor Q&A with {$displayCompanyName}!
-          </div>
-
           <div class="flex w-fit sm:w-[50%] md:block md:w-auto ml-auto">
             <div class="relative inline-block text-left grow">
               <DropdownMenu.Root>
@@ -279,7 +264,7 @@
                     </div>
                   </div>
                   <div
-                    class="flex flex-col w-full leading-1.5 p-4 bg-[#27272A] rounded-l-xl rounded-tr-xl"
+                    class="flex flex-col w-full leading-1.5 p-4 border border-gray-600 rounded-l-xl rounded-tr-xl"
                   >
                     <p class="text-sm font-normal py-2.5 text-gray-200">
                       {@html item?.description}
@@ -307,7 +292,7 @@
                     </div>
                   </div>
                   <div
-                    class="flex flex-col w-full leading-1.5 p-4 bg-[#27272A] rounded-r-xl rounded-tl-xl"
+                    class="flex flex-col w-full leading-1.5 p-4 border border-gray-600 rounded-r-xl rounded-tl-xl"
                   >
                     <p class="text-sm font-normal py-2.5 text-gray-200">
                       {@html item?.description}
@@ -319,7 +304,7 @@
 
             <label
               on:click={backToTop}
-              class="w-32 py-1.5 mt-10 hover:bg-white hover:bg-opacity-[0.05] cursor-pointer m-auto flex justify-center items-center border border-slate-800 rounded-full"
+              class="w-32 py-1.5 mt-10 hover:bg-white hover:bg-opacity-[0.05] cursor-pointer m-auto flex justify-center items-center border border-gray-600 rounded-full"
             >
               Back to top
             </label>

src/routes/stocks/[tickerID]/metrics/[slug]/+layout.svelte

@@ -17,7 +17,7 @@
         <aside class="hidden lg:block relative fixed w-1/4 ml-4">
           {#if data?.user?.tier !== "Pro" || data?.user?.freeTrial}
             <div
-              class="w-full bg-[#27272A] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-md h-fit pb-4 mt-4 cursor-pointer"
+              class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer"
             >
               <a
                 href="/pricing"
@@ -25,7 +25,7 @@
               >
                 <div class="w-full flex justify-between items-center p-3 mt-3">
                   <h2 class="text-start text-xl font-semibold text-white ml-3">
-                    Pro Subscription 🔥
+                    Pro Subscription
                   </h2>
                   <ArrowLogo class="w-8 h-8 mr-3 flex-shrink-0" />
                 </div>
@@ -37,7 +37,7 @@
           {/if}
 
           <div
-            class="w-full bg-[#27272A] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-md h-fit pb-4 mt-4 cursor-pointer"
+            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer"
           >
             <a
               href={"/price-alert"}
@@ -45,7 +45,7 @@
             >
               <div class="w-full flex justify-between items-center p-3 mt-3">
                 <h2 class="text-start text-xl font-semibold text-white ml-3">
-                  Price Alert ⏰
+                  Price Alert
                 </h2>
                 <ArrowLogo class="w-8 h-8 mr-3 flex-shrink-0" />
               </div>
@@ -56,7 +56,7 @@
           </div>
 
           <div
-            class="w-full bg-[#27272A] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-md h-fit pb-4 mt-4 cursor-pointer"
+            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer"
           >
             <a
               href={"/stock-screener"}
@@ -64,7 +64,7 @@
             >
               <div class="w-full flex justify-between items-center p-3 mt-3">
                 <h2 class="text-start text-xl font-semibold text-white ml-3">
-                  Stock Screener 🔎
+                  Stock Screener
                 </h2>
                 <ArrowLogo class="w-8 h-8 mr-3 flex-shrink-0" />
               </div>

src/routes/stocks/[tickerID]/options/+layout.svelte

@@ -17,7 +17,7 @@
         <aside class="hidden lg:block relative fixed w-1/4 ml-4">
           {#if data?.user?.tier !== "Pro" || data?.user?.freeTrial}
             <div
-              class="w-full bg-[#27272A] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-md h-fit pb-4 mt-4 cursor-pointer"
+              class="w-full border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer"
             >
               <a
                 href="/pricing"
@@ -25,7 +25,7 @@
               >
                 <div class="w-full flex justify-between items-center p-3 mt-3">
                   <h2 class="text-start text-xl font-semibold text-white ml-3">
-                    Pro Subscription 🔥
+                    Pro Subscription
                   </h2>
                   <ArrowLogo class="w-8 h-8 mr-3 flex-shrink-0" />
                 </div>
@@ -37,7 +37,7 @@
           {/if}
 
           <div
-            class="w-full bg-[#27272A] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-md h-fit pb-4 mt-4 cursor-pointer"
+            class="w-full border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer"
           >
             <a
               href={"/options-flow"}
@@ -56,7 +56,7 @@
           </div>
 
           <div
-            class="w-full bg-[#27272A] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-md h-fit pb-4 mt-4 cursor-pointer"
+            class="w-full border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer"
           >
             <a
               href={"/stock-screener"}

src/routes/stocks/[tickerID]/options/+page.svelte

@@ -594,7 +594,7 @@
 
         {#if optionsPlotData?.length !== 0}
           <div
-            class="mb-4 grid grid-cols-2 grid-rows-2 divide-gray-500 rounded-lg border border-gray-600 bg-[#272727] shadow md:grid-cols-4 md:grid-rows-1 md:divide-x"
+            class="mb-4 grid grid-cols-2 grid-rows-2 divide-gray-600 rounded-md border border-gray-600 md:grid-cols-4 md:grid-rows-1 md:divide-x"
           >
             <div class="p-4 bp:p-5 sm:p-6">
               <label

src/routes/stocks/[tickerID]/statistics/employees/+layout.svelte

@@ -17,7 +17,7 @@
         <aside class="hidden lg:block relative fixed w-1/4 ml-4">
           {#if data?.user?.tier !== "Pro" || data?.user?.freeTrial}
             <div
-              class="w-full bg-[#27272A] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-md h-fit pb-4 mt-4 cursor-pointer"
+              class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer"
             >
               <a
                 href="/pricing"
@@ -37,7 +37,7 @@
           {/if}
 
           <div
-            class="w-full bg-[#27272A] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-md h-fit pb-4 mt-4 cursor-pointer"
+            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer"
           >
             <a
               href={"/options-flow"}
@@ -56,7 +56,7 @@
           </div>
 
           <div
-            class="w-full bg-[#27272A] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-md h-fit pb-4 mt-4 cursor-pointer"
+            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer"
           >
             <a
               href={"/stock-screener"}

src/routes/stocks/[tickerID]/statistics/market-cap/+layout.svelte

@@ -17,7 +17,7 @@
         <aside class="hidden lg:block relative fixed w-1/4 ml-4">
           {#if data?.user?.tier !== "Pro" || data?.user?.freeTrial}
             <div
-              class="w-full bg-[#27272A] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-md h-fit pb-4 mt-4 cursor-pointer"
+              class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer"
             >
               <a
                 href="/pricing"
@@ -37,7 +37,7 @@
           {/if}
 
           <div
-            class="w-full bg-[#27272A] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-md h-fit pb-4 mt-4 cursor-pointer"
+            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer"
           >
             <a
               href={"/price-alert"}
@@ -56,7 +56,7 @@
           </div>
 
           <div
-            class="w-full bg-[#27272A] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-md h-fit pb-4 mt-4 cursor-pointer"
+            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer"
           >
             <a
               href={"/stock-screener"}