From 2d56d743e01d331a4b1d50a8355cceed67ddd122 Mon Sep 17 00:00:00 2001
From: MuslemRahimi <moslem_rahimi@hotmail.de>
Date: Mon, 2 Sep 2024 16:42:53 +0200
Subject: [PATCH] ui fixes

---
 src/routes/dividends-calendar/+page.svelte    | 15 ++++++++-------
 src/routes/earnings-calendar/+page.svelte     | 14 +++++++-------
 src/routes/economic-calendar/+page.svelte     | 15 ++++++++-------
 src/routes/market-mover/+page.svelte          |  2 +-
 src/routes/stock-splits-calendar/+page.svelte | 13 +++++++------
 5 files changed, 31 insertions(+), 28 deletions(-)

diff --git a/src/routes/dividends-calendar/+page.svelte b/src/routes/dividends-calendar/+page.svelte
index f3e46de3..c6381e89 100644
--- a/src/routes/dividends-calendar/+page.svelte
+++ b/src/routes/dividends-calendar/+page.svelte
@@ -337,14 +337,14 @@ $: {
                 {#each weekday as day,index}
                 
                 <div class="w-full {index === selectedWeekday ? '' : 'hidden sm:block'}">
-                        <label on:click={() => toggleDate(index)} class="w-11/12 m-auto sm:w-full cursor-pointer h-16 {index === selectedWeekday ? 'bg-[#27272A]' : ''} rounded-lg sm:rounded-none flex bg-[#09090B] border border-gray-600 mb-3">
+                        <label on:click={() => toggleDate(index)} class="w-11/12 m-auto sm:w-full cursor-pointer h-16 {index === selectedWeekday ? 'bg-purple-600 sm:hover:bg-purple-700' : ''} rounded-lg sm:rounded-none flex bg-[#09090B] sm:hover:bg-purple-600 transition duration-50 border border-gray-600 mb-3">
                           <div class=" flex flex-row justify-center items-center w-full ">
                             <label on:click={() => clickWeekday('previous', index) } class="{previousMax === true && index === 0? 'opacity-20' : ''} sm:hidden ml-auto">
                               <svg class="w-8 h-8 inline-block rotate-180 " xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M8.025 22L6.25 20.225L14.475 12L6.25 3.775L8.025 2l10 10l-10 10Z"/></svg>
                             </label>
-                            <div class="flex flex-col text-white truncate m-auto p-1">
-                              <span class="font-medium text-md">{formattedWeekday[index]}</span>
-                              <span class="text-sm m-auto pt-1 pb-1"> {day.length} Earnings</span>
+                            <div class="flex flex-col items-center text-white truncate m-auto p-1">
+                              <span class="font-medium text-[1rem]">{formattedWeekday[index]}</span>
+                              <span class="text-[1rem] sm:text-sm m-auto pt-1 pb-1"> {day?.length} Earnings</span>
                             </div>
                             <label on:click={() => clickWeekday('next', index) } class="{nextMax === true && index === 4? 'opacity-20' : ''} sm:hidden mr-auto">
                               <svg class="w-8 h-8 inline-block" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M8.025 22L6.25 20.225L14.475 12L6.25 3.775L8.025 2l10 10l-10 10Z"/></svg>
@@ -416,9 +416,10 @@ $: {
 
   
                       {:else}
-                      <h2 class=" mt-20 justify-center items-center text-3xl font-bold text-slate-700 mb-5 m-auto">
-                        No data available
-                      </h2>
+                       <div class="text-white p-5 mt-5 w-fit m-auto rounded-lg sm:flex sm:flex-row sm:items-center border border-slate-800 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>
+                          No Dividends available for the day.
+                      </div>
                     {/if}
                   {/if}
                 {/each}
diff --git a/src/routes/earnings-calendar/+page.svelte b/src/routes/earnings-calendar/+page.svelte
index 3a528e06..846dae86 100644
--- a/src/routes/earnings-calendar/+page.svelte
+++ b/src/routes/earnings-calendar/+page.svelte
@@ -192,7 +192,6 @@ $: {
             // Sort and map the filtered data
             weekday[i] = dayData
               .sort((a, b) => b.marketCap - a.marketCap)
-            console.log(weekday)
           }
     
       }
@@ -335,14 +334,14 @@ $: {
             {#each weekday as day,index}
             
             <div class="w-full {index === selectedWeekday ? '' : 'hidden sm:block'}">
-                    <label on:click={() => toggleDate(index)} class="w-11/12 m-auto sm:w-full cursor-pointer h-16 {index === selectedWeekday ? 'bg-[#27272A]' : ''} rounded-lg sm:rounded-none flex bg-[#09090B] border border-gray-600 mb-3">
+                    <label on:click={() => toggleDate(index)} class="w-11/12 m-auto sm:w-full cursor-pointer h-16 {index === selectedWeekday ? 'bg-purple-600 sm:hover:bg-purple-700' : ''} rounded sm:rounded-none flex bg-[#09090B] sm:hover:bg-purple-600 transition duration-50 border border-gray-600 mb-3">
                       <div class=" flex flex-row justify-center items-center w-full ">
                         <label on:click={() => clickWeekday('previous', index) } class="{previousMax === true && index === 0? 'opacity-20' : ''} sm:hidden ml-auto">
                           <svg class="w-8 h-8 inline-block rotate-180 " xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M8.025 22L6.25 20.225L14.475 12L6.25 3.775L8.025 2l10 10l-10 10Z"/></svg>
                         </label>
-                        <div class="flex flex-col text-white truncate m-auto p-1">
+                        <div class="flex flex-col items-center text-white truncate m-auto p-1">
                           <span class="font-medium text-md">{formattedWeekday[index]}</span>
-                          <span class="text-sm m-auto pt-1 pb-1"> {day.length} Earnings</span>
+                          <span class="text-[1rem] sm:text-sm m-auto pt-1 pb-1"> {day?.length} Earnings</span>
                         </div>
                         <label on:click={() => clickWeekday('next', index) } class="{nextMax === true && index === 4? 'opacity-20' : ''} sm:hidden mr-auto">
                           <svg class="w-8 h-8 inline-block" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M8.025 22L6.25 20.225L14.475 12L6.25 3.775L8.025 2l10 10l-10 10Z"/></svg>
@@ -445,9 +444,10 @@ $: {
                 
 
                 {:else}
-                  <h2 class=" mt-20 justify-center items-center text-3xl font-bold text-slate-700 mb-5 m-auto">
-                    No data available
-                  </h2>
+                  <div class="text-white p-5 mt-5 w-fit m-auto rounded-lg sm:flex sm:flex-row sm:items-center border border-slate-800 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>
+                      No Earnings available for the day.
+                  </div>
                 {/if}
               {/if}
             {/each}
diff --git a/src/routes/economic-calendar/+page.svelte b/src/routes/economic-calendar/+page.svelte
index 97e2ed52..c8204eea 100644
--- a/src/routes/economic-calendar/+page.svelte
+++ b/src/routes/economic-calendar/+page.svelte
@@ -173,7 +173,7 @@
                     
                     
                     <div class="z-1 absolute top-0">
-                      <img class="w-20 ml-5" src={logo} alt="logo" loading="lazy">
+                      <img class="w-24 ml-5" src={logo} alt="logo" loading="lazy">
                     </div>
                   </div>
                   <!-- End Column -->
@@ -199,14 +199,14 @@
                     {#each (filterList?.length === 0 ? weekday : weekdayFiltered) as day,index}
                     
                     <div class="w-full {index === selectedWeekday ? '' : 'hidden sm:block'}">
-                            <label on:click={() => toggleDate(index)} class="w-11/12 m-auto sm:w-full cursor-pointer h-16 {index === selectedWeekday ? 'bg-[#27272A]' : ''} rounded-lg sm:rounded-none flex bg-[#09090B] border border-gray-600 mb-3">
+                            <label on:click={() => toggleDate(index)} class="w-11/12 m-auto sm:w-full cursor-pointer h-16 {index === selectedWeekday ? 'bg-purple-600 sm:hover:bg-purple-700' : ''} rounded sm:rounded-none flex bg-[#09090B] sm:hover:bg-purple-600 transition duration-50 border border-gray-600 mb-3">
                               <div class=" flex flex-row justify-center items-center w-full">
                                 <label on:click={() => clickWeekday('previous', index) } class="sm:hidden ml-auto">
                                   <svg class="w-8 h-8 inline-block rotate-180 " xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M8.025 22L6.25 20.225L14.475 12L6.25 3.775L8.025 2l10 10l-10 10Z"/></svg>
                                 </label>
-                                <div class="flex flex-col text-white truncate m-auto p-1">
+                                <div class="flex flex-col items-center text-white truncate m-auto p-1">
                                   <span class="font-medium text-md">{formattedWeekday[index]}</span>
-                                  <span class="text-sm m-auto pt-1 pb-1"> {day.length} Events</span>
+                                  <span class="text-[1rem] sm:text-sm m-auto pt-1 pb-1"> {day?.length} Events</span>
                                 </div>
                                 <label on:click={() => clickWeekday('next', index) } class="sm:hidden mr-auto">
                                   <svg class="w-8 h-8 inline-block" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M8.025 22L6.25 20.225L14.475 12L6.25 3.775L8.025 2l10 10l-10 10Z"/></svg>
@@ -358,9 +358,10 @@
    
     
                         {:else}
-                        <h2 class="m-auto mt-20 flex justify-center items-center text-3xl font-bold text-slate-700 mb-5 m-auto">
-                          No data available
-                        </h2>
+                        <div class="text-white p-5 mt-5 w-fit m-auto rounded-lg sm:flex sm:flex-row sm:items-center border border-slate-800 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>
+                          No Events available for the day.
+                        </div>
                       {/if}
                     {/if}
         {/each}
diff --git a/src/routes/market-mover/+page.svelte b/src/routes/market-mover/+page.svelte
index c21a7bbb..6a3e0b83 100644
--- a/src/routes/market-mover/+page.svelte
+++ b/src/routes/market-mover/+page.svelte
@@ -405,7 +405,7 @@ $: charNumber = $screenWidth < 640 ? 20 : 30;
               <span class="text-blue-400 font-semibold">
                 {item?.symbol}
               </span>
-              <span class="text-white text-sm font-semibold border-b-[#09090B]">
+              <span class="text-white text-sm border-b-[#09090B]">
                 {item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name}
               </span>
             </div>
diff --git a/src/routes/stock-splits-calendar/+page.svelte b/src/routes/stock-splits-calendar/+page.svelte
index 8e4bbb16..881c2fdd 100644
--- a/src/routes/stock-splits-calendar/+page.svelte
+++ b/src/routes/stock-splits-calendar/+page.svelte
@@ -348,14 +348,14 @@
                     {#each weekday as day,index}
                     
                     <div class="w-full {index === selectedWeekday ? '' : 'hidden sm:block'}">
-                            <label on:click={() => toggleDate(index)} class="w-11/12 sm:w-full m-auto  cursor-pointer h-16 {index === selectedWeekday ? 'bg-[#27272A]' : ''} rounded-lg sm:rounded-none flex bg-[#09090B] border border-gray-600 mb-3">
+                            <label on:click={() => toggleDate(index)} class="w-11/12 sm:w-full m-auto  cursor-pointer h-16 {index === selectedWeekday ? 'bg-purple-600 sm:hover:bg-purple-700' : ''} rounded sm:rounded-none flex bg-[#09090B] sm:hover:bg-purple-600 transition duration-50 border border-gray-600 mb-3">
                               <div class=" flex flex-row justify-center items-center w-full">
                                 <label on:click={() => clickWeekday('previous', index) } class="sm:hidden ml-auto">
                                   <svg class="w-8 h-8 inline-block rotate-180 " xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M8.025 22L6.25 20.225L14.475 12L6.25 3.775L8.025 2l10 10l-10 10Z"/></svg>
                                 </label>
-                                <div class="flex flex-col text-white truncate m-auto p-1">
+                                <div class="flex flex-col items-center text-white truncate m-auto p-1">
                                   <span class="font-medium text-md">{formattedWeekday[index]}</span>
-                                  <span class="text-sm m-auto pt-1 pb-1"> {day?.length > 1 ? `${day?.length} Splits` : `${day?.length} Split`}</span>
+                                  <span class="text-[1rem] sm:text-sm m-auto pt-1 pb-1"> {day?.length > 1 ? `${day?.length} Splits` : `${day?.length} Split`}</span>
                                 </div>
                                 <label on:click={() => clickWeekday('next', index) } class="sm:hidden mr-auto">
                                   <svg class="w-8 h-8 inline-block" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M8.025 22L6.25 20.225L14.475 12L6.25 3.775L8.025 2l10 10l-10 10Z"/></svg>
@@ -422,9 +422,10 @@
 
     
                         {:else}
-                        <h2 class="mt-20 flex justify-center items-center text-xl sm:text-2xl font-bold text-slate-700 mb-5 m-auto">
-                          No Splits on this date
-                        </h2>
+                        <div class="text-white p-5 mt-5 w-fit m-auto rounded-lg sm:flex sm:flex-row sm:items-center border border-slate-800 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>
+                          No Stock Splits available for the day.
+                        </div>
                       {/if}
                     {/if}
                   {/each}