add marketcap to dashboard

src/routes/+page.svelte

@@ -100,7 +100,7 @@
     Feedback = (await import("$lib/components/Feedback.svelte")).default;
   });
 
-  $: charNumber = $screenWidth < 640 ? 20 : 20;
+  $: charNumber = $screenWidth < 640 ? 20 : 15;
 </script>
 
 <svelte:head>
@@ -276,6 +276,10 @@
                     <Table.Head class="text-white text-right font-semibold"
                       >Change</Table.Head
                     >
+                    <Table.Head
+                      class="text-white text-right font-semibold whitespace-nowrap"
+                      >Market Cap</Table.Head
+                    >
                   </Table.Row>
                 </Table.Header>
                 <Table.Body>
@@ -313,6 +317,11 @@
                           </span>
                         {/if}
                       </Table.Cell>
+                      <Table.Cell
+                        class="text-right xl:table.-column text-sm sm:text-[1rem]"
+                      >
+                        {abbreviateNumber(item?.marketCap)}
+                      </Table.Cell>
                     </Table.Row>
                   {/each}
                 </Table.Body>
@@ -369,6 +378,10 @@
                     <Table.Head class="text-white text-right font-semibold"
                       >Change</Table.Head
                     >
+                    <Table.Head
+                      class="text-white text-right font-semibold whitespace-nowrap"
+                      >Market Cap</Table.Head
+                    >
                   </Table.Row>
                 </Table.Header>
                 <Table.Body>
@@ -406,6 +419,11 @@
                           </span>
                         {/if}
                       </Table.Cell>
+                      <Table.Cell
+                        class="text-right xl:table.-column text-sm sm:text-[1rem]"
+                      >
+                        {abbreviateNumber(item?.marketCap)}
+                      </Table.Cell>
                     </Table.Row>
                   {/each}
                 </Table.Body>

src/routes/about/+page.server.ts

@@ -1,4 +1,7 @@
-export const load = async () => {
+export const load = async ({setHeaders}) => {
+
+      setHeaders({ "cache-control": "public, max-age=60*15" });
+
   const getFrontendStars = async () => {
     // make the POST request to the endpoint
     const response = await fetch(

src/routes/analysts/top-stocks/+page.svelte

@@ -59,7 +59,7 @@
 </svelte:head>
 
 <section
-  class="w-full max-w-3xl sm:max-w-screen-2xl overflow-hidden min-h-screen pt-5 px-4 lg:px-3"
+  class="w-full max-w-3xl sm:max-w-screen-2xl overflow-hidden min-h-screen pb-20 pt-5 px-4 lg:px-3"
 >
   <div class="text-sm sm:text-[1rem] breadcrumbs">
     <ul>