redesign stock page
This commit is contained in:
MuslemRahimi
parent
5e181e1b07
commit
a7af133376
@ -115,7 +115,6 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
$: hideFooter =
|
$: hideFooter =
|
||||||
$page.url.pathname.startsWith("/dark-pool-flow") ||
|
|
||||||
$page.url.pathname.startsWith("/options-flow") ||
|
$page.url.pathname.startsWith("/options-flow") ||
|
||||||
$page.url.pathname.startsWith("/options-zero-dte") ||
|
$page.url.pathname.startsWith("/options-zero-dte") ||
|
||||||
$page.url.pathname.startsWith("/login") ||
|
$page.url.pathname.startsWith("/login") ||
|
||||||
@ -129,7 +128,6 @@
|
|||||||
$page.url.pathname.startsWith("/portfolio") ||
|
$page.url.pathname.startsWith("/portfolio") ||
|
||||||
$page.url.pathname.startsWith("/hedge-funds") ||
|
$page.url.pathname.startsWith("/hedge-funds") ||
|
||||||
$page.url.pathname.startsWith("/watchlist") ||
|
$page.url.pathname.startsWith("/watchlist") ||
|
||||||
$page.url.pathname.startsWith("/stocks") ||
|
|
||||||
$page.url.pathname.startsWith("/community") ||
|
$page.url.pathname.startsWith("/community") ||
|
||||||
$page.url.pathname.startsWith("/stock-screener") ||
|
$page.url.pathname.startsWith("/stock-screener") ||
|
||||||
$page.url.pathname.startsWith("/price-alert");
|
$page.url.pathname.startsWith("/price-alert");
|
||||||
|
|||||||
@ -347,10 +347,10 @@ function handleTypeOfTrade(state:string)
|
|||||||
<svelte:window bind:scrollY={y} />
|
<svelte:window bind:scrollY={y} />
|
||||||
|
|
||||||
<body
|
<body
|
||||||
class="bg-[#09090B] pb-40 w-full max-w-screen min-h-screen sm:max-w-7xl xl:max-w-screen-2xl overflow-hidden"
|
class="bg-[#09090B] w-full max-w-screen min-h-screen sm:max-w-7xl xl:max-w-screen-2xl overflow-hidden"
|
||||||
>
|
>
|
||||||
<!-- Page wrapper -->
|
<!-- Page wrapper -->
|
||||||
<div class="flex flex-col w-full mt-5 relative">
|
<div class="flex flex-col w-full mt-5 relative w-full">
|
||||||
<main class="grow w-full">
|
<main class="grow w-full">
|
||||||
<section class="w-full">
|
<section class="w-full">
|
||||||
<div class="w-full">
|
<div class="w-full">
|
||||||
@ -554,14 +554,12 @@ function handleTypeOfTrade(state:string)
|
|||||||
</div>
|
</div>
|
||||||
<!--End Mobile Navbar-->
|
<!--End Mobile Navbar-->
|
||||||
|
|
||||||
<div
|
<div class="pt-14 sm:pt-0 w-auto max-w-7xl px-3 sm:px-0">
|
||||||
class="pt-14 sm:pt-0 w-auto max-w-3xl lg:max-w-content 2xl:max-w-6xl px-3 sm:px-0"
|
|
||||||
>
|
|
||||||
<div
|
<div
|
||||||
class="md:flex md:justify-between md:divide-x md:divide-slate-800"
|
class="md:flex md:justify-between md:divide-x md:divide-slate-800"
|
||||||
>
|
>
|
||||||
<!-- Main content -->
|
<!-- Main content -->
|
||||||
<div class="pb-12 md:pb-20 w-full 2xl:max-w-5xl">
|
<div class="pb-12 md:pb-20 w-full max-w-7xl">
|
||||||
<div class="md:pr-6 lg:pr-10">
|
<div class="md:pr-6 lg:pr-10">
|
||||||
<!-----Start-Header-CandleChart-Indicators------>
|
<!-----Start-Header-CandleChart-Indicators------>
|
||||||
|
|
||||||
@ -897,7 +895,7 @@ function handleTypeOfTrade(state:string)
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<aside
|
<aside
|
||||||
class="hidden lg:block w-fit max-w-xl xl:w-[120px] md:pt-10 pb-12 md:pb-20"
|
class="hidden w-fit max-w-xl xl:w-[120px] md:pt-10 pb-12 md:pb-20"
|
||||||
>
|
>
|
||||||
<div class="sm:pl-10">
|
<div class="sm:pl-10">
|
||||||
<!--Start Company Info -->
|
<!--Start Company Info -->
|
||||||
|
|||||||
@ -1499,95 +1499,686 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!--BUG: Dont remove since when changing ETF symbol display freezes-->
|
<!--BUG: Dont remove since when changing ETF symbol display freezes-->
|
||||||
|
<div class="mt-6 lg:grid lg:grid-cols-2 lg:gap-x-10 w-full">
|
||||||
|
<div class="space-y-6 lg:order-2 lg:pt-1 w-96 ml-auto">
|
||||||
|
<div class="px-0.5 lg:px-0">
|
||||||
|
<h2 class="mb-2" data-test="overview-profile-header">
|
||||||
|
About NVDA
|
||||||
|
</h2>
|
||||||
|
<p data-test="overview-profile-description">
|
||||||
|
NVIDIA Corporation provides graphics and compute and
|
||||||
|
networking solutions in the United States, Taiwan, China, Hong
|
||||||
|
Kong, and internationally. The Graphics segment offers GeForce
|
||||||
|
GPUs for gaming and PCs, the GeForce NOW game streaming
|
||||||
|
service and related infrastructure, and solutions for gaming
|
||||||
|
platforms; Quadro/NVIDIA RTX GPUs for enterprise workstation
|
||||||
|
graphics; virtual GPU or vGPU software for cloud-based visual
|
||||||
|
and virtual computing; automotive platforms for infotainment
|
||||||
|
systems; and Omniverse software for building and operating
|
||||||
|
metaverse a... <a
|
||||||
|
href="/stocks/nvda/company/"
|
||||||
|
title="View company profile"
|
||||||
|
tabindex="-1">[Read more]</a
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
<div
|
||||||
|
class="mt-3 grid grid-cols-2 gap-3"
|
||||||
|
data-test="overview-profile-values"
|
||||||
|
>
|
||||||
|
<div class="col-span-1">
|
||||||
|
<span class="block font-semibold">Industry</span>
|
||||||
|
<a
|
||||||
|
href="/stocks/industry/semiconductors/"
|
||||||
|
class="dothref text-default">Semiconductors</a
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div class="col-span-1">
|
||||||
|
<span class="block font-semibold">Sector</span>
|
||||||
|
<a
|
||||||
|
href="/stocks/sector/technology/"
|
||||||
|
class="dothref text-default">Technology</a
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div class="col-span-1">
|
||||||
|
<span class="block font-semibold">IPO Date</span>
|
||||||
|
<span>Jan 22, 1999</span>
|
||||||
|
</div>
|
||||||
|
<div class="col-span-1">
|
||||||
|
<span class="block font-semibold">Employees</span>
|
||||||
|
<a
|
||||||
|
href="/stocks/nvda/employees/"
|
||||||
|
class="dothref text-default">29,600</a
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div class="col-span-1">
|
||||||
|
<span class="block font-semibold">Stock Exchange</span>
|
||||||
|
<span>NASDAQ</span>
|
||||||
|
</div>
|
||||||
|
<div class="col-span-1">
|
||||||
|
<span class="block font-semibold">Ticker Symbol</span>
|
||||||
|
<span>NVDA</span>
|
||||||
|
</div>
|
||||||
|
<div class="col-span-1">
|
||||||
|
<span class="block font-semibold">Website</span>
|
||||||
|
<a href="https://www.nvidia.com" target="_blank"
|
||||||
|
>https://www.nvidia.com</a
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a href="/stocks/nvda/company/" class="button mt-4 w-full"
|
||||||
|
>Full Company Profile</a
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h2 data-svelte-h="svelte-11uexdp">Financial Performance</h2>
|
||||||
|
<p data-test="overview-performance-intro" class="mb-3">
|
||||||
|
In 2023, NVIDIA's revenue was $60.92 billion, an increase of
|
||||||
|
125.85% compared to the previous year's $26.97 billion.
|
||||||
|
Earnings were $29.76 billion, an increase of 581.32%.
|
||||||
|
</p>
|
||||||
|
<div>
|
||||||
|
<div
|
||||||
|
class="h-72 rounded-sm border border-default"
|
||||||
|
data-test="overview-performance-chart"
|
||||||
|
data-highcharts-chart="0"
|
||||||
|
style="overflow: hidden;"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
id="highcharts-wge0tn7-0"
|
||||||
|
style="position: relative; overflow: hidden; width: 336px; height: 288px; text-align: left; line-height: normal; z-index: 0; user-select: none; touch-action: manipulation; outline: none; font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; left: 0.0999756px; top: 0.400024px;"
|
||||||
|
dir="ltr"
|
||||||
|
class="highcharts-container"
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
version="1.1"
|
||||||
|
class="highcharts-root"
|
||||||
|
style="font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font-size: 12px;"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="336"
|
||||||
|
height="288"
|
||||||
|
viewBox="0 0 336 288"
|
||||||
|
role="img"
|
||||||
|
aria-label=""
|
||||||
|
><desc>Created with Highcharts 10.3.3</desc><defs
|
||||||
|
><clipPath id="highcharts-wge0tn7-1-"
|
||||||
|
><rect
|
||||||
|
x="0"
|
||||||
|
y="0"
|
||||||
|
width="278"
|
||||||
|
height="198"
|
||||||
|
fill="none"
|
||||||
|
></rect></clipPath
|
||||||
|
><clipPath id="highcharts-wge0tn7-7-"
|
||||||
|
><rect
|
||||||
|
x="0"
|
||||||
|
y="0"
|
||||||
|
width="278"
|
||||||
|
height="198"
|
||||||
|
fill="none"
|
||||||
|
></rect></clipPath
|
||||||
|
></defs
|
||||||
|
><rect
|
||||||
|
fill="transparent"
|
||||||
|
class="highcharts-background"
|
||||||
|
x="0"
|
||||||
|
y="0"
|
||||||
|
width="336"
|
||||||
|
height="288"
|
||||||
|
rx="0"
|
||||||
|
ry="0"
|
||||||
|
></rect><rect
|
||||||
|
fill="none"
|
||||||
|
class="highcharts-plot-background"
|
||||||
|
x="10"
|
||||||
|
y="51"
|
||||||
|
width="278"
|
||||||
|
height="198"
|
||||||
|
></rect><g
|
||||||
|
class="highcharts-grid highcharts-xaxis-grid"
|
||||||
|
data-z-index="1"
|
||||||
|
><path
|
||||||
|
fill="none"
|
||||||
|
stroke="#e6e6e6"
|
||||||
|
stroke-width="0"
|
||||||
|
stroke-dasharray="none"
|
||||||
|
data-z-index="1"
|
||||||
|
class="highcharts-grid-line"
|
||||||
|
d="M 65.5 51 L 65.5 249"
|
||||||
|
opacity="1"
|
||||||
|
></path><path
|
||||||
|
fill="none"
|
||||||
|
stroke="#e6e6e6"
|
||||||
|
stroke-width="0"
|
||||||
|
stroke-dasharray="none"
|
||||||
|
data-z-index="1"
|
||||||
|
class="highcharts-grid-line"
|
||||||
|
d="M 120.5 51 L 120.5 249"
|
||||||
|
opacity="1"
|
||||||
|
></path><path
|
||||||
|
fill="none"
|
||||||
|
stroke="#e6e6e6"
|
||||||
|
stroke-width="0"
|
||||||
|
stroke-dasharray="none"
|
||||||
|
data-z-index="1"
|
||||||
|
class="highcharts-grid-line"
|
||||||
|
d="M 176.5 51 L 176.5 249"
|
||||||
|
opacity="1"
|
||||||
|
></path><path
|
||||||
|
fill="none"
|
||||||
|
stroke="#e6e6e6"
|
||||||
|
stroke-width="0"
|
||||||
|
stroke-dasharray="none"
|
||||||
|
data-z-index="1"
|
||||||
|
class="highcharts-grid-line"
|
||||||
|
d="M 231.5 51 L 231.5 249"
|
||||||
|
opacity="1"
|
||||||
|
></path><path
|
||||||
|
fill="none"
|
||||||
|
stroke="#e6e6e6"
|
||||||
|
stroke-width="0"
|
||||||
|
stroke-dasharray="none"
|
||||||
|
data-z-index="1"
|
||||||
|
class="highcharts-grid-line"
|
||||||
|
d="M 287.5 51 L 287.5 249"
|
||||||
|
opacity="1"
|
||||||
|
></path><path
|
||||||
|
fill="none"
|
||||||
|
stroke="#e6e6e6"
|
||||||
|
stroke-width="0"
|
||||||
|
stroke-dasharray="none"
|
||||||
|
data-z-index="1"
|
||||||
|
class="highcharts-grid-line"
|
||||||
|
d="M 9.5 51 L 9.5 249"
|
||||||
|
opacity="1"
|
||||||
|
></path></g
|
||||||
|
><g
|
||||||
|
class="highcharts-grid highcharts-yaxis-grid"
|
||||||
|
data-z-index="1"
|
||||||
|
><path
|
||||||
|
fill="none"
|
||||||
|
stroke="#e5e5e5"
|
||||||
|
stroke-width="1"
|
||||||
|
stroke-dasharray="none"
|
||||||
|
data-z-index="1"
|
||||||
|
class="highcharts-grid-line"
|
||||||
|
d="M 10 249.5 L 288 249.5"
|
||||||
|
opacity="1"
|
||||||
|
></path><path
|
||||||
|
fill="none"
|
||||||
|
stroke="#e5e5e5"
|
||||||
|
stroke-width="1"
|
||||||
|
stroke-dasharray="none"
|
||||||
|
data-z-index="1"
|
||||||
|
class="highcharts-grid-line"
|
||||||
|
d="M 10 183.5 L 288 183.5"
|
||||||
|
opacity="1"
|
||||||
|
></path><path
|
||||||
|
fill="none"
|
||||||
|
stroke="#e5e5e5"
|
||||||
|
stroke-width="1"
|
||||||
|
stroke-dasharray="none"
|
||||||
|
data-z-index="1"
|
||||||
|
class="highcharts-grid-line"
|
||||||
|
d="M 10 117.5 L 288 117.5"
|
||||||
|
opacity="1"
|
||||||
|
></path><path
|
||||||
|
fill="none"
|
||||||
|
stroke="#e5e5e5"
|
||||||
|
stroke-width="1"
|
||||||
|
stroke-dasharray="none"
|
||||||
|
data-z-index="1"
|
||||||
|
class="highcharts-grid-line"
|
||||||
|
d="M 10 50.5 L 288 50.5"
|
||||||
|
opacity="1"
|
||||||
|
></path></g
|
||||||
|
><rect
|
||||||
|
fill="none"
|
||||||
|
class="highcharts-plot-border"
|
||||||
|
data-z-index="1"
|
||||||
|
stroke="#cccccc"
|
||||||
|
stroke-width="0"
|
||||||
|
x="10"
|
||||||
|
y="51"
|
||||||
|
width="278"
|
||||||
|
height="198"
|
||||||
|
></rect><g
|
||||||
|
class="highcharts-axis highcharts-xaxis"
|
||||||
|
data-z-index="2"
|
||||||
|
><path
|
||||||
|
fill="none"
|
||||||
|
class="highcharts-axis-line"
|
||||||
|
stroke="#ccd6eb"
|
||||||
|
stroke-width="1"
|
||||||
|
data-z-index="7"
|
||||||
|
d="M 10 249.5 L 288 249.5"
|
||||||
|
></path></g
|
||||||
|
><g
|
||||||
|
class="highcharts-axis highcharts-yaxis"
|
||||||
|
data-z-index="2"
|
||||||
|
><path
|
||||||
|
fill="none"
|
||||||
|
class="highcharts-axis-line"
|
||||||
|
stroke="#ccd6eb"
|
||||||
|
stroke-width="0"
|
||||||
|
data-z-index="7"
|
||||||
|
d="M 288 51 L 288 249"
|
||||||
|
></path></g
|
||||||
|
><g class="highcharts-series-group" data-z-index="3"
|
||||||
|
><g
|
||||||
|
class="highcharts-series highcharts-series-0 highcharts-column-series highcharts-tracker"
|
||||||
|
data-z-index="0.1"
|
||||||
|
opacity="1"
|
||||||
|
transform="translate(10,51) scale(1 1)"
|
||||||
|
clip-path="url(#highcharts-wge0tn7-7-)"
|
||||||
|
><rect
|
||||||
|
x="4.5"
|
||||||
|
y="169.5"
|
||||||
|
width="21"
|
||||||
|
height="29"
|
||||||
|
fill="#2C6288"
|
||||||
|
stroke="#e5e5e5"
|
||||||
|
stroke-width="1"
|
||||||
|
opacity="1"
|
||||||
|
class="highcharts-point"
|
||||||
|
></rect><rect
|
||||||
|
x="60.5"
|
||||||
|
y="154.5"
|
||||||
|
width="21"
|
||||||
|
height="44"
|
||||||
|
fill="#2C6288"
|
||||||
|
stroke="#e5e5e5"
|
||||||
|
stroke-width="1"
|
||||||
|
opacity="1"
|
||||||
|
class="highcharts-point"
|
||||||
|
></rect><rect
|
||||||
|
x="115.5"
|
||||||
|
y="127.5"
|
||||||
|
width="21"
|
||||||
|
height="71"
|
||||||
|
fill="#2C6288"
|
||||||
|
stroke="#e5e5e5"
|
||||||
|
stroke-width="1"
|
||||||
|
opacity="1"
|
||||||
|
class="highcharts-point"
|
||||||
|
></rect><rect
|
||||||
|
x="171.5"
|
||||||
|
y="127.5"
|
||||||
|
width="21"
|
||||||
|
height="71"
|
||||||
|
fill="#2C6288"
|
||||||
|
stroke="#e5e5e5"
|
||||||
|
stroke-width="1"
|
||||||
|
opacity="1"
|
||||||
|
class="highcharts-point"
|
||||||
|
></rect><rect
|
||||||
|
x="227.5"
|
||||||
|
y="37.5"
|
||||||
|
width="21"
|
||||||
|
height="161"
|
||||||
|
fill="#2C6288"
|
||||||
|
stroke="#e5e5e5"
|
||||||
|
stroke-width="1"
|
||||||
|
opacity="1"
|
||||||
|
class="highcharts-point"
|
||||||
|
></rect></g
|
||||||
|
><g
|
||||||
|
class="highcharts-markers highcharts-series-0 highcharts-column-series"
|
||||||
|
data-z-index="0.1"
|
||||||
|
opacity="1"
|
||||||
|
transform="translate(10,51) scale(1 1)"
|
||||||
|
clip-path="none"
|
||||||
|
></g><g
|
||||||
|
class="highcharts-series highcharts-series-1 highcharts-column-series highcharts-tracker"
|
||||||
|
data-z-index="0.1"
|
||||||
|
opacity="1"
|
||||||
|
transform="translate(10,51) scale(1 1)"
|
||||||
|
clip-path="url(#highcharts-wge0tn7-7-)"
|
||||||
|
></g><g
|
||||||
|
class="highcharts-markers highcharts-series-1 highcharts-column-series"
|
||||||
|
data-z-index="0.1"
|
||||||
|
opacity="1"
|
||||||
|
transform="translate(10,51) scale(1 1)"
|
||||||
|
clip-path="none"
|
||||||
|
></g><g
|
||||||
|
class="highcharts-series highcharts-series-2 highcharts-column-series highcharts-tracker"
|
||||||
|
data-z-index="0.1"
|
||||||
|
opacity="1"
|
||||||
|
transform="translate(10,51) scale(1 1)"
|
||||||
|
clip-path="url(#highcharts-wge0tn7-7-)"
|
||||||
|
><rect
|
||||||
|
x="29.5"
|
||||||
|
y="191.5"
|
||||||
|
width="21"
|
||||||
|
height="7"
|
||||||
|
fill="#00853E"
|
||||||
|
stroke="#e5e5e5"
|
||||||
|
stroke-width="1"
|
||||||
|
opacity="1"
|
||||||
|
class="highcharts-point highcharts-color-0"
|
||||||
|
></rect><rect
|
||||||
|
x="85.5"
|
||||||
|
y="187.5"
|
||||||
|
width="21"
|
||||||
|
height="11"
|
||||||
|
fill="#00853E"
|
||||||
|
stroke="#e5e5e5"
|
||||||
|
stroke-width="1"
|
||||||
|
opacity="1"
|
||||||
|
class="highcharts-point highcharts-color-1"
|
||||||
|
></rect><rect
|
||||||
|
x="141.5"
|
||||||
|
y="172.5"
|
||||||
|
width="21"
|
||||||
|
height="26"
|
||||||
|
fill="#00853E"
|
||||||
|
stroke="#e5e5e5"
|
||||||
|
stroke-width="1"
|
||||||
|
opacity="1"
|
||||||
|
class="highcharts-point highcharts-color-2"
|
||||||
|
></rect><rect
|
||||||
|
x="196.5"
|
||||||
|
y="186.5"
|
||||||
|
width="21"
|
||||||
|
height="12"
|
||||||
|
fill="#00853E"
|
||||||
|
stroke="#e5e5e5"
|
||||||
|
stroke-width="1"
|
||||||
|
opacity="1"
|
||||||
|
class="highcharts-point highcharts-color-3"
|
||||||
|
></rect><rect
|
||||||
|
x="252.5"
|
||||||
|
y="119.5"
|
||||||
|
width="21"
|
||||||
|
height="79"
|
||||||
|
fill="#00853E"
|
||||||
|
stroke="#e5e5e5"
|
||||||
|
stroke-width="1"
|
||||||
|
opacity="1"
|
||||||
|
class="highcharts-point highcharts-color-4"
|
||||||
|
></rect></g
|
||||||
|
><g
|
||||||
|
class="highcharts-markers highcharts-series-2 highcharts-column-series"
|
||||||
|
data-z-index="0.1"
|
||||||
|
opacity="1"
|
||||||
|
transform="translate(10,51) scale(1 1)"
|
||||||
|
clip-path="none"
|
||||||
|
></g></g
|
||||||
|
><text
|
||||||
|
x="168"
|
||||||
|
text-anchor="middle"
|
||||||
|
class="highcharts-title"
|
||||||
|
data-z-index="4"
|
||||||
|
style="color: rgb(51, 51, 51); font-size: 18px; fill: rgb(51, 51, 51);"
|
||||||
|
y="24"
|
||||||
|
></text><text
|
||||||
|
x="168"
|
||||||
|
text-anchor="middle"
|
||||||
|
class="highcharts-subtitle"
|
||||||
|
data-z-index="4"
|
||||||
|
style="color: rgb(102, 102, 102); fill: rgb(102, 102, 102);"
|
||||||
|
y="24"
|
||||||
|
></text><text
|
||||||
|
x="10"
|
||||||
|
text-anchor="start"
|
||||||
|
class="highcharts-caption"
|
||||||
|
data-z-index="4"
|
||||||
|
style="color: rgb(102, 102, 102); fill: rgb(102, 102, 102);"
|
||||||
|
y="285"
|
||||||
|
></text><g
|
||||||
|
class="highcharts-legend highcharts-no-tooltip"
|
||||||
|
data-z-index="7"
|
||||||
|
transform="translate(74,10)"
|
||||||
|
><rect
|
||||||
|
fill="none"
|
||||||
|
class="highcharts-legend-box"
|
||||||
|
rx="0"
|
||||||
|
ry="0"
|
||||||
|
stroke="#999999"
|
||||||
|
stroke-width="0"
|
||||||
|
x="0"
|
||||||
|
y="0"
|
||||||
|
width="188"
|
||||||
|
height="29"
|
||||||
|
></rect><g data-z-index="1"
|
||||||
|
><g
|
||||||
|
><g
|
||||||
|
class="highcharts-legend-item highcharts-column-series highcharts-color-undefined highcharts-series-0"
|
||||||
|
data-z-index="1"
|
||||||
|
transform="translate(8,3)"
|
||||||
|
><text
|
||||||
|
x="20"
|
||||||
|
style="color: rgb(50, 50, 50); cursor: pointer; font-size: 15px; font-weight: normal; fill: rgb(50, 50, 50);"
|
||||||
|
text-anchor="start"
|
||||||
|
data-z-index="2"
|
||||||
|
y="18">Revenue</text
|
||||||
|
><rect
|
||||||
|
x="0"
|
||||||
|
y="4"
|
||||||
|
width="15"
|
||||||
|
height="15"
|
||||||
|
fill="#2C6288"
|
||||||
|
class="highcharts-point"
|
||||||
|
data-z-index="3"
|
||||||
|
></rect></g
|
||||||
|
><g
|
||||||
|
class="highcharts-legend-item highcharts-column-series highcharts-color-undefined highcharts-series-1"
|
||||||
|
data-z-index="1"
|
||||||
|
transform="translate(104.23333358764648,3)"
|
||||||
|
><text
|
||||||
|
x="20"
|
||||||
|
y="18"
|
||||||
|
style="color: rgb(50, 50, 50); cursor: pointer; font-size: 15px; font-weight: normal; fill: rgb(50, 50, 50);"
|
||||||
|
text-anchor="start"
|
||||||
|
data-z-index="2">Earnings</text
|
||||||
|
><rect
|
||||||
|
x="0"
|
||||||
|
y="4"
|
||||||
|
width="15"
|
||||||
|
height="15"
|
||||||
|
fill="#00853E"
|
||||||
|
class="highcharts-point"
|
||||||
|
data-z-index="3"
|
||||||
|
></rect></g
|
||||||
|
></g
|
||||||
|
></g
|
||||||
|
></g
|
||||||
|
><g
|
||||||
|
class="highcharts-axis-labels highcharts-xaxis-labels"
|
||||||
|
data-z-index="7"
|
||||||
|
><text
|
||||||
|
x="37.8"
|
||||||
|
style="color: rgb(50, 50, 50); cursor: default; font-size: 12px; fill: rgb(50, 50, 50);"
|
||||||
|
text-anchor="middle"
|
||||||
|
transform="translate(0,0)"
|
||||||
|
y="269"
|
||||||
|
opacity="1">2019</text
|
||||||
|
><text
|
||||||
|
x="93.4"
|
||||||
|
style="color: rgb(50, 50, 50); cursor: default; font-size: 12px; fill: rgb(50, 50, 50);"
|
||||||
|
text-anchor="middle"
|
||||||
|
transform="translate(0,0)"
|
||||||
|
y="269"
|
||||||
|
opacity="1">2020</text
|
||||||
|
><text
|
||||||
|
x="149"
|
||||||
|
style="color: rgb(50, 50, 50); cursor: default; font-size: 12px; fill: rgb(50, 50, 50);"
|
||||||
|
text-anchor="middle"
|
||||||
|
transform="translate(0,0)"
|
||||||
|
y="269"
|
||||||
|
opacity="1">2021</text
|
||||||
|
><text
|
||||||
|
x="204.6"
|
||||||
|
style="color: rgb(50, 50, 50); cursor: default; font-size: 12px; fill: rgb(50, 50, 50);"
|
||||||
|
text-anchor="middle"
|
||||||
|
transform="translate(0,0)"
|
||||||
|
y="269"
|
||||||
|
opacity="1">2022</text
|
||||||
|
><text
|
||||||
|
x="260.2"
|
||||||
|
style="color: rgb(50, 50, 50); cursor: default; font-size: 12px; fill: rgb(50, 50, 50);"
|
||||||
|
text-anchor="middle"
|
||||||
|
transform="translate(0,0)"
|
||||||
|
y="269"
|
||||||
|
opacity="1">2023</text
|
||||||
|
></g
|
||||||
|
><g
|
||||||
|
class="highcharts-axis-labels highcharts-yaxis-labels"
|
||||||
|
data-z-index="7"
|
||||||
|
><text
|
||||||
|
x="303"
|
||||||
|
style="color: rgb(50, 50, 50); cursor: default; font-size: 14px; fill: rgb(50, 50, 50);"
|
||||||
|
text-anchor="start"
|
||||||
|
transform="translate(0,0)"
|
||||||
|
y="254"
|
||||||
|
opacity="1">0</text
|
||||||
|
><text
|
||||||
|
x="303"
|
||||||
|
style="color: rgb(50, 50, 50); cursor: default; font-size: 14px; fill: rgb(50, 50, 50);"
|
||||||
|
text-anchor="start"
|
||||||
|
transform="translate(0,0)"
|
||||||
|
y="188"
|
||||||
|
opacity="1">25B</text
|
||||||
|
><text
|
||||||
|
x="303"
|
||||||
|
style="color: rgb(50, 50, 50); cursor: default; font-size: 14px; fill: rgb(50, 50, 50);"
|
||||||
|
text-anchor="start"
|
||||||
|
transform="translate(0,0)"
|
||||||
|
y="122"
|
||||||
|
opacity="1">50B</text
|
||||||
|
><text
|
||||||
|
x="303"
|
||||||
|
style="color: rgb(50, 50, 50); cursor: default; font-size: 14px; fill: rgb(50, 50, 50);"
|
||||||
|
text-anchor="start"
|
||||||
|
transform="translate(0,0)"
|
||||||
|
y="56"
|
||||||
|
opacity="1">75B</text
|
||||||
|
></g
|
||||||
|
></svg
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a href="/stocks/nvda/financials/" class="button mt-4 w-full"
|
||||||
|
>Financial Statements</a
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h2 class="mb-2" data-svelte-h="svelte-avjv7o">
|
||||||
|
Analyst Forecast
|
||||||
|
</h2>
|
||||||
|
<p class="mb-4" data-test="overview-forecast-intro">
|
||||||
|
According to 40 analysts, the average rating for NVDA stock is
|
||||||
|
"Strong Buy." The 12-month stock price forecast is $145.84,
|
||||||
|
which is an increase of 3.04% from the latest price.
|
||||||
|
</p>
|
||||||
|
<div
|
||||||
|
data-test="overview-forecast-targetchart"
|
||||||
|
class="border border-default p-2 xs:p-3"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="m-auto mb-2 text-center text-xl font-semibold text-default"
|
||||||
|
data-svelte-h="svelte-5xi68b"
|
||||||
|
>
|
||||||
|
Price Target
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="mb-0.5 text-center text-4xl font-semibold text-green-vivid"
|
||||||
|
>
|
||||||
|
$145.84
|
||||||
|
</div>
|
||||||
|
<div class="mb-1.5 text-center text-xl">(3.04% upside)</div>
|
||||||
|
<div
|
||||||
|
class="py-1 text-center text-lg font-semibold text-default"
|
||||||
|
>
|
||||||
|
Analyst Consensus: <span
|
||||||
|
class="font-bold text-green-default">Strong Buy</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
|
<a href="/stocks/nvda/forecast/" class="button mt-4 w-full"
|
||||||
|
>Stock Forecasts</a
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div class="lg:sticky lg:top-20"></div>
|
||||||
|
</div>
|
||||||
|
<div class="w-full">
|
||||||
|
<div class="w-full mt-10 m-auto sm:p-6 lg:hidden">
|
||||||
|
<Lazy>
|
||||||
|
<h3
|
||||||
|
class="cursor-pointer flex flex-row items-center text-white text-xl sm:text-3xl font-bold"
|
||||||
|
>
|
||||||
|
Key Information
|
||||||
|
</h3>
|
||||||
|
{#await import("$lib/components/StockKeyInformation.svelte") then { default: Comp }}
|
||||||
|
<svelte:component this={Comp} {data} />
|
||||||
|
{/await}
|
||||||
|
</Lazy>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="w-full mt-10 m-auto sm:p-6 lg:hidden">
|
<div
|
||||||
<Lazy>
|
class="w-full mt-10 sm:mt-0 m-auto sm:pl-6 sm:pb-6 sm:pt-6 {Object?.keys(
|
||||||
<h3
|
data?.getEarningsSurprise || {},
|
||||||
class="cursor-pointer flex flex-row items-center text-white text-xl sm:text-3xl font-bold"
|
)?.length !== 0
|
||||||
|
? ''
|
||||||
|
: 'hidden'}"
|
||||||
>
|
>
|
||||||
Key Information
|
<EarningsSurprise {data} />
|
||||||
</h3>
|
</div>
|
||||||
{#await import("$lib/components/StockKeyInformation.svelte") then { default: Comp }}
|
|
||||||
<svelte:component this={Comp} {data} />
|
|
||||||
{/await}
|
|
||||||
</Lazy>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div
|
<div
|
||||||
class="w-full mt-10 sm:mt-0 m-auto sm:pl-6 sm:pb-6 sm:pt-6 {Object?.keys(
|
class="w-full mt-10 sm:mt-0 m-auto sm:pl-6 sm:pb-6 sm:pt-6 {Object?.keys(
|
||||||
data?.getEarningsSurprise || {},
|
data?.getNextEarnings || {},
|
||||||
)?.length !== 0
|
)?.length !== 0
|
||||||
? ''
|
? ''
|
||||||
: 'hidden'}"
|
: 'hidden'}"
|
||||||
>
|
>
|
||||||
<EarningsSurprise {data} />
|
<NextEarnings {data} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
class="w-full mt-10 sm:mt-0 m-auto sm:pl-6 sm:pb-6 sm:pt-6 {Object?.keys(
|
class="w-full mt-10 sm:mt-0 m-auto sm:pl-6 sm:pb-6 sm:pt-6 {Object?.keys(
|
||||||
data?.getNextEarnings || {},
|
data?.getDividendAnnouncement || {},
|
||||||
)?.length !== 0
|
)?.length !== 0
|
||||||
? ''
|
? ''
|
||||||
: 'hidden'}"
|
: 'hidden'}"
|
||||||
>
|
>
|
||||||
<NextEarnings {data} />
|
<DividendAnnouncement {data} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
class="w-full mt-10 sm:mt-0 m-auto sm:pl-6 sm:pb-6 sm:pt-6 {Object?.keys(
|
class="w-full mt-10 sm:mt-0 m-auto sm:pl-6 sm:pb-6 sm:pt-6 {Object?.keys(
|
||||||
data?.getDividendAnnouncement || {},
|
data?.getBullBearSay || {},
|
||||||
)?.length !== 0
|
)?.length !== 0
|
||||||
? ''
|
? ''
|
||||||
: 'hidden'}"
|
: 'hidden'}"
|
||||||
>
|
>
|
||||||
<DividendAnnouncement {data} />
|
<BullBearSay {data} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div
|
<Lazy>
|
||||||
class="w-full mt-10 sm:mt-0 m-auto sm:pl-6 sm:pb-6 sm:pt-6 {Object?.keys(
|
<div
|
||||||
data?.getBullBearSay || {},
|
class="w-full mt-10 sm:mt-0 m-auto sm:pl-6 sm:pb-6 sm:pt-6 {data
|
||||||
)?.length !== 0
|
?.getWhyPriceMoved?.length !== 0
|
||||||
? ''
|
? ''
|
||||||
: 'hidden'}"
|
: 'hidden'}"
|
||||||
>
|
>
|
||||||
<BullBearSay {data} />
|
{#await import("$lib/components/WIIM.svelte") then { default: Comp }}
|
||||||
</div>
|
<svelte:component this={Comp} {data} />
|
||||||
|
{/await}
|
||||||
|
</div>
|
||||||
|
</Lazy>
|
||||||
|
|
||||||
<Lazy>
|
<div
|
||||||
<div
|
class="w-full mt-10 sm:mt-0 m-auto sm:pl-6 sm:pb-6 sm:pt-6 {data
|
||||||
class="w-full mt-10 sm:mt-0 m-auto sm:pl-6 sm:pb-6 sm:pt-6 {data
|
?.getNews?.length !== 0
|
||||||
?.getWhyPriceMoved?.length !== 0
|
? ''
|
||||||
? ''
|
: 'hidden'}"
|
||||||
: 'hidden'}"
|
>
|
||||||
>
|
<News {data} />
|
||||||
{#await import("$lib/components/WIIM.svelte") then { default: Comp }}
|
</div>
|
||||||
<svelte:component this={Comp} {data} />
|
|
||||||
{/await}
|
|
||||||
</div>
|
</div>
|
||||||
</Lazy>
|
|
||||||
|
|
||||||
<div
|
|
||||||
class="w-full mt-10 sm:mt-0 m-auto sm:pl-6 sm:pb-6 sm:pt-6 {data
|
|
||||||
?.getNews?.length !== 0
|
|
||||||
? ''
|
|
||||||
: 'hidden'}"
|
|
||||||
>
|
|
||||||
<News {data} />
|
|
||||||
</div>
|
</div>
|
||||||
<!--
|
|
||||||
<Lazy>
|
|
||||||
<div
|
|
||||||
class="w-full sm:pl-6 sm:pb-6 sm:pt-6 m-auto mb-5 {!$shareholderComponent
|
|
||||||
? 'hidden'
|
|
||||||
: ''}"
|
|
||||||
>
|
|
||||||
{#await import("$lib/components/ShareHolders.svelte") then { default: Comp }}
|
|
||||||
<svelte:component this={Comp} {data} />
|
|
||||||
{/await}
|
|
||||||
</div>
|
|
||||||
</Lazy>
|
|
||||||
-->
|
|
||||||
<!--End Shareholders-->
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -43,9 +43,7 @@
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<section
|
<section class="w-auto bg-[#09090B] overflow-hidden text-black h-full">
|
||||||
class="w-auto max-w-5xl bg-[#09090B] overflow-hidden text-black h-full mb-40"
|
|
||||||
>
|
|
||||||
<div class="m-auto h-full overflow-hidden">
|
<div class="m-auto h-full overflow-hidden">
|
||||||
<main class="w-full">
|
<main class="w-full">
|
||||||
<div class="m-auto">
|
<div class="m-auto">
|
||||||
|
|||||||
@ -369,9 +369,7 @@
|
|||||||
/>
|
/>
|
||||||
</svelte:head>
|
</svelte:head>
|
||||||
|
|
||||||
<section
|
<section class="bg-[#09090B] w-full overflow-hidden text-white h-full">
|
||||||
class="bg-[#09090B] w-full overflow-hidden text-white h-full pb-40 sm:mb-0"
|
|
||||||
>
|
|
||||||
<div class="w-full flex justify-center w-full sm-auto h-full overflow-hidden">
|
<div class="w-full flex justify-center w-full sm-auto h-full overflow-hidden">
|
||||||
<div
|
<div
|
||||||
class="w-full relative flex justify-center items-center overflow-hidden"
|
class="w-full relative flex justify-center items-center overflow-hidden"
|
||||||
|
|||||||
@ -450,9 +450,11 @@
|
|||||||
<!-- Add more Twitter meta tags as needed -->
|
<!-- Add more Twitter meta tags as needed -->
|
||||||
</svelte:head>
|
</svelte:head>
|
||||||
|
|
||||||
<section class="bg-[#09090B] overflow-hidden text-white h-full pb-40 sm:mb-0">
|
<section class="bg-[#09090B] overflow-hidden text-white h-full w-full">
|
||||||
<div class="flex justify-center w-full m-auto h-full overflow-hidden">
|
<div class="flex justify-center w-full m-auto h-full overflow-hidden">
|
||||||
<div class="relative flex justify-center items-center overflow-hidden">
|
<div
|
||||||
|
class="relative flex justify-center items-center overflow-hidden w-full"
|
||||||
|
>
|
||||||
<main class="w-full">
|
<main class="w-full">
|
||||||
<div class="sm:p-7 m-auto mt-2 sm:mt-0">
|
<div class="sm:p-7 m-auto mt-2 sm:mt-0">
|
||||||
<div class="mb-3">
|
<div class="mb-3">
|
||||||
|
|||||||
@ -395,9 +395,7 @@
|
|||||||
<!-- Add more Twitter meta tags as needed -->
|
<!-- Add more Twitter meta tags as needed -->
|
||||||
</svelte:head>
|
</svelte:head>
|
||||||
|
|
||||||
<section
|
<section class="w-full bg-[#09090B] overflow-hidden text-white h-full">
|
||||||
class="w-full bg-[#09090B] overflow-hidden text-white h-full pb-40 sm:mb-0"
|
|
||||||
>
|
|
||||||
<div class="flex justify-center w-full m-auto h-full overflow-hidden">
|
<div class="flex justify-center w-full m-auto h-full overflow-hidden">
|
||||||
<div
|
<div
|
||||||
class="relative flex justify-center items-center overflow-hidden w-full"
|
class="relative flex justify-center items-center overflow-hidden w-full"
|
||||||
|
|||||||
@ -359,7 +359,7 @@
|
|||||||
<!-- Add more Twitter meta tags as needed -->
|
<!-- Add more Twitter meta tags as needed -->
|
||||||
</svelte:head>
|
</svelte:head>
|
||||||
|
|
||||||
<section class="bg-[#09090B] overflow-hidden text-white h-full pb-40 sm:mb-0">
|
<section class="bg-[#09090B] overflow-hidden text-white h-full">
|
||||||
<div class="flex justify-center w-full m-auto h-full overflow-hidden">
|
<div class="flex justify-center w-full m-auto h-full overflow-hidden">
|
||||||
<div
|
<div
|
||||||
class="w-full relative flex justify-center items-center overflow-hidden"
|
class="w-full relative flex justify-center items-center overflow-hidden"
|
||||||
@ -890,7 +890,7 @@
|
|||||||
>Return on Assets (ROA)</td
|
>Return on Assets (ROA)</td
|
||||||
>
|
>
|
||||||
{#each ratios as item}
|
{#each ratios as item}
|
||||||
<td class="text-sm sm:text-[1rem]"
|
<td class="text-sm sm:text-[1rem] text-end"
|
||||||
>{(item?.returnOnAssets * 100)?.toFixed(2)}%</td
|
>{(item?.returnOnAssets * 100)?.toFixed(2)}%</td
|
||||||
>
|
>
|
||||||
{/each}
|
{/each}
|
||||||
|
|||||||
@ -57,9 +57,7 @@
|
|||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<section
|
<section class="w-full bg-[#09090B] overflow-hidden h-full">
|
||||||
class="w-auto max-w-5xl bg-[#09090B] overflow-hidden text-black h-full mb-40"
|
|
||||||
>
|
|
||||||
<div class="m-auto h-full overflow-hidden">
|
<div class="m-auto h-full overflow-hidden">
|
||||||
<main class="w-full">
|
<main class="w-full">
|
||||||
<div class="m-auto">
|
<div class="m-auto">
|
||||||
|
|||||||
@ -39,9 +39,7 @@
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<section
|
<section class="w-auto bg-[#09090B] overflow-hidden text-black h-full">
|
||||||
class="w-auto max-w-5xl bg-[#09090B] overflow-hidden text-black h-full mb-40"
|
|
||||||
>
|
|
||||||
<div class="m-auto h-full overflow-hidden">
|
<div class="m-auto h-full overflow-hidden">
|
||||||
<main class="w-full">
|
<main class="w-full">
|
||||||
<div class="m-auto">
|
<div class="m-auto">
|
||||||
|
|||||||
@ -59,7 +59,7 @@
|
|||||||
<div class="mb-6">
|
<div class="mb-6">
|
||||||
{#if Object?.keys(rawData)?.length !== 0}
|
{#if Object?.keys(rawData)?.length !== 0}
|
||||||
<div
|
<div
|
||||||
class="space-y-5 xs:space-y-6 lg:grid 2xl:grid-cols-2 2xl:space-x-10 lg:space-y-0"
|
class="space-y-5 xs:space-y-6 lg:grid lg:grid-cols-2 lg:space-x-10 lg:space-y-0"
|
||||||
>
|
>
|
||||||
<div class="flex flex-col space-y-5 xs:space-y-6 lg:space-y-8">
|
<div class="flex flex-col space-y-5 xs:space-y-6 lg:space-y-8">
|
||||||
<div
|
<div
|
||||||
|
|||||||
@ -0,0 +1,80 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import ArrowLogo from "lucide-svelte/icons/move-up-right";
|
||||||
|
|
||||||
|
export let data;
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<section class="w-full max-w-screen-2xl overflow-hidden min-h-screen lg:px-3">
|
||||||
|
<div class="w-full overflow-hidden m-auto">
|
||||||
|
<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">
|
||||||
|
<slot />
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
|
||||||
|
{#if data?.user?.tier !== "Pro" || data?.user?.freeTrial}
|
||||||
|
<div
|
||||||
|
class="w-full bg-[#141417] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-lg h-fit pb-4 mt-4 cursor-pointer"
|
||||||
|
>
|
||||||
|
<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">
|
||||||
|
Pro Subscription 🔥
|
||||||
|
</h2>
|
||||||
|
<ArrowLogo class="w-8 h-8 mr-3 flex-shrink-0" />
|
||||||
|
</div>
|
||||||
|
<span class="text-white p-3 ml-3 mr-3">
|
||||||
|
Upgrade now for unlimited access to all data and tools.
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="w-full bg-[#141417] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-lg h-fit pb-4 mt-4 cursor-pointer"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
href={"/price-alert"}
|
||||||
|
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">
|
||||||
|
Price Alert ⏰
|
||||||
|
</h2>
|
||||||
|
<ArrowLogo class="w-8 h-8 mr-3 flex-shrink-0" />
|
||||||
|
</div>
|
||||||
|
<span class="text-white p-3 ml-3 mr-3">
|
||||||
|
Customize your alerts to never miss out again
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="w-full bg-[#141417] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-lg h-fit pb-4 mt-4 cursor-pointer"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
href={"/stock-screener"}
|
||||||
|
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">
|
||||||
|
Stock Screener 🔎
|
||||||
|
</h2>
|
||||||
|
<ArrowLogo class="w-8 h-8 mr-3 flex-shrink-0" />
|
||||||
|
</div>
|
||||||
|
<span class="text-white p-3 ml-3 mr-3">
|
||||||
|
Build your Stock Screener to find profitable stocks.
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
@ -39,20 +39,15 @@
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function selectSortingMethod(state: string) {
|
|
||||||
sortBy = state;
|
|
||||||
}
|
|
||||||
|
|
||||||
function plotTotal() {
|
function plotTotal() {
|
||||||
let dateList = [];
|
let dateList = [];
|
||||||
let employeeList = [];
|
let employeeList = [];
|
||||||
let growthList = [];
|
|
||||||
|
|
||||||
for (let i = 0; i < employeeHistory?.length; i++) {
|
for (let i = 0; i < employeeHistory?.length; i++) {
|
||||||
const current = employeeHistory[i]?.employeeCount;
|
const current = employeeHistory[i]?.employeeCount;
|
||||||
//const previousDividend = i === 0 ? 0 : employeeHistory[i - 1]?.dividend;
|
//const previousDividend = i === 0 ? 0 : employeeHistory[i - 1]?.dividend;
|
||||||
|
|
||||||
dateList?.push(employeeHistory[i]?.filingDate);
|
dateList?.push(employeeHistory[i]?.filingDate?.slice(0, 4));
|
||||||
employeeList?.push(current);
|
employeeList?.push(current);
|
||||||
|
|
||||||
//const growthRate = ( (currentDividend - previousDividend) / previousDividend ) ;
|
//const growthRate = ( (currentDividend - previousDividend) / previousDividend ) ;
|
||||||
@ -74,6 +69,10 @@
|
|||||||
type: "category",
|
type: "category",
|
||||||
axisLabel: {
|
axisLabel: {
|
||||||
color: "#fff",
|
color: "#fff",
|
||||||
|
interval: 0, // Show all labels
|
||||||
|
rotate: 45, // Rotate labels for better readability
|
||||||
|
fontSize: 12, // Adjust font size if needed
|
||||||
|
margin: 10,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
yAxis: [
|
yAxis: [
|
||||||
@ -93,7 +92,6 @@
|
|||||||
name: "Total Employees",
|
name: "Total Employees",
|
||||||
data: employeeList,
|
data: employeeList,
|
||||||
type: "bar",
|
type: "bar",
|
||||||
barWidth: "80%",
|
|
||||||
smooth: true,
|
smooth: true,
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
@ -112,9 +110,8 @@
|
|||||||
for (let i = 0; i < employeeHistory?.length; i++) {
|
for (let i = 0; i < employeeHistory?.length; i++) {
|
||||||
const current = employeeHistory[i]?.employeeCount;
|
const current = employeeHistory[i]?.employeeCount;
|
||||||
const previous = i === 0 ? 0 : employeeHistory[i - 1]?.employeeCount;
|
const previous = i === 0 ? 0 : employeeHistory[i - 1]?.employeeCount;
|
||||||
|
|
||||||
const change = current - previous;
|
const change = current - previous;
|
||||||
dateList?.push(employeeHistory[i]?.filingDate);
|
dateList?.push(employeeHistory[i]?.filingDate?.slice(0, 4));
|
||||||
changeList?.push(change);
|
changeList?.push(change);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -132,6 +129,9 @@
|
|||||||
type: "category",
|
type: "category",
|
||||||
axisLabel: {
|
axisLabel: {
|
||||||
color: "#fff",
|
color: "#fff",
|
||||||
|
interval: 0, // Show all labels
|
||||||
|
rotate: 45, // Rotate labels for better readability
|
||||||
|
fontSize: 12, // Adjust font size if needed
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
yAxis: [
|
yAxis: [
|
||||||
@ -140,7 +140,6 @@
|
|||||||
splitLine: {
|
splitLine: {
|
||||||
show: false, // Disable x-axis grid lines
|
show: false, // Disable x-axis grid lines
|
||||||
},
|
},
|
||||||
|
|
||||||
axisLabel: {
|
axisLabel: {
|
||||||
show: false, // Hide y-axis labels
|
show: false, // Hide y-axis labels
|
||||||
},
|
},
|
||||||
@ -154,7 +153,6 @@
|
|||||||
barWidth: "80%",
|
barWidth: "80%",
|
||||||
smooth: true,
|
smooth: true,
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
// Define colors based on positive/negative values
|
|
||||||
color: function (params) {
|
color: function (params) {
|
||||||
return params.data >= 0 ? "#22C55E" : "#F71F4F";
|
return params.data >= 0 ? "#22C55E" : "#F71F4F";
|
||||||
},
|
},
|
||||||
@ -184,7 +182,7 @@
|
|||||||
growthList?.push(0); // Pushing null if the growth calculation is not possible
|
growthList?.push(0); // Pushing null if the growth calculation is not possible
|
||||||
}
|
}
|
||||||
|
|
||||||
dateList?.push(employeeHistory[i]?.filingDate);
|
dateList?.push(employeeHistory[i]?.filingDate?.slice(0, 4));
|
||||||
}
|
}
|
||||||
|
|
||||||
const options = {
|
const options = {
|
||||||
@ -201,6 +199,10 @@
|
|||||||
type: "category",
|
type: "category",
|
||||||
axisLabel: {
|
axisLabel: {
|
||||||
color: "#fff",
|
color: "#fff",
|
||||||
|
interval: 0, // Show all labels
|
||||||
|
rotate: 45, // Rotate labels for better readability
|
||||||
|
fontSize: 12, // Adjust font size if needed
|
||||||
|
margin: 10,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
yAxis: [
|
yAxis: [
|
||||||
@ -588,22 +590,22 @@
|
|||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th
|
<th
|
||||||
class="text-start border-b border-[#09090B] bg-[#09090B] text-white text-sm whitespace-nowrap font-semibiold"
|
class="text-start border-b border-[#09090B] bg-[#09090B] text-white text-sm whitespace-nowrap font-semibold"
|
||||||
>
|
>
|
||||||
Date
|
Date
|
||||||
</th>
|
</th>
|
||||||
<th
|
<th
|
||||||
class="text-end border-b border-[#09090B] bg-[#09090B] text-white text-sm whitespace-nowrap font-semibiold"
|
class="text-end border-b border-[#09090B] bg-[#09090B] text-white text-sm whitespace-nowrap font-semibold"
|
||||||
>
|
>
|
||||||
Employees
|
Employees
|
||||||
</th>
|
</th>
|
||||||
<th
|
<th
|
||||||
class="text-end border-b border-[#09090B] bg-[#09090B] text-white text-sm whitespace-nowrap font-semibiold"
|
class="text-end border-b border-[#09090B] bg-[#09090B] text-white text-sm whitespace-nowrap font-semibold"
|
||||||
>
|
>
|
||||||
Change
|
Change
|
||||||
</th>
|
</th>
|
||||||
<th
|
<th
|
||||||
class="text-end border-b border-[#09090B] bg-[#09090B] text-white text-sm whitespace-nowrap font-semibiold"
|
class="text-end border-b border-[#09090B] bg-[#09090B] text-white text-sm whitespace-nowrap font-semibold"
|
||||||
>
|
>
|
||||||
Growth
|
Growth
|
||||||
</th>
|
</th>
|
||||||
@ -630,16 +632,20 @@
|
|||||||
<td
|
<td
|
||||||
class="text-end border-b border-[#09090B] text-sm sm:text-[1rem] whitespace-nowrap text-white"
|
class="text-end border-b border-[#09090B] text-sm sm:text-[1rem] whitespace-nowrap text-white"
|
||||||
>
|
>
|
||||||
{abbreviateNumber(
|
{#if Number(item?.employeeCount - historyList[index + 1]?.employeeCount)}
|
||||||
item?.employeeCount -
|
{new Intl.NumberFormat("en")?.format(
|
||||||
historyList[index + 1]?.employeeCount,
|
item?.employeeCount -
|
||||||
)}
|
historyList[index + 1]?.employeeCount,
|
||||||
|
)}
|
||||||
|
{:else}
|
||||||
|
-
|
||||||
|
{/if}
|
||||||
</td>
|
</td>
|
||||||
<td
|
<td
|
||||||
class="text-end border-b border-[#09090B] text-sm sm:text-[1rem] whitespace-nowrap text-white text-end"
|
class="text-end border-b border-[#09090B] text-sm sm:text-[1rem] whitespace-nowrap text-white text-end"
|
||||||
>
|
>
|
||||||
{#if index + 1 - historyList?.length === 0}
|
{#if index + 1 - historyList?.length === 0}
|
||||||
0.00%
|
-
|
||||||
{:else if item?.employeeCount - historyList[index + 1]?.employeeCount > 0}
|
{:else if item?.employeeCount - historyList[index + 1]?.employeeCount > 0}
|
||||||
<span class="text-[#37C97D]">
|
<span class="text-[#37C97D]">
|
||||||
+{(
|
+{(
|
||||||
@ -659,7 +665,7 @@
|
|||||||
)?.toFixed(2)}%
|
)?.toFixed(2)}%
|
||||||
</span>
|
</span>
|
||||||
{:else}
|
{:else}
|
||||||
0.00%
|
-
|
||||||
{/if}
|
{/if}
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
|||||||
@ -0,0 +1,82 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
import ArrowLogo from "lucide-svelte/icons/move-up-right";
|
||||||
|
|
||||||
|
export let data;
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<section
|
||||||
|
class="w-full max-w-3xl sm:max-w-screen-2xl overflow-hidden min-h-screen pt-5 pb-40 lg:px-3"
|
||||||
|
>
|
||||||
|
<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">
|
||||||
|
<slot />
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
|
||||||
|
{#if data?.user?.tier !== "Pro" || data?.user?.freeTrial}
|
||||||
|
<div
|
||||||
|
class="w-full bg-[#141417] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-lg h-fit pb-4 mt-4 cursor-pointer"
|
||||||
|
>
|
||||||
|
<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">
|
||||||
|
Pro Subscription 🔥
|
||||||
|
</h2>
|
||||||
|
<ArrowLogo class="w-8 h-8 mr-3 flex-shrink-0" />
|
||||||
|
</div>
|
||||||
|
<span class="text-white p-3 ml-3 mr-3">
|
||||||
|
Upgrade now for unlimited access to all data and tools.
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="w-full bg-[#141417] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-lg h-fit pb-4 mt-4 cursor-pointer"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
href={"/price-alert"}
|
||||||
|
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">
|
||||||
|
Price Alert ⏰
|
||||||
|
</h2>
|
||||||
|
<ArrowLogo class="w-8 h-8 mr-3 flex-shrink-0" />
|
||||||
|
</div>
|
||||||
|
<span class="text-white p-3 ml-3 mr-3">
|
||||||
|
Customize your alerts to never miss out again
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="w-full bg-[#141417] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-lg h-fit pb-4 mt-4 cursor-pointer"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
href={"/stock-screener"}
|
||||||
|
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">
|
||||||
|
Stock Screener 🔎
|
||||||
|
</h2>
|
||||||
|
<ArrowLogo class="w-8 h-8 mr-3 flex-shrink-0" />
|
||||||
|
</div>
|
||||||
|
<span class="text-white p-3 ml-3 mr-3">
|
||||||
|
Build your Stock Screener to find profitable stocks.
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
@ -1,20 +1,10 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import ArrowLogo from "lucide-svelte/icons/move-up-right";
|
import ArrowLogo from "lucide-svelte/icons/move-up-right";
|
||||||
import { goto } from "$app/navigation";
|
|
||||||
import { page } from "$app/stores";
|
import { page } from "$app/stores";
|
||||||
|
|
||||||
export let data;
|
export let data;
|
||||||
let cloudFrontUrl = import.meta.env.VITE_IMAGE_URL;
|
let cloudFrontUrl = import.meta.env.VITE_IMAGE_URL;
|
||||||
|
|
||||||
function handleMode(i) {
|
|
||||||
activeIdx = i;
|
|
||||||
if (activeIdx === 0) {
|
|
||||||
goto("/watchlist/stocks");
|
|
||||||
} else if (activeIdx === 1) {
|
|
||||||
goto("/watchlist/options");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const tabs = [
|
const tabs = [
|
||||||
{
|
{
|
||||||
title: "Stocks",
|
title: "Stocks",
|
||||||
@ -152,10 +142,10 @@
|
|||||||
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
|
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
|
||||||
{#if data?.user?.tier !== "Pro" || data?.user?.freeTrial}
|
{#if data?.user?.tier !== "Pro" || data?.user?.freeTrial}
|
||||||
<div
|
<div
|
||||||
on:click={() => goto("/pricing")}
|
|
||||||
class="w-full bg-[#141417] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-lg h-fit pb-4 mt-4 cursor-pointer"
|
class="w-full bg-[#141417] duration-100 ease-out sm:hover:text-white text-gray-400 sm:hover:border-gray-700 border border-gray-800 rounded-lg h-fit pb-4 mt-4 cursor-pointer"
|
||||||
>
|
>
|
||||||
<div
|
<a
|
||||||
|
href="/pricing"
|
||||||
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
|
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">
|
<div class="w-full flex justify-between items-center p-3 mt-3">
|
||||||
@ -167,7 +157,7 @@
|
|||||||
<span class="text-white p-3 ml-3 mr-3">
|
<span class="text-white p-3 ml-3 mr-3">
|
||||||
Upgrade now for unlimited access to all data and tools.
|
Upgrade now for unlimited access to all data and tools.
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user