From 27560e9bef48aadf22ec9f223e533a52861ca19c Mon Sep 17 00:00:00 2001
From: MuslemRahimi <moslem_rahimi@hotmail.de>
Date: Mon, 10 Mar 2025 00:04:18 +0100
Subject: [PATCH] ui fix

---
 src/routes/+page.svelte                 |   2 +-
 src/routes/advertise/+page.svelte       |  38 +++++----
 src/routes/contact/+page.svelte         |  46 +++++------
 src/routes/data-disclaimer/+page.svelte |  84 ++++++++++----------
 src/routes/imprint/+page.svelte         |  64 +++++++--------
 src/routes/newsletter/+page.svelte      |   4 +-
 src/routes/privacy-policy/+page.svelte  |  72 ++++++++---------
 src/routes/reddit-tracker/+page.svelte  | 101 ++++++++++++------------
 src/routes/terms-of-use/+page.svelte    |  98 ++++++++++++-----------
 9 files changed, 258 insertions(+), 251 deletions(-)

diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index d8122142..b49480ea 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -542,7 +542,7 @@
                   >
                   <a
                     href="/earnings-calendar"
-                    class="ml-auto rounded-md text-xs sm:text-sm px-2 sm:px-3 py-2 font-semibold bg-[#fff] text-black"
+                    class="ml-auto rounded-md text-xs sm:text-sm px-2 sm:px-3 py-2 font-semibold bg-blue-100 dark:bg-[#fff] text-black"
                   >
                     View All
                     <ArrowUpRight
diff --git a/src/routes/advertise/+page.svelte b/src/routes/advertise/+page.svelte
index 2cef1384..0546b7d0 100644
--- a/src/routes/advertise/+page.svelte
+++ b/src/routes/advertise/+page.svelte
@@ -10,30 +10,30 @@
 />
 
 <section
-  class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden min-h-screen pb-20 pt-5 px-4 lg:px-3"
+  class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden min-h-screen pt-5 px-4 lg:px-3 text-muted dark:text-white"
 >
   <div class="text-sm sm:text-[1rem] breadcrumbs">
     <ul>
-      <li><a href="/" class="text-gray-300">Home</a></li>
-      <li class="text-gray-300">Advertise</li>
+      <li><a href="/" class="text-muted dark:text-gray-300">Home</a></li>
+      <li class="text-muted dark:text-gray-300">Advertise</li>
     </ul>
   </div>
 
-  <div class="w-full overflow-hidden m-auto mt-5 text-white">
+  <div class="w-full overflow-hidden m-auto mt-5">
     <div class="sm:p-0 flex justify-center w-full m-auto overflow-hidden">
       <div
         class="relative flex justify-center items-start overflow-hidden w-full"
       >
         <main class="w-full lg:w-3/4 lg:pr-5">
           <div class="mb-6 border-b-[2px]">
-            <h1 class="mb-1 text-white text-2xl sm:text-3xl font-bold">
+            <h1 class="mb-1 text-2xl sm:text-3xl font-bold">
               Advertise With Us
             </h1>
           </div>
 
-          <div class="w-full bg-default m-auto">
+          <div class="w-full m-auto">
             <div>
-              <p class="text-white mb-3 text-lg">
+              <p class=" mb-3 text-lg">
                 At Stocknear, we’re redefining financial research with the first
                 fully open-source platform designed to help small retail
                 investors. With our user-first approach, we ensure
@@ -41,7 +41,7 @@
                 visitor.
               </p>
 
-              <p class="text-white mb-3 text-lg">
+              <p class=" mb-3 text-lg">
                 By advertising with us, your brand gains unparalleled visibility
                 in a dynamic, innovative space where your message resonates
                 deeply. Our diverse audience includes long-term investors,
@@ -79,7 +79,7 @@
                 audience?
                 <br />Contact us today at
                 <a
-                  class="text-blue-400 sm:hover:underline sm:hover:underline-offset-4"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                   href="mailto:contact@stocknear.com">contact@stocknear.com</a
                 >. We’d love to discuss how we can help your business grow.
               </p>
@@ -89,38 +89,42 @@
 
         <aside class="hidden lg:block relative fixed w-1/4 ml-4">
           <div
-            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
+            class="w-full border border-gray-300 dark:border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer sm:hover:shadow-lg dark:sm:hover:bg-secondary transition ease-out duration-100"
           >
             <a
               href="/donation"
               class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
             >
               <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">
+                <h2 class="text-start text-xl font-semibold ml-3">
                   Sponsor Us
                 </h2>
-                <ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
+                <ArrowLogo
+                  class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
+                />
               </div>
-              <span class="text-white p-3 ml-3 mr-3">
+              <span class=" p-3 ml-3 mr-3">
                 Learn more about why we're doing this here
               </span>
             </a>
           </div>
 
           <div
-            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
+            class="w-full border border-gray-300 dark:border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer sm:hover:shadow-lg dark:sm:hover:bg-secondary transition ease-out duration-100"
           >
             <a
               href="/contact"
               class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
             >
               <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">
+                <h2 class="text-start text-xl font-semibold ml-3">
                   Contact Us
                 </h2>
-                <ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
+                <ArrowLogo
+                  class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
+                />
               </div>
-              <span class="text-white p-3 ml-3 mr-3">
+              <span class=" p-3 ml-3 mr-3">
                 Let me know if you need something
               </span>
             </a>
diff --git a/src/routes/contact/+page.svelte b/src/routes/contact/+page.svelte
index f72c36f6..42225e65 100644
--- a/src/routes/contact/+page.svelte
+++ b/src/routes/contact/+page.svelte
@@ -13,12 +13,12 @@
 />
 
 <section
-  class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden min-h-screen pt-5 pb-40"
+  class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden min-h-screen pt-5 pb-40 text-muted dark:text-white"
 >
   <div class="text-sm sm:text-[1rem] breadcrumbs">
     <ul>
-      <li><a href="/" class="text-gray-300">Home</a></li>
-      <li class="text-gray-300">Contact Us</li>
+      <li><a href="/" class="text-muted dark:text-gray-300">Home</a></li>
+      <li class="text-muted dark:text-gray-300">Contact Us</li>
     </ul>
   </div>
 
@@ -29,21 +29,19 @@
       >
         <main class="w-full lg:w-3/4 lg:pr-5">
           <div
-            class="w-full m-auto sm:bg-primary sm:rounded-xl h-auto pl-10 pr-10 pt-5 sm:pb-10 sm:pt-10 mt-3 mb-8"
+            class="w-full m-auto shadow-sm border border-gray-300 bg-gray-100 dark:sm:bg-primary sm:rounded-xl h-auto pl-10 pr-10 pt-5 sm:pb-10 sm:pt-10 mt-3 mb-8"
           >
             <div class="grid grid-cols-1 sm:grid-cols-2 gap-10">
               <!-- Start Column -->
               <div>
                 <div class="flex flex-row justify-center items-center sm:mt-5">
-                  <h1
-                    class="text-3xl sm:text-4xl text-white text-center font-bold mb-5"
-                  >
+                  <h1 class="text-3xl sm:text-4xl text-center font-bold mb-5">
                     Sharing is Caring
                   </h1>
                 </div>
 
                 <span
-                  class="text-white text-md text-center flex justify-center items-center"
+                  class=" text-md text-center flex justify-center items-center"
                 >
                   unless it's family
                 </span>
@@ -83,23 +81,23 @@
           </div>
 
           <div
-            class="card w-full rounded-none sm:rounded-xl border-t border-gray-600 sm:border sm:border-gray-600 m-auto"
+            class="card w-full rounded-none sm:rounded-xl border-t border-gray-300 dark:border-gray-600 sm:border m-auto"
           >
             <div class="card-body">
-              <h2 class="card-title text-2xl mb-5 text-white">Support</h2>
-              <p class="text-white">
+              <h2 class="card-title text-2xl mb-5">Support</h2>
+              <p class="">
                 Please take a moment to share your thoughts on this website with
                 us. We welcome any feedback you may have. If there's a feature
                 you'd like to see implemented, please let us know and we'll work
                 to make the website even better for you. Thank you for your time
                 and input!
               </p>
-              <p class="text-white mt-5">
+              <p class=" mt-5">
                 <!-- svelte-ignore a11y-missing-content -->
                 You can contact us at
                 <a
                   href={`mailto:${emailAddress}`}
-                  class="text-blue-400 hover:text-white hover:underline"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                   >{emailAddress}</a
                 >
               </p>
@@ -109,38 +107,40 @@
 
         <aside class="hidden lg:block relative fixed w-1/4 ml-4">
           <div
-            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
+            class="w-full border border-gray-300 dark:border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer sm:hover:shadow-lg dark:sm:hover:bg-secondary transition ease-out duration-100"
           >
             <a
               href="/donation"
               class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
             >
               <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">
+                <h2 class="text-start text-xl font-semibold ml-3">
                   Sponsor Us
                 </h2>
-                <ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
+                <ArrowLogo
+                  class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
+                />
               </div>
-              <span class="text-white p-3 ml-3 mr-3">
+              <span class=" p-3 ml-3 mr-3">
                 Learn more about why we're doing this here
               </span>
             </a>
           </div>
 
           <div
-            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
+            class="w-full border border-gray-300 dark:border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer sm:hover:shadow-lg dark:sm:hover:bg-secondary transition ease-out duration-100"
           >
             <a
               href="/about"
               class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
             >
               <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">
-                  About Us
-                </h2>
-                <ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
+                <h2 class="text-start text-xl font-semibold ml-3">About Us</h2>
+                <ArrowLogo
+                  class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
+                />
               </div>
-              <span class="text-white p-3 ml-3 mr-3">
+              <span class=" p-3 ml-3 mr-3">
                 Learn the mission of the company and the team
               </span>
             </a>
diff --git a/src/routes/data-disclaimer/+page.svelte b/src/routes/data-disclaimer/+page.svelte
index 9ad52c7b..4867e1f6 100644
--- a/src/routes/data-disclaimer/+page.svelte
+++ b/src/routes/data-disclaimer/+page.svelte
@@ -12,12 +12,12 @@
 />
 
 <section
-  class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden min-h-screen pb-20 pt-5 px-4 lg:px-3"
+  class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden min-h-screen pb-20 pt-5 px-4 lg:px-3 text-muted dark:text-white"
 >
   <div class="text-sm sm:text-[1rem] breadcrumbs">
     <ul>
-      <li><a href="/" class="text-gray-300">Home</a></li>
-      <li class="text-gray-300">Data Disclaimer</li>
+      <li><a href="/" class="text-muted dark:text-gray-300">Home</a></li>
+      <li class="text-muted dark:text-gray-300">Data Disclaimer</li>
     </ul>
   </div>
 
@@ -28,14 +28,12 @@
       >
         <main class="w-full lg:w-3/4 lg:pr-10">
           <div class="mb-6 border-b-2">
-            <h1 class="mb-1 text-white text-2xl sm:text-3xl font-bold">
-              Data Disclaimer
-            </h1>
+            <h1 class="mb-1 text-2xl sm:text-3xl font-bold">Data Disclaimer</h1>
           </div>
 
-          <div class="w-full bg-default m-auto">
+          <div class="w-full m-auto">
             <div>
-              <p class="text-white mb-5 text-[1rem] sm:text-lg">
+              <p class=" mb-5 text-[1rem] sm:text-lg">
                 The financial data presented on Stocknear is provided for
                 informational and educational purposes only. This information
                 should not be construed as financial advice or used as the sole
@@ -48,30 +46,30 @@
                   href={discordURL}
                   target="_blank"
                   rel="noopener noreferrer"
-                  class="text-blue-400 hover:underline"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                 >
                   Discord
                 </a>
                 or contact our support team at
                 <a
                   href="mailto:{emailAddress}"
-                  class="text-blue-400 hover:underline"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                 >
                   {emailAddress}
                 </a>.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold">
                 Market Data & Stock Charts
               </h2>
-              <p class="text-white mb-10 mt-5 text-[1rem] sm:text-lg">
+              <p class=" mb-10 mt-5 text-[1rem] sm:text-lg">
                 Our comprehensive market data and real-time stock charts are
                 powered by
                 <a
                   href="https://site.financialmodelingprep.com/pricing-plans?couponCode=stocknear"
                   target="_blank"
                   rel="noopener noreferrer"
-                  class="text-blue-400 hover:underline"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                 >
                   Financial Modeling Prep (FMP)
                 </a>, a leading provider of financial data services. This
@@ -79,10 +77,10 @@
                 indicators.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold">
                 Market Coverage
               </h2>
-              <p class="text-white mb-10 mt-5 text-[1rem] sm:text-lg">
+              <p class=" mb-10 mt-5 text-[1rem] sm:text-lg">
                 Stocknear provides comprehensive coverage of securities listed
                 on major U.S. exchanges, including NASDAQ, NYSE, NYSE American,
                 and NYSE Arca. Our database encompasses stocks, ETFs, ADRs, and
@@ -90,16 +88,16 @@
                 include additional global exchanges and financial instruments.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold">
                 Financial Fundamentals
               </h2>
-              <p class="text-white mb-10 mt-5 text-[1rem] sm:text-lg">
+              <p class=" mb-10 mt-5 text-[1rem] sm:text-lg">
                 Our fundamental financial data is sourced from
                 <a
                   href="https://site.financialmodelingprep.com/pricing-plans?couponCode=stocknear"
                   target="_blank"
                   rel="noopener noreferrer"
-                  class="text-blue-400 hover:underline"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                 >
                   Financial Modeling Prep
                 </a>
@@ -110,10 +108,10 @@
                 company submissions to regulatory authorities.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold">
                 Analyst Coverage & Market Projections
               </h2>
-              <p class="text-white mb-10 mt-5 text-[1rem] sm:text-lg">
+              <p class=" mb-10 mt-5 text-[1rem] sm:text-lg">
                 Our analyst coverage integrates data from multiple authoritative
                 sources. Price targets and analyst ratings are provided by
                 Benzinga, representing consensus views from leading Wall Street
@@ -123,7 +121,7 @@
                   href="https://site.financialmodelingprep.com/pricing-plans?couponCode=stocknear"
                   target="_blank"
                   rel="noopener noreferrer"
-                  class="text-blue-400 hover:underline"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                 >
                   Financial Modeling Prep
                 </a>. While we strive to present the most accurate forecasts,
@@ -132,27 +130,25 @@
                 investment research process.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold">
-                ETF Analytics
-              </h2>
-              <p class="text-white mb-10 mt-5 text-[1rem] sm:text-lg">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold">ETF Analytics</h2>
+              <p class=" mb-10 mt-5 text-[1rem] sm:text-lg">
                 Our ETF holdings data and analytics are provided through our
                 partnership with
                 <a
                   href="https://site.financialmodelingprep.com/pricing-plans?couponCode=stocknear"
                   target="_blank"
                   rel="noopener noreferrer"
-                  class="text-blue-400 hover:underline"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                 >
                   Financial Modeling Prep
                 </a>, ensuring accurate and timely information on fund
                 compositions, allocations, and performance metrics.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold">
                 Options Market Data
               </h2>
-              <p class="text-white mb-10 mt-5 text-[1rem] sm:text-lg">
+              <p class=" mb-10 mt-5 text-[1rem] sm:text-lg">
                 Our options market data infrastructure combines real-time
                 options flow information from Benzinga and individual options
                 chain data from Intrinio, both sourced through the Options Price
@@ -166,57 +162,61 @@
 
         <aside class="hidden lg:block relative fixed w-1/4 mt-4">
           <div
-            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
+            class="w-full border border-gray-300 dark:border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer sm:hover:shadow-lg dark:sm:hover:bg-secondary transition ease-out duration-100"
           >
             <a
               href="/pricing"
               class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
             >
               <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">
+                <h2 class="text-start text-xl font-semibold ml-3">
                   Pro Subscription
                 </h2>
-                <ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
+                <ArrowLogo
+                  class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
+                />
               </div>
-              <span class="text-white p-3 ml-3 mr-3">
+              <span class=" p-3 ml-3 mr-3">
                 Upgrade now for unlimited access to all data and tools.
               </span>
             </a>
           </div>
 
           <div
-            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
+            class="w-full border border-gray-300 dark:border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer sm:hover:shadow-lg dark:sm:hover:bg-secondary transition ease-out duration-100"
           >
             <a
               href="/about"
               class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
             >
               <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">
-                  About Us
-                </h2>
-                <ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
+                <h2 class="text-start text-xl font-semibold ml-3">About Us</h2>
+                <ArrowLogo
+                  class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
+                />
               </div>
-              <span class="text-white p-3 ml-3 mr-3">
+              <span class=" p-3 ml-3 mr-3">
                 Learn more about why we're doing this here
               </span>
             </a>
           </div>
 
           <div
-            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
+            class="w-full border border-gray-300 dark:border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer sm:hover:shadow-lg dark:sm:hover:bg-secondary transition ease-out duration-100"
           >
             <a
               href="/contact"
               class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
             >
               <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">
+                <h2 class="text-start text-xl font-semibold ml-3">
                   Contact Us
                 </h2>
-                <ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
+                <ArrowLogo
+                  class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
+                />
               </div>
-              <span class="text-white p-3 ml-3 mr-3">
+              <span class=" p-3 ml-3 mr-3">
                 Let me know if you need something
               </span>
             </a>
diff --git a/src/routes/imprint/+page.svelte b/src/routes/imprint/+page.svelte
index baec5820..28dd29cc 100644
--- a/src/routes/imprint/+page.svelte
+++ b/src/routes/imprint/+page.svelte
@@ -8,12 +8,12 @@
 <SEO title="Imprint" description="" />
 
 <section
-  class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden pb-20 pt-5 px-4 lg:px-3"
+  class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden pb-20 pt-5 px-4 lg:px-3 text-muted dark:text-white"
 >
   <div class="text-sm sm:text-[1rem] breadcrumbs">
     <ul>
-      <li><a href="/" class="text-gray-300">Home</a></li>
-      <li class="text-gray-300">Imprint</li>
+      <li><a href="/" class="text-muted dark:text-gray-300">Home</a></li>
+      <li class="text-muted dark:text-gray-300">Imprint</li>
     </ul>
   </div>
 
@@ -24,18 +24,16 @@
       >
         <main class="w-full lg:w-3/4 lg:pr-5">
           <div class="mb-6 border-b-[2px]">
-            <h1 class="mb-1 text-white text-2xl sm:text-3xl font-bold">
-              Imprint
-            </h1>
+            <h1 class="mb-1 text-2xl sm:text-3xl font-bold">Imprint</h1>
           </div>
 
-          <div class="w-full bg-default m-auto">
+          <div class="w-full m-auto">
             <div class="">
-              <p class="text-white italic mb-2">
+              <p class=" italic mb-2">
                 According to § 5 Telemediengesetz (TMG) ‍
               </p>
 
-              <p class="text-white mb-10">
+              <p class=" mb-10">
                 Stocknear GmbH
                 <br />
                 Am Lohgraben 30
@@ -45,7 +43,7 @@
                 Email:
                 <a
                   href={`mailto:${emailAddress}`}
-                  class="text-blue-400 hover:text-white hover:underline"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                   >{emailAddress}</a
                 >.
                 <br />
@@ -60,13 +58,13 @@
                 VAT ID: DE366905061
               </p>
 
-              <p class="text-white mb-10">
+              <p class=" mb-10">
                 Responsible for the content according § 55 Abs. 2 RStV
                 <br />
                 Notice according to the Online Dispute Settlement Regulation
               </p>
 
-              <p class="text-white mb-10">
+              <p class=" mb-10">
                 Under applicable law, we are required to inform consumers of the
                 existence of the European Online Dispute Resolution platform,
                 which can be used to resolve disputes without having to go to
@@ -83,24 +81,24 @@
                 above e-mail and phone number.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Notice in accordance with the Consumer Dispute Settlement Act
                 (VSBG)
               </h2>
 
-              <p class="text-white mb-10">
+              <p class=" mb-10">
                 We are not willing and obliged to participate in dispute
                 resolution proceedings before a consumer arbitration board.
               </p>
 
-              <h1 class="text-white text-2xl font-bold text-start mb-5">
+              <h1 class=" text-2xl font-bold text-start mb-5">
                 Disclaimer - legal notice
               </h1>
-              <h1 class="text-white text-xl font-bold text-start mb-3 ml-2">
+              <h1 class=" text-xl font-bold text-start mb-3 ml-2">
                 § 1 Content warning
               </h1>
 
-              <p class="text-white mb-3 ml-2">
+              <p class=" mb-3 ml-2">
                 The free and freely accessible content of this website has been
                 created with the greatest possible care, but the provider of
                 this website does not guarantee the accuracy and timeliness of
@@ -113,10 +111,10 @@
                 the provider to be legally bound.
               </p>
 
-              <h1 class="text-white text-xl font-bold text-start mb-3 ml-2">
+              <h1 class=" text-xl font-bold text-start mb-3 ml-2">
                 § 2 External Links
               </h1>
-              <p class="text-white mb-3 ml-2">
+              <p class=" mb-3 ml-2">
                 This website contains links to third-party websites ("external
                 links"). These websites are subject to the liability of the
                 respective operators. When the external links were first
@@ -132,10 +130,10 @@
                 immediately.
               </p>
 
-              <h1 class="text-white text-xl font-bold text-start mb-3 ml-2">
+              <h1 class=" text-xl font-bold text-start mb-3 ml-2">
                 § 3 Copyrights and ancillary copyrights
               </h1>
-              <p class="text-white mb-3 ml-2">
+              <p class=" mb-3 ml-2">
                 The content published on this website is subject to German
                 copyright and ancillary copyright law. Any use not permitted by
                 German copyright and ancillary copyright law requires the prior
@@ -151,10 +149,10 @@
                 external frames is only permitted with written permission.
               </p>
 
-              <h1 class="text-white text-xl font-bold text-start mb-3 ml-2">
+              <h1 class=" text-xl font-bold text-start mb-3 ml-2">
                 § 4 Special conditions of use
               </h1>
-              <p class="text-white mb-3 ml-2">
+              <p class=" mb-3 ml-2">
                 Insofar as special conditions for individual uses of this
                 website deviate from the aforementioned paragraphs, this will be
                 expressly pointed out at the appropriate place. In this case,
@@ -167,38 +165,42 @@
 
         <aside class="hidden lg:block relative fixed w-1/4 ml-4">
           <div
-            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
+            class="w-full border border-gray-300 dark:border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer sm:hover:shadow-lg dark:sm:hover:bg-secondary transition ease-out duration-100"
           >
             <a
               href="/donation"
               class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
             >
               <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">
+                <h2 class="text-start text-xl font-semibold ml-3">
                   Sponsor Us
                 </h2>
-                <ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
+                <ArrowLogo
+                  class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
+                />
               </div>
-              <span class="text-white p-3 ml-3 mr-3">
+              <span class=" p-3 ml-3 mr-3">
                 Learn more about why we're doing this here
               </span>
             </a>
           </div>
 
           <div
-            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
+            class="w-full border border-gray-300 dark:border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer sm:hover:shadow-lg dark:sm:hover:bg-secondary transition ease-out duration-100"
           >
             <a
               href="/contact"
               class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
             >
               <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">
+                <h2 class="text-start text-xl font-semibold ml-3">
                   Contact Us
                 </h2>
-                <ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
+                <ArrowLogo
+                  class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
+                />
               </div>
-              <span class="text-white p-3 ml-3 mr-3">
+              <span class=" p-3 ml-3 mr-3">
                 Let me know if you need something
               </span>
             </a>
diff --git a/src/routes/newsletter/+page.svelte b/src/routes/newsletter/+page.svelte
index 8fd9c0ca..18d0bc08 100644
--- a/src/routes/newsletter/+page.svelte
+++ b/src/routes/newsletter/+page.svelte
@@ -10,7 +10,9 @@
   description="Stay ahead in the market with our pro newsletter! Get the latest updates, trends, and insights delivered straight to your inbox."
 />
 
-<div class="w-full max-w-7xl min-h-screen text-white m-auto mt-5 mb-40">
+<div
+  class="w-full max-w-7xl min-h-screen text-muted dark:text-white m-auto mt-5 mb-40"
+>
   <main
     id="main"
     class="mx-auto max-w-screen-lg space-x-20 p-6 md:flex md:p-10"
diff --git a/src/routes/privacy-policy/+page.svelte b/src/routes/privacy-policy/+page.svelte
index 0b9ef619..9253a660 100644
--- a/src/routes/privacy-policy/+page.svelte
+++ b/src/routes/privacy-policy/+page.svelte
@@ -10,12 +10,12 @@
 />
 
 <section
-  class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden pb-20 pt-5 px-4 lg:px-3"
+  class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden pb-20 pt-5 px-4 lg:px-3 text-muted dark:text-white"
 >
   <div class="text-sm sm:text-[1rem] breadcrumbs">
     <ul>
-      <li><a href="/" class="text-gray-300">Home</a></li>
-      <li class="text-gray-300">Privacy Policy</li>
+      <li><a href="/" class="text-muted dark:text-gray-300">Home</a></li>
+      <li class="text-muted dark:text-gray-300">Privacy Policy</li>
     </ul>
   </div>
 
@@ -26,18 +26,16 @@
       >
         <main class="w-full lg:w-3/4 lg:pr-5">
           <div class="mb-6 border-b-[2px]">
-            <h1 class="mb-1 text-white text-2xl sm:text-3xl font-bold">
-              Privacy Policy
-            </h1>
+            <h1 class="mb-1 text-2xl sm:text-3xl font-bold">Privacy Policy</h1>
           </div>
 
-          <div class="w-full bg-default m-auto">
+          <div class="w-full m-auto">
             <div class="">
-              <p class="text-gray-200 italic mb-2 text-sm">
+              <p class="text-muted dark:text-gray-200 italic mb-2 text-sm">
                 Last updated: 22.06.2023
               </p>
 
-              <p class="text-white mb-10">
+              <p class=" mb-10">
                 Stocknear (the "website" or "site") is committed to protecting
                 your privacy. This Privacy Policy explains the types of
                 information we collect from you, how we use it, and the
@@ -45,7 +43,7 @@
                 policy in its entirety along with our
                 <a
                   href="/terms-of-use"
-                  class="text-blue-400 sm:hover:underline sm:hover:text-white"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                   >Terms of use</a
                 >. Generally, you may use our website without providing personal
                 data. When personal data (such as your name, address, or email
@@ -60,11 +58,9 @@
                 the event of such misuse.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
-                Cookies
-              </h2>
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">Cookies</h2>
 
-              <p class="text-white mb-10">
+              <p class=" mb-10">
                 Our website utilizes cookies to enhance your browsing
                 experience. By visiting stocknear.com, you consent to our use of
                 cookies in accordance with our Privacy Policy. Cookies enable us
@@ -72,11 +68,11 @@
                 functionality of specific sections of our site.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Links to Other Sites
               </h2>
 
-              <div class="text-white mb-10">
+              <div class=" mb-10">
                 Our Service may include links to third-party websites that are
                 not under our control. When you click on a third-party link, you
                 will be directed to their site. We strongly encourage you to
@@ -85,11 +81,11 @@
                 policies of these external sites.
               </div>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Security of Data
               </h2>
 
-              <div class="text-white mb-10">
+              <div class=" mb-10">
                 We prioritize the security of your data; however, please be
                 aware that no method of Internet transmission or electronic
                 storage is entirely secure. While we employ commercially
@@ -97,12 +93,12 @@
                 guarantee its absolute security.
               </div>
 
-              <h2 class="text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class=" text-2xl sm:text-3xl font-bold mb-3">
                 Your Data Protection Rights Under General Data Protection
                 Regulation (GDPR)
               </h2>
 
-              <div class="text-white mb-10">
+              <div class=" mb-10">
                 If you reside in the European Union (EU) or the European
                 Economic Area (EEA), you have specific data protection rights
                 under the GDPR. We strive to enable you to review, correct,
@@ -111,7 +107,7 @@
                 wish to have it removed from our systems, please contact us at
                 <a
                   href={`mailto:${emailAddress}`}
-                  class="text-blue-400 hover:text-white hover:underline"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                   >{emailAddress}</a
                 >.<br /><br />
                 In addition, you have the following rights:
@@ -149,12 +145,12 @@
                 details, please contact the relevant authority in your region.
               </div>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Your Data Protection Rights under the California Privacy
                 Protection Act (CalOPPA)
               </h2>
 
-              <div class="text-white mb-10">
+              <div class=" mb-10">
                 CalOPPA is the first state law in the United States requiring
                 commercial websites and online services to post a privacy
                 policy. This law applies to any entity collecting personally
@@ -178,7 +174,7 @@
                     at
                     <a
                       href={`mailto:${emailAddress}`}
-                      class="text-blue-400 hover:text-white hover:underline"
+                      class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                       >{emailAddress}</a
                     >.
                   </li>
@@ -189,11 +185,11 @@
                 or use advertising technologies.
               </div>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Children's Privacy
               </h2>
 
-              <div class="text-white mb-10">
+              <div class=" mb-10">
                 Our Services are not intended for children under the age of 18.
                 We do not knowingly collect personally identifiable information
                 from individuals under 18. If you become aware that a child has
@@ -203,11 +199,11 @@
                 that information from our servers.
               </div>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Changes to this Privacy Policy
               </h2>
 
-              <div class="text-white mb-10">
+              <div class=" mb-10">
                 We reserve the right to modify this Privacy Policy at any time.
                 Any changes will be communicated by posting the updated policy
                 on this page. We recommend that you review this Privacy Policy
@@ -220,38 +216,42 @@
 
         <aside class="hidden lg:block relative fixed w-1/4 ml-4">
           <div
-            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
+            class="w-full border border-gray-300 dark:border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer sm:hover:shadow-lg dark:sm:hover:bg-secondary transition ease-out duration-100"
           >
             <a
               href="/donation"
               class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
             >
               <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">
+                <h2 class="text-start text-xl font-semibold ml-3">
                   Sponsor Us
                 </h2>
-                <ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
+                <ArrowLogo
+                  class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
+                />
               </div>
-              <span class="text-white p-3 ml-3 mr-3">
+              <span class=" p-3 ml-3 mr-3">
                 Learn more about why we're doing this here
               </span>
             </a>
           </div>
 
           <div
-            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
+            class="w-full border border-gray-300 dark:border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer sm:hover:shadow-lg dark:sm:hover:bg-secondary transition ease-out duration-100"
           >
             <a
               href="/contact"
               class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
             >
               <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">
+                <h2 class="text-start text-xl font-semibold ml-3">
                   Contact Us
                 </h2>
-                <ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
+                <ArrowLogo
+                  class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
+                />
               </div>
-              <span class="text-white p-3 ml-3 mr-3">
+              <span class=" p-3 ml-3 mr-3">
                 Let me know if you need something
               </span>
             </a>
diff --git a/src/routes/reddit-tracker/+page.svelte b/src/routes/reddit-tracker/+page.svelte
index 6581381b..b427a87b 100644
--- a/src/routes/reddit-tracker/+page.svelte
+++ b/src/routes/reddit-tracker/+page.svelte
@@ -261,12 +261,12 @@
 />
 
 <section
-  class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden min-h-screen pb-20 pt-5 px-4 lg:px-3"
+  class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden min-h-screen pb-20 pt-5 px-4 lg:px-3 text-muted dark:text-white"
 >
   <div class="text-sm sm:text-[1rem] breadcrumbs">
     <ul>
-      <li><a href="/" class="text-gray-300">Home</a></li>
-      <li class="text-gray-300">Reddit Tracker</li>
+      <li><a href="/" class="text-muted dark:text-gray-300">Home</a></li>
+      <li class="text-muted dark:text-gray-300">Reddit Tracker</li>
     </ul>
   </div>
 
@@ -277,7 +277,7 @@
       >
         <main class="w-full lg:w-3/4 lg:pr-5">
           <div class="mb-6 border-b-[2px]">
-            <h1 class="mb-1 text-white text-2xl sm:text-3xl font-bold">
+            <h1 class="mb-1 text-2xl sm:text-3xl font-bold">
               Wallsteetbets Tracker
             </h1>
           </div>
@@ -293,7 +293,7 @@
                   <Card.Description class="text-gray-300 text-sm pb-2"
                     >Number of Posts in the last 24 hours:</Card.Description
                   >
-                  <Card.Description class="text-white text-[1rem] pb-2"
+                  <Card.Description class=" text-[1rem] pb-2"
                     ><span class="text-[#408FFF] font-bold text-2xl">
                       +{postList?.at(-1)}
                     </span> posts today
@@ -322,7 +322,7 @@
                   <Card.Description class="text-gray-300 text-sm pb-2"
                     >Number of Comments in the last 24 hours:</Card.Description
                   >
-                  <Card.Description class="text-white text-[1rem] pb-2"
+                  <Card.Description class=" text-[1rem] pb-2"
                     ><span class="text-[#F71F4F] font-bold text-2xl">
                       +{abbreviateNumber(commentList?.at(-1))}
                     </span> comments today
@@ -348,9 +348,7 @@
               </Card.Root>
             </div>
 
-            <div
-              class="mt-10 grid gap-4 md:gap-8 grid-cols-1 text-start text-white"
-            >
+            <div class="mt-10 grid gap-4 md:gap-8 grid-cols-1 text-start">
               <Lazy>
                 <div class="order-1 overflow-x-auto h-full mt-5 sm:mt-0">
                   <div class="flex flex-row items-center">
@@ -371,13 +369,13 @@
                   <div class="">
                     {#each data?.getRedditTracker?.posts as item}
                       <div
-                        class="flex flex-col items-start mb-3 p-3 border border-gray-800 rounded-md bg-[#141417]"
+                        class="flex flex-col items-start mb-3 p-3 border border-gray-300 dark:border-gray-800 rounded-md shadow-sm border-gray-200 dark:bg-[#141417]"
                       >
                         <a
                           href={"https://www.reddit.com" + item?.permalink}
                           rel="noopener noreferrer"
                           target="_blank"
-                          class="text-[1rem] sm:text-xl font-semibold mb-3 transition duration-100 text-white sm:hover:text-blue-400"
+                          class="text-[1rem] sm:text-xl font-semibold mb-3 transition duration-100 sm:hover:text-blue-500 dark:sm:hover:text-blue-400"
                         >
                           {item?.title}
                         </a>
@@ -446,7 +444,7 @@
                             href={"https://www.reddit.com/user/" + item?.author}
                             rel="noopener noreferrer"
                             target="_blank"
-                            class="hidden sm:inline-block text-sm text-white sm:hover:text-blue-400"
+                            class="hidden sm:inline-block text-sm sm:hover:text-blue-500 dark:sm:hover:text-blue-400"
                           >
                             Posted by {item?.author}
                           </a>
@@ -454,7 +452,7 @@
                             href={"https://www.reddit.com" + item?.permalink}
                             rel="noopener noreferrer"
                             target="_blank"
-                            class="mt-2 sm:mt-0 text-sm text-white sm:hover:text-blue-400"
+                            class="mt-2 sm:mt-0 text-sm sm:hover:text-blue-500 dark:sm:hover:text-blue-400"
                           >
                             {formatUtcTimestamp(item?.created_utc)}
                             <Link
@@ -478,31 +476,33 @@
                       >Updated {formattedDate}</span
                     >
                   </div>
-                  <nav class="border-b-[2px] overflow-x-auto whitespace-nowrap">
+                  <nav
+                    class="border-[#2C6288] dark:border-white border-b-[2px] overflow-x-auto whitespace-nowrap"
+                  >
                     <ul
-                      class="flex flex-row items-center w-full text-sm sm:text-[1rem] text-white"
+                      class="flex flex-row items-center w-full text-sm sm:text-[1rem]"
                     >
                       {#each tabs as item, index}
                         {#if ["Pro", "Plus"]?.includes(data?.user?.tier) || index === 0}
                           <label
                             on:click={() => changeTimePeriod(index)}
                             class="p-2 px-5 cursor-pointer {activeIdx === index
-                              ? 'text-white bg-primary/90'
-                              : 'text-gray-400 sm:hover:text-white sm:hover:bg-primary/90'}"
+                              ? 'text-muted dark:text-white bg-[#EEEEEE] dark:bg-primary/90 font-semibold'
+                              : 'text-blue-500 dark:text-gray-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:bg-[#EEEEEE] dark:sm:hover:bg-primary/90'}"
                           >
                             {item.title}
                           </label>
                         {:else if !["Pro", "Plus"]?.includes(data?.user?.tier)}
                           <a
                             href="/pricing"
-                            class="flex flex-row items-center p-2 px-5 cursor-pointer {activeIdx ===
+                            class="p-2 px-5 cursor-pointer flex flex-row items-center {activeIdx ===
                             index
-                              ? 'text-white bg-primary/90'
-                              : 'text-gray-400 sm:hover:text-white sm:hover:bg-primary/90'}"
+                              ? 'text-muted dark:text-white bg-[#EEEEEE] dark:bg-primary/90 font-semibold'
+                              : 'text-blue-500 dark:text-gray-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:bg-[#EEEEEE] dark:sm:hover:bg-primary/90'}"
                           >
                             <span class="">{item.title}</span>
                             <svg
-                              class="ml-2 w-3.5 h-3.5"
+                              class="ml-2 w-3.5 h-3.5 inline-block"
                               xmlns="http://www.w3.org/2000/svg"
                               viewBox="0 0 24 24"
                               ><path
@@ -520,34 +520,29 @@
                   <Table.Root class="overflow-x-auto w-full">
                     <Table.Header>
                       <Table.Row>
-                        <Table.Head class="text-white text-sm font-semibold"
+                        <Table.Head class=" text-sm font-semibold"
                           >Rank</Table.Head
                         >
-                        <Table.Head class="text-white text-sm font-semibold"
+                        <Table.Head class=" text-sm font-semibold"
                           >Symbol</Table.Head
                         >
-                        <Table.Head
-                          class="text-white text-sm font-semibold text-end"
+                        <Table.Head class=" text-sm font-semibold text-end"
                           >Mentions</Table.Head
                         >
-                        <Table.Head
-                          class="text-white text-sm font-semibold text-end"
+                        <Table.Head class=" text-sm font-semibold text-end"
                           >Calls</Table.Head
                         >
-                        <Table.Head
-                          class="text-white text-sm font-semibold text-end"
+                        <Table.Head class=" text-sm font-semibold text-end"
                           >Puts</Table.Head
                         >
-                        <Table.Head
-                          class="text-white text-sm font-semibold text-end"
+                        <Table.Head class=" text-sm font-semibold text-end"
                           >Sentiment</Table.Head
                         >
-                        <Table.Head
-                          class="text-white text-sm font-semibold text-end"
+                        <Table.Head class=" text-sm font-semibold text-end"
                           >Price</Table.Head
                         >
                         <Table.Head
-                          class="text-white text-sm text-right whitespace-nowrap"
+                          class=" text-sm text-right  font-semibold whitespace-nowrap"
                           >% Change</Table.Head
                         >
                       </Table.Row>
@@ -564,9 +559,7 @@
                                 symbol={item?.symbol}
                                 assetType={item?.assetType}
                               />
-                              <span
-                                class="text-white whitespace-wrap hidden sm:block"
-                              >
+                              <span class="whitespace-wrap hidden sm:block">
                                 {item?.name}
                               </span>
                             </div>
@@ -575,19 +568,19 @@
                             >{item?.count}</Table.Cell
                           >
                           <Table.Cell
-                            class="text-right text-[1rem] text-[#00FC50]"
+                            class="text-right text-[1rem] text-green-600 dark:text-[#00FC50]"
                             >{item?.call}</Table.Cell
                           >
                           <Table.Cell
-                            class="text-right text-[1rem] text-[#FF2F1F]"
+                            class="text-right text-[1rem] text-red-600 dark:text-[#FF2F1F]"
                             >{item?.put}</Table.Cell
                           >
                           <Table.Cell
                             class="text-right text-[1rem] {item?.avgSentiment >
                             0.4
-                              ? 'text-[#00FC50]'
+                              ? 'text-green-600 dark:text-[#00FC50]'
                               : item?.avgSentiment < -0.1
-                                ? 'text-[#FF2F1F]'
+                                ? 'text-red-600 dark:text-[#FF2F1F]'
                                 : 'text-[#C6A755]'} "
                             >{item?.avgSentiment > 0.4
                               ? "Bullish"
@@ -596,15 +589,15 @@
                                 : "Neutral"}</Table.Cell
                           >
 
-                          <Table.Cell class="text-right text-[1rem] text-white"
+                          <Table.Cell class="text-right text-[1rem] "
                             >{item?.price?.toFixed(2)}</Table.Cell
                           >
 
                           <Table.Cell class="text-right text-[1rem] ">
                             <span
                               class="{item?.changesPercentage > 0
-                                ? 'text-[#00FC50]'
-                                : 'text-[#FF2F1F]'} text-end"
+                                ? 'text-green-600 dark:text-[#00FC50]'
+                                : 'text-red-600 dark:text-[#FF2F1F]'} text-end"
                             >
                               {#if item?.changesPercentage > 0}
                                 +{item?.changesPercentage?.toFixed(2)}%
@@ -636,38 +629,42 @@
 
         <aside class="hidden lg:block relative fixed w-1/4 ml-4">
           <div
-            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
+            class="w-full border border-gray-300 dark:border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer sm:hover:shadow-lg dark:sm:hover:bg-secondary transition ease-out duration-100"
           >
             <a
               href="/potus-tracker"
               class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
             >
               <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">
+                <h2 class="text-start text-xl font-semibold ml-3">
                   POTUS Tracker
                 </h2>
-                <ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
+                <ArrowLogo
+                  class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
+                />
               </div>
-              <span class="text-white p-3 ml-3 mr-3">
+              <span class=" p-3 ml-3 mr-3">
                 Follow the latest executive orders of the US President
               </span>
             </a>
           </div>
 
           <div
-            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
+            class="w-full border border-gray-300 dark:border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer sm:hover:shadow-lg dark:sm:hover:bg-secondary transition ease-out duration-100"
           >
             <a
               href="/insider-tracker"
               class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
             >
               <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">
+                <h2 class="text-start text-xl font-semibold ml-3">
                   Insider Tracker
                 </h2>
-                <ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
+                <ArrowLogo
+                  class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
+                />
               </div>
-              <span class="text-white p-3 ml-3 mr-3">
+              <span class=" p-3 ml-3 mr-3">
                 Get the latest unusual insider trading in realtime
               </span>
             </a>
diff --git a/src/routes/terms-of-use/+page.svelte b/src/routes/terms-of-use/+page.svelte
index 8f32e643..18da7757 100644
--- a/src/routes/terms-of-use/+page.svelte
+++ b/src/routes/terms-of-use/+page.svelte
@@ -6,12 +6,12 @@
 <SEO title="Terms of Use" description="" />
 
 <section
-  class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden pb-20 pt-5 px-4 lg:px-3"
+  class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden pb-20 pt-5 px-4 lg:px-3 text-muted dark:text-white"
 >
   <div class="text-sm sm:text-[1rem] breadcrumbs">
     <ul>
-      <li><a href="/" class="text-gray-300">Home</a></li>
-      <li class="text-gray-300">Terms of Use</li>
+      <li><a href="/" class="text-muted dark:text-gray-300">Home</a></li>
+      <li class="text-muted dark:text-gray-300">Terms of Use</li>
     </ul>
   </div>
 
@@ -22,34 +22,32 @@
       >
         <main class="w-full lg:w-3/4 lg:pr-5">
           <div class="mb-6 border-b-[2px]">
-            <h1 class="mb-1 text-white text-2xl sm:text-3xl font-bold">
-              Terms of Use
-            </h1>
+            <h1 class="mb-1 text-2xl sm:text-3xl font-bold">Terms of Use</h1>
           </div>
 
-          <div class=" w-full bg-default m-auto">
+          <div class=" w-full m-auto">
             <div class="">
-              <p class="text-gray-200 italic mb-2 text-sm">
+              <p class="dark:text-gray-200 italic mb-2 text-sm">
                 Last updated: 28.02.2025
               </p>
 
-              <p class="text-white mb-10">
+              <p class=" mb-10">
                 Kindly review these Terms and Conditions carefully before using
                 this website. By accessing or using this site, you agree to be
                 bound by these Terms as well as our
                 <a
                   href="/privacy-policy"
-                  class="text-blue-400 hover:text-white hover:underline"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                   >Privacy Policy</a
                 >. Stocknear reserves the right to modify these Terms at any
                 time.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 No Investment Advice Provided by Stocknear
               </h2>
 
-              <p class="text-white mb-10">
+              <p class=" mb-10">
                 The information presented on this website is intended solely for
                 educational purposes. Before making any investment or financial
                 decisions, we strongly recommend that you consult with a
@@ -75,11 +73,11 @@
                 PROVIDED.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Accuracy of Data Not Guaranteed
               </h2>
 
-              <p class="text-white mb-10">
+              <p class=" mb-10">
                 Our stock data is aggregated from a variety of sources. While we
                 make every effort to ensure its accuracy, we cannot guarantee
                 that all information is current or error-free. We recommend that
@@ -87,21 +85,21 @@
                 filings, prior to making investment decisions.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Use of Our Content
               </h2>
 
-              <p class="text-white mb-10">
+              <p class=" mb-10">
                 Republishing our content in its entirety without our explicit
                 permission is prohibited. You may, however, use brief excerpts
                 provided they remain unaltered and proper attribution is given.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Liability Limitations
               </h2>
 
-              <p class="text-white mb-10">
+              <p class=" mb-10">
                 Neither Stocknear nor its authors shall be liable for any
                 damages arising from the use of this website's content. Although
                 we strive for accuracy and completeness, we cannot warrant the
@@ -116,11 +114,11 @@
                 act promptly.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Copyright
               </h2>
 
-              <p class="text-white mb-10">
+              <p class=" mb-10">
                 All content and materials created by the site operators are
                 protected under German copyright law. Any reproduction,
                 modification, distribution, or other form of exploitation beyond
@@ -138,7 +136,7 @@
                 us at
                 <a
                   href="mailto:contact@stocknear.com"
-                  class="text-blue-400 hover:text-white hover:underline"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                   >contact@stocknear.com</a
                 >
                 using the subject line "Copyright Infringement" and provide a detailed
@@ -149,15 +147,15 @@
                 Some images on this site are provided courtesy of
                 <a
                   href="https://de.freepik.com/"
-                  class="text-blue-400 sm:hover:text-white">FreePik</a
+                  class="text-blue-400 sm:hover:">FreePik</a
                 >.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Subscriptions
               </h2>
 
-              <p class="text-white mb-10">
+              <p class=" mb-10">
                 We may offer subscription services via Lemon Squeezy. Specific
                 terms related to subscriptions will be presented at the time of
                 purchase, and by subscribing, you agree to those terms.<br /><br
@@ -169,7 +167,7 @@
                 Settings or by contacting us at
                 <a
                   href="mailto:support@stocknear.com"
-                  class="text-blue-400 hover:text-white hover:underline"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                   >support@stocknear.com</a
                 >.<br /><br />
                 If you are not completely satisfied with your subscription, you may
@@ -177,11 +175,11 @@
                 requests made after 30 days will not be eligible.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Changes to Pricing and Service Plans
               </h2>
 
-              <p class="text-white mb-10">
+              <p class=" mb-10">
                 From time to time, we may adjust the pricing of our subscription
                 plans to reflect changes in operational costs, including
                 production, licensing, distribution, customer support,
@@ -193,11 +191,11 @@
                 during the notice period to avoid future charges.
               </p>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Lifetime Access
               </h2>
 
-              <div class="text-white mb-10">
+              <div class=" mb-10">
                 Lifetime access grants you the right to use our Services for as
                 long as they are provided by Stocknear.<br /><br />
                 While Stocknear is committed to offering its Services for the foreseeable
@@ -206,11 +204,11 @@
                 consequently terminate.
               </div>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Termination
               </h2>
 
-              <div class="text-white mb-10">
+              <div class=" mb-10">
                 We reserve the right to suspend or terminate your account and
                 deny access to the Service at any time, without prior notice,
                 for any reason, including but not limited to breaches of these
@@ -223,11 +221,11 @@
                 limitations, will remain in effect.
               </div>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Amendments to Terms
               </h2>
 
-              <div class="text-white mb-10">
+              <div class=" mb-10">
                 We may amend these Terms at any time by posting updated versions
                 on this site. It is your responsibility to review these Terms
                 periodically. Your continued use of the Platform following any
@@ -236,11 +234,11 @@
                 the Service.
               </div>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Data Disclaimer
               </h2>
 
-              <div class="text-white mb-10">
+              <div class=" mb-10">
                 All data provided on this website is offered solely for
                 informational purposes and should not be the exclusive basis for
                 any trading or investment decisions.<br /><br />
@@ -249,26 +247,26 @@
                 our contact form or email us directly at
                 <a
                   href="mailto:support@stocknear.com"
-                  class="text-blue-400 hover:text-white hover:underline"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                   >support@stocknear.com</a
                 >.
               </div>
 
-              <h2 class="mb-1 text-white text-2xl sm:text-3xl font-bold mb-3">
+              <h2 class="mb-1 text-2xl sm:text-3xl font-bold mb-3">
                 Complete Agreement
               </h2>
 
-              <p class="text-white mb-10">
+              <p class=" mb-10">
                 These Terms and Conditions, together with our
                 <a
                   href="/privacy-policy"
-                  class="text-blue-400 hover:text-white hover:underline"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                   >Privacy Policy</a
                 >
                 and
                 <a
                   href="/imprint"
-                  class="text-blue-400 hover:text-white hover:underline"
+                  class="text-blue-500 dark:text-blue-400 sm:hover:text-muted dark:sm:hover:text-white sm:hover:underline"
                   >Imprint</a
                 >, constitute the entire agreement between you and Stocknear.
                 <br /><br />
@@ -281,38 +279,42 @@
 
         <aside class="hidden lg:block relative fixed w-1/4 ml-4">
           <div
-            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
+            class="w-full border border-gray-300 dark:border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer sm:hover:shadow-lg dark:sm:hover:bg-secondary transition ease-out duration-100"
           >
             <a
               href="/donation"
               class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
             >
               <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">
+                <h2 class="text-start text-xl font-semibold ml-3">
                   Sponsor Us
                 </h2>
-                <ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
+                <ArrowLogo
+                  class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
+                />
               </div>
-              <span class="text-white p-3 ml-3 mr-3">
+              <span class=" p-3 ml-3 mr-3">
                 Learn more about why we're doing this here
               </span>
             </a>
           </div>
 
           <div
-            class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-inherit sm:hover:bg-secondary transition ease-out duration-100"
+            class="w-full border border-gray-300 dark:border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer sm:hover:shadow-lg dark:sm:hover:bg-secondary transition ease-out duration-100"
           >
             <a
               href="/contact"
               class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
             >
               <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">
+                <h2 class="text-start text-xl font-semibold ml-3">
                   Contact Us
                 </h2>
-                <ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
+                <ArrowLogo
+                  class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
+                />
               </div>
-              <span class="text-white p-3 ml-3 mr-3">
+              <span class=" p-3 ml-3 mr-3">
                 Let me know if you need something
               </span>
             </a>