remove lazy load

src/lib/components/AnalystEstimate.svelte

@@ -264,7 +264,7 @@ $: {
                 <div class="flex flex-row items-center justify-between m-auto mt-10">
                     <div class="flex flex-row items-center w-1/2 sm:w-full justify-center">
                         <div class="h-full bg-gray-800 transform -translate-x-1/2 " aria-hidden="true"></div>
-                        <div class="w-3 h-3 bg-[#00BBFF] border-4 box-content border-gray-900 rounded-full transform -translate-x-1/2" aria-hidden="true"></div>
+                        <div class="w-3 h-3 bg-[#3B82F6] border-4 box-content border-gray-900 rounded-full transform -translate-x-1/2" aria-hidden="true"></div>
                         <span class="text-white text-sm sm:text-md sm:font-medium inline-block">
                             Analyst Forecast
                         </span>

src/lib/components/BorrowedShare.svelte

@@ -8,7 +8,6 @@
   import { LineChart } from 'echarts/charts'
   import { GridComponent } from 'echarts/components'
   import { CanvasRenderer } from 'echarts/renderers'
-  import Lazy from 'svelte-lazy';
   
   export let data;
   
@@ -160,10 +159,10 @@ function findLowestAndHighestFee(data, lastDateStr) {
         {
             data: feeList,
             type: 'line',
-            areaStyle: {opacity: 0.3},
+            areaStyle: {opacity: 1},
             yAxisIndex: 1,
             itemStyle: {
-                color: '#FF9E21' // Change bar color to white
+                color: '#22C55E' // Change bar color to white
             },
             showSymbol: false
         },
@@ -259,11 +258,9 @@ function findLowestAndHighestFee(data, lastDateStr) {
         <div class="pb-2 rounded-lg bg-[#09090B]">
                 
           
-            <Lazy height={300} fadeOption={{delay: 100, duration: 500}} keep={true}>
           <div class="app w-full h-[300px] mt-5">
               <Chart {init} options={optionsData} class="chart" />
           </div>
-            </Lazy>
         
         </div>
   

src/lib/components/DarkPool.svelte

@@ -3,7 +3,6 @@
   import InfoModal from '$lib/components/InfoModal.svelte';
   import { Chart } from 'svelte-echarts'
   import { abbreviateNumber, formatDateRange } from "$lib/utils";
-  import Lazy from 'svelte-lazy';
   import { init, use } from 'echarts/core'
   import { LineChart } from 'echarts/charts'
   import { GridComponent } from 'echarts/components'
@@ -248,11 +247,9 @@ $: {
         <div class="pb-2 rounded-lg bg-[#09090B]">
                 
           
-            <Lazy height={300} fadeOption={{delay: 100, duration: 500}} keep={true}>
           <div class="app w-full h-[300px] mt-5">
               <Chart {init} options={optionsData} class="chart" />
           </div>
-            </Lazy>
         
         </div>
 
@@ -288,7 +285,7 @@ $: {
                       <td class="px-[5px] py-1.5 xs:px-2.5 xs:py-2">
                           <span>Date</span>
                       </td>
-                      <td class="px-[5px] py-1.5 text-sm sm:text[1rem] text-right font-medium xs:px-2.5 xs:py-2">
+                      <td class="px-[5px] py-1.5 text-sm sm:text-[1rem] text-right font-medium xs:px-2.5 xs:py-2">
                         { formatDateRange(rawData?.slice(-1)?.at(0)?.date)}
                       </td>
                   </tr>

src/lib/components/Enterprise.svelte

@@ -3,7 +3,6 @@
     import { enterpriseComponent, displayCompanyName, stockTicker, screenWidth, getCache, setCache} from '$lib/store';
     import InfoModal from '$lib/components/InfoModal.svelte';
     import { Chart } from 'svelte-echarts';
-    import Lazy from 'svelte-lazy';
     import { init, use } from 'echarts/core'
     import { BarChart } from 'echarts/charts'
     import { GridComponent } from 'echarts/components'
@@ -207,11 +206,9 @@ $: {
                     Full report
                 </a>
 
-                <Lazy height={300} fadeOption={{delay: 100, duration: 500}} keep={true}>
                 <div class="app w-full h-[300px] mt-5">
                     <Chart {init} options={optionsData} class="chart" />
                 </div>
-                </Lazy>
                 
                 <div class="flex flex-row items-center justify-between mx-auto mt-5 w-full sm:w-11/12">
                     <div class="mt-3.5 sm:mt-0 flex flex-col sm:flex-row items-center ml-3 sm:ml-0 w-1/2 justify-center">

src/lib/components/FailToDeliver.svelte

@@ -4,8 +4,6 @@
   import { Chart } from 'svelte-echarts'
   import { abbreviateNumber, formatDateRange } from "$lib/utils";
 
-  import Lazy from 'svelte-lazy';
-
   import { init, use } from 'echarts/core'
   import { LineChart } from 'echarts/charts'
   import { GridComponent } from 'echarts/components'
@@ -156,10 +154,10 @@ function findLowestAndHighestPrice(data, lastDateStr) {
         {
             data: failToDeliverList,
             type: 'line',
-            areaStyle: {opacity: 0.3},
+            areaStyle: {opacity: 1},
             yAxisIndex: 1,
             itemStyle: {
-                color: '#FF9E21' // Change bar color to white
+                color: '#E11D48' // Change bar color to white
             },
             showSymbol: false
         },
@@ -267,11 +265,9 @@ function findLowestAndHighestPrice(data, lastDateStr) {
         <div class="pb-2 rounded-lg bg-[#09090B]">
                 
           
-            <Lazy height={300} fadeOption={{delay: 100, duration: 500}} keep={true}>
           <div class="app w-full h-[300px] mt-5">
               <Chart {init} options={optionsData} class="chart" />
           </div>
-            </Lazy>
         
         </div>
   

src/lib/components/ImpliedVolatility.svelte

@@ -170,7 +170,7 @@ function changeStatement(event)
             stack: 'ImpliedVolatility',
             yAxisIndex: 1,
             itemStyle: {
-                color: '#00BBFF'
+                color: '#3B82F6'
             },
             showSymbol: false,
            
@@ -309,7 +309,7 @@ function changeStatement(event)
 
             <div class="flex flex-col sm:flex-row items-center ml-3 sm:ml-0 w-1/2 justify-center">
                 <div class="h-full transform -translate-x-1/2 " aria-hidden="true"></div>
-                <div class="w-3 h-3 bg-[#00BBFF] border-4 box-content border-[#27272A] rounded-full transform sm:-translate-x-1/2" aria-hidden="true"></div>
+                <div class="w-3 h-3 bg-[#3B82F6] border-4 box-content border-[#27272A] rounded-full transform sm:-translate-x-1/2" aria-hidden="true"></div>
                 <span class="mt-2 sm:mt-0 text-white text-xs sm:text-md sm:font-medium inline-block">
                     Realized Volatility
                 </span>

src/lib/components/LayerCake/Bar/Bar.svelte

@@ -7,7 +7,7 @@
   
     const { data, xGet, yGet, xScale, yScale } = getContext('LayerCake');
   
-    /** @type {String} [fill='#00bbff'] - The shape's fill color. This is technically optional because it comes with a default value but you'll likely want to replace it with your own color. */
+    /** @type {String} [fill='#3B82F6'] - The shape's fill color. This is technically optional because it comes with a default value but you'll likely want to replace it with your own color. */
     export let fill = '#fff';
   </script>
   

src/lib/components/MarketMaker.svelte

@@ -8,7 +8,6 @@
   import { LineChart } from 'echarts/charts'
   import { GridComponent } from 'echarts/components'
   import { CanvasRenderer } from 'echarts/renderers'
-  import Lazy from 'svelte-lazy';
 
   use([LineChart, GridComponent, CanvasRenderer])
 
@@ -138,10 +137,10 @@ function getPlotOptions() {
       {
           data: shareQuantityList,
           type: 'line',
-          areaStyle: {opacity: 0.3},
+          areaStyle: {opacity: 1},
           yAxisIndex: 1,
           itemStyle: {
-              color: '#00BBFF' // Change bar color to white
+              color: '#3B82F6' // Change bar color to white
           },
           showSymbol: false
       },
@@ -255,11 +254,9 @@ else {
       <div class="pb-2 rounded-lg bg-[#09090B]">
               
         
-          <Lazy height={300} fadeOption={{delay: 100, duration: 500}} keep={true}>
           <div class="app w-full h-[300px] mt-5">
               <Chart {init} options={optionsData} class="chart" />
           </div>
-          </Lazy>
       
       </div>
 
@@ -273,7 +270,7 @@ else {
       </div>
           <div class="flex flex-col sm:flex-row items-center ml-3 sm:ml-0 w-1/2 justify-center">
               <div class="h-full transform -translate-x-1/2 " aria-hidden="true"></div>
-              <div class="w-3 h-3 bg-[#00BBFF] border-4 box-content border-[#27272A] rounded-full transform sm:-translate-x-1/2" aria-hidden="true"></div>
+              <div class="w-3 h-3 bg-[#3B82F6] border-4 box-content border-[#27272A] rounded-full transform sm:-translate-x-1/2" aria-hidden="true"></div>
               <span class="mt-2 sm:mt-0 text-white text-xs sm:text-md sm:font-medium inline-block">
                   Share Quantity
               </span>

src/lib/components/OptionsNetFlow.svelte

@@ -2,7 +2,6 @@
     import { optionsNetFlowComponent, stockTicker, assetType, etfTicker, getCache, setCache} from '$lib/store';
     import InfoModal from '$lib/components/InfoModal.svelte';
     import { Chart } from 'svelte-echarts'
-    import Lazy from 'svelte-lazy';
     import { init, use } from 'echarts/core'
     import { LineChart } from 'echarts/charts'
     import { GridComponent } from 'echarts/components'
@@ -241,11 +240,9 @@
         <div class="pb-2 rounded-lg bg-[#09090B]">
                 
           
-            <Lazy height={300} fadeOption={{delay: 100, duration: 500}} keep={true}>
                 <div class="app w-full h-[300px] mt-5">
                     <Chart {init} options={optionsData} class="chart" />
                 </div>
-            </Lazy>
         
         </div>
   

src/lib/components/PriceAnalysis.svelte

@@ -3,7 +3,6 @@
   import { priceAnalysisComponent, displayCompanyName, stockTicker, etfTicker, cryptoTicker, assetType, screenWidth, getCache, setCache} from '$lib/store';
   import InfoModal from '$lib/components/InfoModal.svelte';
   import { Chart } from 'svelte-echarts'
-  import Lazy from 'svelte-lazy';
 
 
   import { init, use } from 'echarts/core'
@@ -294,11 +293,9 @@ $: {
 
             
 
-            <Lazy height={300} fadeOption={{delay: 100, duration: 500}} keep={true}>
+              <div class="app w-full h-[300px]">
-                <div class="app w-full h-[300px] ">
                   <Chart {init} options={optionsData} class="chart" />
               </div>
-            </Lazy>
 
             <div class="text-white text-[1rem] mt-4 sm:mt-7 ml-1">
                 Over the next 12 months, the model predicts a

src/lib/components/RetailVolume.svelte

@@ -4,7 +4,6 @@
   import InfoModal from '$lib/components/InfoModal.svelte';
   import { Chart } from 'svelte-echarts'
   import { abbreviateNumber, formatDateRange } from "$lib/utils";
-  import Lazy from 'svelte-lazy';
   import { init, use } from 'echarts/core'
   import { LineChart, BarChart } from 'echarts/charts'
   import { GridComponent } from 'echarts/components'
@@ -291,11 +290,9 @@ $: {
             <div class="pb-8 sm:pb-2 rounded-lg bg-[#09090B]">
                     
               
-                <Lazy height={300} fadeOption={{delay: 100, duration: 500}} keep={true}>
                 <div class="app w-full h-[300px] mt-5">
                     <Chart {init} options={optionsData} class="chart" />
                 </div>
-                </Lazy>
             
             </div>
 
@@ -316,7 +313,7 @@ $: {
                           <td class="px-[5px] py-1.5 xs:px-2.5 xs:py-2">
                               <span>Date</span>
                           </td>
-                          <td class="px-[5px] text-sm py-1.5 text-right font-medium xs:px-2.5 xs:py-2">
+                          <td class="px-[5px] text-sm sm:text-[1rem] py-1.5 text-right font-medium xs:px-2.5 xs:py-2">
                             {formatDateRange(rawData?.lastDate)}
                           </td>
                       </tr>

src/lib/components/RevenueSegmentation.svelte

@@ -240,8 +240,8 @@ $: {
                                             >
                                             <Svg>
                                                 <Sankey
-                                                colorNodes={d => '#00bbff'}
+                                                colorNodes={d => '#3B82F6'}
-                                                colorLinks={d => '#00bbff35'}
+                                                colorLinks={d => '#3B82F635'}
                                                 />
                                             </Svg>
                                             </LayerCake>

src/lib/components/ShareHolders.svelte

@@ -6,7 +6,6 @@ import { formatString } from '$lib/utils';
 import { goto } from '$app/navigation';
 import { abbreviateNumber } from '$lib/utils';
 import InfoModal from '$lib/components/InfoModal.svelte';
-import Lazy from 'svelte-lazy';
 
 import { init, use } from 'echarts/core'
 import { PieChart } from 'echarts/charts'
@@ -187,11 +186,9 @@ let charNumber = 20;
               
 
                     <div class="flex flex-row items-center sm:-mt-5">
-                        <Lazy height={300} fadeOption={{delay: 100, duration: 500}} keep={true}>
                         <div class="app w-56">
                             <Chart {init} options={optionsPieChart} class="chart w-full" />
                         </div>
-                        </Lazy>
                         
                         <div class="flex flex-col items-center  sm:pt-0 m-auto">
 

src/lib/components/ShareStatistics.svelte

@@ -5,7 +5,6 @@ import InfoModal from '$lib/components/InfoModal.svelte';
 import { Chart } from 'svelte-echarts'
 import { abbreviateNumber } from "$lib/utils";
 
-import Lazy from 'svelte-lazy';
 
 import { init, use } from 'echarts/core'
 
@@ -91,14 +90,14 @@ function getPlotOptions() {
             data: floatShares,
             type: 'bar',
             itemStyle: {
-                color: '#5470C6' // Change bar color to white
+                color: '#3B82F6' // Change bar color to white
             }
         },
         {
             data: outstandingShares,
             type: 'bar',
             itemStyle: {
-                color: '#C12F23' // Change bar color to white
+                color: '#E11D48'
             }
         },
     ]
@@ -188,11 +187,9 @@ $: {
                     </div>
                 
                     
-                    <Lazy height={300} fadeOption={{delay: 100, duration: 500}} keep={true}>
                     <div class="app w-full h-[300px] mt-6">
                         <Chart {init} options={optionsData} class="chart" />
                     </div>
-                    </Lazy>
                     
                     
                     <div class="flex flex-row items-center justify-between mx-auto mt-8 w-full sm:w-11/12">

src/lib/components/Swap.svelte

@@ -9,9 +9,7 @@
     import { init, use } from 'echarts/core'
     import { ScatterChart } from 'echarts/charts'
    import { GridComponent } from 'echarts/components'
-   import { CanvasRenderer } from 'echarts/renderers'
+   import { CanvasRenderer } from 'echarts/renderers';
-
-    import Lazy from 'svelte-lazy';
     export let data;
 
     use([ScatterChart, GridComponent, CanvasRenderer])
@@ -277,11 +275,9 @@
               </div>
 
           
-            <Lazy height={300} fadeOption={{delay: 100, duration: 500}} keep={true}>
                 <div class="app w-full h-[300px] mt-5">
                     <Chart {init} options={optionsData} class="chart" />
                 </div>
-            </Lazy>
         
         </div>
   

src/lib/components/TARating.svelte

@@ -2,7 +2,6 @@
   import { taRatingComponent, stockTicker, etfTicker, cryptoTicker, assetType, getCache, setCache} from '$lib/store';
   import SignalBar from '$lib/components/SignalBar.svelte'
   import InfoModal from '$lib/components/InfoModal.svelte';
-  import Lazy from 'svelte-lazy';
 
   export let data;
 
@@ -151,7 +150,6 @@ $: if ($assetType || $stockTicker || $etfTicker || $cryptoTicker) {
 
             <!--Start Momentum Indicators-->
             <div class="w-full overflow-hidden">
-              <Lazy height={300} fadeOption={{delay: 100, duration: 500}} keep={true}>
                 <table class="table table-sm table-compact w-full mb-5 mt-5">
                   <!-- head -->
                   <thead>
@@ -188,7 +186,6 @@ $: if ($assetType || $stockTicker || $etfTicker || $cryptoTicker) {
                   <svg class="w-10 h-10 transform {showFullStats ? 'rotate-180' : ''} " xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#2A323C" d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2zm0 13.5L7.5 11l1.42-1.41L12 12.67l3.08-3.08L16.5 11L12 15.5z"/></svg>
                 </label>
 
-              </Lazy>
             </div>
           <!--End Momentum Indicators-->