From 10f30c34b35e1e982d30392fbc79892cd36e0025 Mon Sep 17 00:00:00 2001
From: MuslemRahimi <moslem_rahimi@hotmail.de>
Date: Sun, 30 Mar 2025 19:41:26 +0200
Subject: [PATCH] update dark pool page

---
 .../DarkPool/HistoricalVolume.svelte          | 14 ++++++++++----
 .../components/DarkPool/HottestTrades.svelte  | 19 +++++++++++++++----
 .../components/DarkPool/RealtimeTrade.svelte  |  2 +-
 3 files changed, 26 insertions(+), 9 deletions(-)

diff --git a/src/lib/components/DarkPool/HistoricalVolume.svelte b/src/lib/components/DarkPool/HistoricalVolume.svelte
index b31328de..ba27af13 100644
--- a/src/lib/components/DarkPool/HistoricalVolume.svelte
+++ b/src/lib/components/DarkPool/HistoricalVolume.svelte
@@ -384,10 +384,16 @@
         >
           <thead class="text-muted dark:text-white dark:bg-default">
             <tr>
-              <th class=" font-semibold text-start text-sm">Date</th>
-              <th class=" font-semibold text-end text-sm">Total Volume</th>
-              <th class=" font-semibold text-end text-sm">Short Volume</th>
-              <th class=" font-semibold text-end text-sm"
+              <th class=" font-semibold text-start text-sm sm:text-[1rem]"
+                >Date</th
+              >
+              <th class=" font-semibold text-end text-sm sm:text-[1rem]"
+                >Total Volume</th
+              >
+              <th class=" font-semibold text-end text-sm sm:text-[1rem]"
+                >Short Volume</th
+              >
+              <th class=" font-semibold text-end text-sm sm:text-[1rem]"
                 >% Short Volume Change</th
               >
             </tr>
diff --git a/src/lib/components/DarkPool/HottestTrades.svelte b/src/lib/components/DarkPool/HottestTrades.svelte
index b851ea5c..726dce7b 100644
--- a/src/lib/components/DarkPool/HottestTrades.svelte
+++ b/src/lib/components/DarkPool/HottestTrades.svelte
@@ -135,10 +135,10 @@
         content={"Real-time hottest trades highlight significant premium flows, revealing where big players are active and hinting at market trends or sentiment."}
         id={"hottestDPTrade"}
       />
-
       <a
         href={`/dark-pool-flow?query=${ticker}`}
-        class="ml-auto rounded text-xs sm:text-sm px-2 sm:px-3 py-2 font-semibold bg-blue-100 dark:bg-[#fff] text-black"
+        class="sm:hidden ml-auto px-3 py-1 text-sm border border-gray-300 dark:border-gray-700 bg-gray-100 shadow-sm dark:bg-white text-black '
+                   transition ease-out duration-100 rounded cursor-pointer"
       >
         View All
       </a>
@@ -146,8 +146,19 @@
 
     {#if rawData?.length !== 0}
       <div class="w-full flex flex-col items-start">
-        <div class=" text-[1rem] mt-2 mb-2 w-full">
-          Get in realtime the latest hottest trades based on premium.
+        <div
+          class="flex flex-row items-end justify-between w-full mt-2 sm:mt-0 mb-2"
+        >
+          <div class="text-[1rem]">
+            Get in realtime the latest hottest trades based on premium.
+          </div>
+          <a
+            href={`/dark-pool-flow?query=${ticker}`}
+            class="hidden sm:inline-block ml-auto px-3 py-1 text-sm border border-gray-300 dark:border-gray-700 bg-gray-100 shadow-sm dark:bg-white text-black '
+                   transition ease-out duration-100 rounded cursor-pointer"
+          >
+            View All
+          </a>
         </div>
       </div>
 
diff --git a/src/lib/components/DarkPool/RealtimeTrade.svelte b/src/lib/components/DarkPool/RealtimeTrade.svelte
index 0a14e36c..dac27149 100644
--- a/src/lib/components/DarkPool/RealtimeTrade.svelte
+++ b/src/lib/components/DarkPool/RealtimeTrade.svelte
@@ -234,7 +234,7 @@
       <div
         class="{!['Pro']?.includes(data?.user?.tier)
           ? 'blur-[3px]'
-          : ''} mt-5 sm:mt-0 border border-gray-300 dark:border-gray-800 rounded"
+          : ''}  border border-gray-300 dark:border-gray-800 rounded"
         use:highcharts={config}
       ></div>
       <!-- Overlay with "Upgrade to Pro" -->