AmineTMIRI/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ui fix

Browse Source
This commit is contained in:
MuslemRahimi 2025-03-10 12:16:37 +01:00
parent bb3a09bc67
commit dc74fb0d38
24 changed files with 407 additions and 373 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/lib/components/DownloadData.svelte
View File

@ -54,9 +54,9 @@
<Button <Button
on:click={() => exportData("csv")} on:click={() => exportData("csv")}
class="w-full border-gray-600 border bg-default sm:hover:bg-primary ease-out flex flex-row justify-between items-center px-3 py-2 text-white rounded-md truncate" class="w-full border-gray-300 shadow-sm dark:border-gray-600 border sm:hover:bg-gray-100 dark:sm:hover:bg-primary ease-out flex flex-row justify-between items-center px-3 py-2 rounded-md truncate"
> >
<span class="truncate text-white">Download</span> <span class="truncate">Download</span>
<svg <svg
class="{['Pro', 'Plus']?.includes(data?.user?.tier) class="{['Pro', 'Plus']?.includes(data?.user?.tier)
? 'hidden' ? 'hidden'
@ -64,7 +64,7 @@
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24" viewBox="0 0 24 24"
><path ><path
fill="#fff" fill="currentColor"
d="M17 9V7c0-2.8-2.2-5-5-5S7 4.2 7 7v2c-1.7 0-3 1.3-3 3v7c0 1.7 1.3 3 3 3h10c1.7 0 3-1.3 3-3v-7c0-1.7-1.3-3-3-3M9 7c0-1.7 1.3-3 3-3s3 1.3 3 3v2H9z" d="M17 9V7c0-2.8-2.2-5-5-5S7 4.2 7 7v2c-1.7 0-3 1.3-3 3v7c0 1.7 1.3 3 3 3h10c1.7 0 3-1.3 3-3v-7c0-1.7-1.3-3-3-3M9 7c0-1.7 1.3-3 3-3s3 1.3 3 3v2H9z"
/></svg /></svg
> >

4
src/lib/components/NextEarnings.svelte
View File

@ -69,10 +69,10 @@
{#if !["Pro", "Plus"]?.includes(data?.user?.tier)} {#if !["Pro", "Plus"]?.includes(data?.user?.tier)}
... Unlock content with ... Unlock content with
<a <a
class="inline-block ml-0.5 text-blue-400 sm:hover:text-white" class="inline-block ml-0.5 text-blue-500 sm:hover:text-muted dark:text-blue-400 dark:sm:hover:text-white"
href="/pricing" href="/pricing"
>Pro Subscription <svg >Pro Subscription <svg
class="w-4 h-4 mb-1 inline-block text[#A3A3A3] sm:hover:text-white" class="w-4 h-4 mb-1 inline-block"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24" viewBox="0 0 24 24"
><path ><path

64
src/lib/components/Table/Table.svelte
View File

@ -694,16 +694,18 @@
<!-- Content area --> <!-- Content area -->
<div class="flex flex-row items-end justify-end w-fit ml-auto mt-5 mb-2"> <div
class="flex flex-row items-end justify-end w-fit ml-auto mt-5 text-muted dark:text-white"
>
<DownloadData {data} {rawData} title={data?.getParams ?? "data"} /> <DownloadData {data} {rawData} title={data?.getParams ?? "data"} />
<DropdownMenu.Root> <DropdownMenu.Root>
<DropdownMenu.Trigger asChild let:builder> <DropdownMenu.Trigger asChild let:builder>
<Button <Button
builders={[builder]} builders={[builder]}
class=" min-w-[110px] w-fit ml-3 border-gray-600 border bg-default sm:hover:bg-primary ease-out flex flex-row justify-between items-center px-3 py-2.5 text-white rounded-md" class="shadow-sm min-w-[110px] w-fit ml-3 border-gray-300 dark:border-gray-600 border sm:hover:bg-gray-100 dark:sm:hover:bg-primary ease-out flex flex-row justify-between items-center px-3 py-2.5 rounded-md"
> >
<span class="w-fit text-white text-sm sm:text-[1rem]">Indicators</span> <span class="w-fit text-sm sm:text-[1rem]">Indicators</span>
<svg <svg
class="ml-0.5 mt-1 h-5 w-5 inline-block shrink-0" class="ml-0.5 mt-1 h-5 w-5 inline-block shrink-0"
viewBox="0 0 20 20" viewBox="0 0 20 20"
@ -725,7 +727,7 @@
> >
<!-- Search Input --> <!-- Search Input -->
<div <div
class="sticky fixed -top-1 z-40 bg-default p-2 border-b border-gray-600" class="sticky fixed -top-1 z-40 bg-white dark:bg-default p-2 border-b border-gray-300 dark:border-gray-600"
> >
<div class="relative w-full"> <div class="relative w-full">
<!-- Input Field --> <!-- Input Field -->
@ -734,7 +736,7 @@
on:input={handleInput} on:input={handleInput}
autocomplete="off" autocomplete="off"
autofocus="" autofocus=""
class="text-sm w-full border-0 bg-default focus:border-gray-200 focus:ring-0 text-white placeholder:text-gray-300 pr-8" class="text-sm w-full border-0 bg-white dark:bg-default focus:border-gray-200 focus:ring-0 placeholder:text-muted dark:text-gray-300 pr-8"
type="text" type="text"
placeholder="" placeholder=""
/> />
@ -769,14 +771,16 @@
<DropdownMenu.Group class="pb-2"> <DropdownMenu.Group class="pb-2">
<!-- Added padding to avoid overlapping with Reset button --> <!-- Added padding to avoid overlapping with Reset button -->
{#each searchQuery?.length !== 0 ? testList : allRows as item} {#each searchQuery?.length !== 0 ? testList : allRows as item}
<DropdownMenu.Item class="sm:hover:bg-primary"> <DropdownMenu.Item
class="sm:hover:bg-gray-200 dark:sm:hover:bg-primary"
>
<div class="flex items-center"> <div class="flex items-center">
{#if defaultRules?.includes(item?.rule)} {#if defaultRules?.includes(item?.rule)}
<label <label
on:click|capture={(event) => { on:click|capture={(event) => {
event.preventDefault(); event.preventDefault();
}} }}
class="text-white" class=""
> >
<input <input
disabled={defaultRules?.includes(item?.rule) ? true : false} disabled={defaultRules?.includes(item?.rule) ? true : false}
@ -794,7 +798,7 @@
event.preventDefault(); event.preventDefault();
handleChangeValue(item?.name); handleChangeValue(item?.name);
}} }}
class="cursor-pointer text-white" class="cursor-pointer"
for={item?.name} for={item?.name}
> >
<input <input
@ -808,7 +812,7 @@
<span class="ml-2">{item?.name}</span> <span class="ml-2">{item?.name}</span>
</label> </label>
{:else} {:else}
<a href="/pricing" class="cursor-pointer text-white"> <a href="/pricing" class="cursor-pointer">
<svg <svg
class="h-[18px] w-[18px] inline-block text-icon group-hover:text-dark-400" class="h-[18px] w-[18px] inline-block text-icon group-hover:text-dark-400"
viewBox="0 0 20 20" viewBox="0 0 20 20"
@ -830,17 +834,17 @@
</DropdownMenu.Group> </DropdownMenu.Group>
<!-- Reset Selection button --> <!-- Reset Selection button -->
<div <div
class="sticky -bottom-1 bg-default z-50 p-2 border-t border-gray-600 w-full flex justify-between items-center" class="sticky -bottom-1 bg-white dark:bg-default z-50 p-2 border-t border-gray-300 dark:border-gray-600 w-full flex justify-between items-center"
> >
<label <label
on:click={handleResetAll} on:click={handleResetAll}
class="w-full sm:hover:text-white text-gray-300 bg-default text-start text-sm cursor-pointer" class="w-full dark:sm:hover:text-white text-muted dark:text-gray-300 bg-white dark:bg-default text-start text-sm cursor-pointer"
> >
Reset Selection Reset Selection
</label> </label>
<label <label
on:click={handleSelectAll} on:click={handleSelectAll}
class="w-full flex justify-end sm:hover:text-white text-gray-300 bg-default text-start text-sm cursor-pointer" class="w-full flex justify-end dark:sm:hover:text-white text-muted dark:text-gray-300 bg-white dark:bg-default text-start text-sm cursor-pointer"
> >
Select All Select All
</label> </label>
@ -849,9 +853,9 @@
</DropdownMenu.Root> </DropdownMenu.Root>
</div> </div>
<div class="w-full overflow-x-auto text-white"> <div class="w-full overflow-x-auto text-muted dark:text-white">
<table <table
class="table table-sm table-compact rounded-none sm:rounded-md w-full bg-table border border-gray-800 m-auto mt-4" class="table table-sm table-compact rounded-none sm:rounded-md w-full bg-white dark:bg-table border border-gray-300 dark:border-gray-800 m-auto mt-2"
> >
<thead> <thead>
<TableHeader {columns} {sortOrders} {sortData} /> <TableHeader {columns} {sortOrders} {sortData} />
@ -859,7 +863,7 @@
<tbody> <tbody>
{#each stockList as item, index} {#each stockList as item, index}
<tr <tr
class="sm:hover:bg-[#245073]/10 odd:bg-odd border-b border-gray-800 {index + class="sdark:sm:hover:bg-[#245073]/10 odd:bg-[#F6F7F8] dark:odd:bg-odd {index +
1 === 1 ===
rawData?.length && rawData?.length &&
!['Pro', 'Plus']?.includes(data?.user?.tier) && !['Pro', 'Plus']?.includes(data?.user?.tier) &&
@ -869,7 +873,7 @@
> >
{#each columns as column} {#each columns as column}
<td <td
class="text-sm sm:text-[1rem] whitespace-nowrap border-b border-gray-800" class="text-sm sm:text-[1rem] whitespace-nowrap"
class:text-left={column.align === "left"} class:text-left={column.align === "left"}
class:text-right={column.align === "right"} class:text-right={column.align === "right"}
> >
@ -897,11 +901,11 @@
{item[column.key]?.toLocaleString("en-US")} {item[column.key]?.toLocaleString("en-US")}
{:else if column?.type === "decimalSign"} {:else if column?.type === "decimalSign"}
{#if item[column.key] >= 0} {#if item[column.key] >= 0}
<span class="text-[#00FC50]" <span class="text-green-600 dark:text-[#00FC50]"
>+{item[column.key]?.toLocaleString("en-US")}</span >+{item[column.key]?.toLocaleString("en-US")}</span
> >
{:else if item[column.key] < 0} {:else if item[column.key] < 0}
<span class="text-[#FF2F1F]" <span class="text-red-600 dark:text-[#FF2F1F]"
>{item[column.key]?.toLocaleString("en-US")}</span >{item[column.key]?.toLocaleString("en-US")}</span
> >
{/if} {/if}
@ -918,8 +922,8 @@
<span <span
class="inline-flex rounded-full h-1 w-1 {item?.previous > class="inline-flex rounded-full h-1 w-1 {item?.previous >
item[column?.key] item[column?.key]
? 'bg-[#FF2F1F]' ? 'bg-red-600 dark:bg-[#FF2F1F]'
: 'bg-[#00FC50]'} pulse-animation" : 'bg-green-600 dark:bg-[#00FC50]'} pulse-animation"
></span> ></span>
</span> </span>
{/if} {/if}
@ -933,23 +937,25 @@
: "< 0.01%"} : "< 0.01%"}
{:else if column.type === "percentSign"} {:else if column.type === "percentSign"}
{#if item[column.key] > 0} {#if item[column.key] > 0}
<span class="text-[#00FC50]" <span class="text-green-600 dark:text-[#00FC50]"
>+{abbreviateNumber(item[column.key]?.toFixed(2))}%</span >+{abbreviateNumber(item[column.key]?.toFixed(2))}%</span
> >
{:else if item[column.key] < 0} {:else if item[column.key] < 0}
<span class="text-[#FF2F1F]" <span class="text-red-600 dark:text-[#FF2F1F]"
>{abbreviateNumber(item[column.key]?.toFixed(2))}%</span >{abbreviateNumber(item[column.key]?.toFixed(2))}%</span
> >
{:else} {:else}
<span class="text-[#fff]" <span>{item[column.key]?.toFixed(2)}%</span>
>{item[column.key]?.toFixed(2)}%</span
>
{/if} {/if}
{:else if column?.type === "rating"} {:else if column?.type === "rating"}
{#if ["Strong Buy", "Buy"].includes(item[column.key])} {#if ["Strong Buy", "Buy"].includes(item[column.key])}
<span class="text-[#00FC50]">{item[column.key]}</span> <span class="text-green-600 dark:text-[#00FC50]"
>{item[column.key]}</span
>
{:else if ["Strong Sell", "Sell"].includes(item[column.key])} {:else if ["Strong Sell", "Sell"].includes(item[column.key])}
<span class="text-[#FF2F1F]">{item[column.key]}</span> <span class="text-red-600 dark:text-[#FF2F1F]"
>{item[column.key]}</span
>
{:else if item[column.key] === "Hold"} {:else if item[column.key] === "Hold"}
<span class="text-[#FFA838]">{item[column.key]}</span> <span class="text-[#FFA838]">{item[column.key]}</span>
{:else} {:else}
@ -958,10 +964,10 @@
{:else if column.type === "sentiment"} {:else if column.type === "sentiment"}
<div <div
class={item[column.key] >= 55 class={item[column.key] >= 55
? "text-[#00FC50]" ? "text-green-600 dark:text-[#00FC50]"
: item[column.key] >= 50 : item[column.key] >= 50
? "text-[#E57C34]" ? "text-[#E57C34]"
: "text-[#FF2F1F]"} : "text-red-600 dark:text-[#FF2F1F]"}
> >
<div class="flex flex-row items-center justify-end"> <div class="flex flex-row items-center justify-end">
<div class=""> <div class="">

4
src/lib/components/WIIM.svelte
View File

@ -181,10 +181,10 @@
{item?.text?.slice(0, 50) + "..."} {item?.text?.slice(0, 50) + "..."}
Unlock content with Unlock content with
<a <a
class="inline-block ml-0.5 text-blue-400 sm:hover:text-white" class="inline-block ml-0.5 text-blue-500 sm:hover:text-muted dark:text-blue-400 dark:sm:hover:text-white"
href="/pricing" href="/pricing"
>Pro Subscription <svg >Pro Subscription <svg
class="w-4 h-4 mb-1 inline-block text[#A3A3A3] sm:hover:text-white" class="w-4 h-4 mb-1 inline-block"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24" viewBox="0 0 24 24"
><path ><path

5
src/lib/components/shadcn/calendar/calendar-grid-body.svelte
View File

@ -8,6 +8,9 @@
export { className as class }; export { className as class };
</script> </script>
<CalendarPrimitive.GridBody class={cn(className)} {...$$restProps}> <CalendarPrimitive.GridBody
class={cn("bg-white dark:bg-[#000]", className)}
{...$$restProps}
>
<slot /> <slot />
</CalendarPrimitive.GridBody> </CalendarPrimitive.GridBody>

5
src/lib/components/shadcn/calendar/calendar-grid-head.svelte
View File

@ -8,6 +8,9 @@
export { className as class }; export { className as class };
</script> </script>
<CalendarPrimitive.GridHead class={cn(className)} {...$$restProps}> <CalendarPrimitive.GridHead
class={cn("bg-white dark:bg-[#000]", className)}
{...$$restProps}
>
<slot /> <slot />
</CalendarPrimitive.GridHead> </CalendarPrimitive.GridHead>

5
src/lib/components/shadcn/calendar/calendar-grid-row.svelte
View File

@ -8,6 +8,9 @@
export { className as class }; export { className as class };
</script> </script>
<CalendarPrimitive.GridRow class={cn("flex", className)} {...$$restProps}> <CalendarPrimitive.GridRow
class={cn("bg-white dark:bg-[#000] flex", className)}
{...$$restProps}
>
<slot /> <slot />
</CalendarPrimitive.GridRow> </CalendarPrimitive.GridRow>

5
src/lib/components/shadcn/calendar/calendar-grid.svelte
View File

@ -8,6 +8,9 @@
export { className as class }; export { className as class };
</script> </script>
<CalendarPrimitive.Grid class={cn("w-full border-none space-y-1", className)} {...$$restProps}> <CalendarPrimitive.Grid
class={cn("w-full bg-white dark:bg-[#000] border-none space-y-1", className)}
{...$$restProps}
>
<slot /> <slot />
</CalendarPrimitive.Grid> </CalendarPrimitive.Grid>

5
src/lib/components/shadcn/calendar/calendar-head-cell.svelte
View File

@ -9,7 +9,10 @@
</script> </script>
<CalendarPrimitive.HeadCell <CalendarPrimitive.HeadCell
class={cn("text-white w-9 rounded-md text-[0.8rem] font-normal", className)} class={cn(
"bg-white dark:bg-[#000] text-muted dark:text-white w-9 rounded-md text-[0.8rem] font-normal",
className,
)}
{...$$restProps} {...$$restProps}
> >
<slot /> <slot />

5
src/lib/components/shadcn/calendar/calendar-header.svelte
View File

@ -9,7 +9,10 @@
</script> </script>
<CalendarPrimitive.Header <CalendarPrimitive.Header
class={cn("relative flex w-full items-center justify-between pt-1", className)} class={cn(
"bg-white dark:bg-[#000] relative flex w-full items-center justify-between pt-1",
className,
)}
{...$$restProps} {...$$restProps}
> >
<slot /> <slot />

2
src/lib/components/shadcn/calendar/calendar-heading.svelte
View File

@ -10,7 +10,7 @@
<CalendarPrimitive.Heading <CalendarPrimitive.Heading
let:headingValue let:headingValue
class={cn("text-sm ", className)} class={cn("text-sm bg-white dark:bg-[#000]", className)}
{...$$restProps} {...$$restProps}
> >
<slot {headingValue}> <slot {headingValue}>

5
src/lib/components/shadcn/calendar/calendar-months.svelte
View File

@ -9,7 +9,10 @@
</script> </script>
<div <div
class={cn("mt-4 text-white flex flex-col space-y-4 sm:flex-row sm:space-x-4 sm:space-y-0", className)} class={cn(
"bg-white dark:bg-[#000] mt-4 text-muted dark:text-white flex flex-col space-y-4 sm:flex-row sm:space-x-4 sm:space-y-0",
className,
)}
{...$$restProps} {...$$restProps}
> >
<slot /> <slot />

4
src/lib/components/shadcn/calendar/calendar-next-button.svelte
View File

@ -15,8 +15,8 @@
on:click on:click
class={cn( class={cn(
buttonVariants({ variant: "outline" }), buttonVariants({ variant: "outline" }),
"h-7 w-7 bg-transparent p-0 opacity-80 hover:opacity-100", "h-7 w-7 p-0 opacity-80 hover:opacity-100",
className className,
)} )}
{...$$restProps} {...$$restProps}
let:builder let:builder

4
src/lib/components/shadcn/calendar/calendar-prev-button.svelte
View File

@ -15,8 +15,8 @@
on:click on:click
class={cn( class={cn(
buttonVariants({ variant: "outline" }), buttonVariants({ variant: "outline" }),
"h-7 w-7 bg-transparent p-0 opacity-80 hover:opacity-100", "h-7 w-7 p-0 opacity-80 hover:opacity-100",
className className,
)} )}
{...$$restProps} {...$$restProps}
let:builder let:builder

13
src/lib/components/shadcn/calendar/calendar.svelte
View File

@ -13,14 +13,13 @@
let className: $$Props["class"] = undefined; let className: $$Props["class"] = undefined;
export { className as class }; export { className as class };
</script> </script>
<CalendarPrimitive.Root <CalendarPrimitive.Root
bind:value bind:value
bind:placeholder bind:placeholder
{weekdayFormat} {weekdayFormat}
class={cn("p-3", className)} class={cn("p-3 ", className)}
{...$$restProps} {...$$restProps}
on:keydown on:keydown
let:months let:months
@ -31,13 +30,13 @@
<Calendar.Heading /> <Calendar.Heading />
<Calendar.NextButton /> <Calendar.NextButton />
</Calendar.Header> </Calendar.Header>
<Calendar.Months > <Calendar.Months>
{#each months as month} {#each months as month}
<Calendar.Grid> <Calendar.Grid>
<Calendar.GridHead > <Calendar.GridHead class="">
<Calendar.GridRow class="flex"> <Calendar.GridRow class="flex ">
{#each weekdays as weekday} {#each weekdays as weekday}
<Calendar.HeadCell class="text-white"> <Calendar.HeadCell class="text-muted dark:text-white ">
{weekday.slice(0, 2)} {weekday.slice(0, 2)}
</Calendar.HeadCell> </Calendar.HeadCell>
{/each} {/each}
@ -45,7 +44,7 @@
</Calendar.GridHead> </Calendar.GridHead>
<Calendar.GridBody> <Calendar.GridBody>
{#each month.weeks as weekDates} {#each month.weeks as weekDates}
<Calendar.GridRow class="mt-2 w-full"> <Calendar.GridRow class="mt-2 w-full ">
{#each weekDates as date} {#each weekDates as date}
<Calendar.Cell {date}> <Calendar.Cell {date}>
<Calendar.Day {date} month={month.value} /> <Calendar.Day {date} month={month.value} />

2
src/routes/+layout.svelte
View File

@ -275,7 +275,7 @@
</script> </script>
</svelte:head> </svelte:head>
<div class="app {$page?.url?.pathname === '/' ? 'bg-[#000]' : ''}"> <div class="app text-muted dark:text-white {$page?.url?.pathname === '/' ? 'bg-[#000]' : ''}">
<div class="flex min-h-screen w-full flex-col bg-white dark:bg-default"> <div class="flex min-h-screen w-full flex-col bg-white dark:bg-default">
<div class="w-full"> <div class="w-full">
<div <div

44
src/routes/etf/+page.svelte
View File

@ -19,8 +19,8 @@
> >
<div class="text-sm sm:text-[1rem] breadcrumbs"> <div class="text-sm sm:text-[1rem] breadcrumbs">
<ul> <ul>
<li><a href="/" class="text-gray-300">Home</a></li> <li><a href="/" class="text-muted dark:text-gray-300">Home</a></li>
<li class="text-gray-300">All ETFs</li> <li class="text-muted dark:text-gray-300">All ETFs</li>
</ul> </ul>
</div> </div>
@ -30,16 +30,14 @@
class="relative flex justify-center items-start overflow-hidden w-full" class="relative flex justify-center items-start overflow-hidden w-full"
> >
<main class="w-full lg:w-3/4 lg:pr-5"> <main class="w-full lg:w-3/4 lg:pr-5">
<div class="mb-6 border-b-[2px]"> <div class=" 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">All ETF Symbols</h1>
All ETF Symbols <p class="mb-3 px-1 font-semibold sm:px-0">
</h1>
<p class="mb-3 px-1 text-base font-semibold text-muted sm:px-0">
List of all {rawData?.length} ETF symbols we support List of all {rawData?.length} ETF symbols we support
</p> </p>
</div> </div>
<div class="w-full m-auto mb-10 bg-default"> <div class="w-full m-auto">
<!--Start Top Winners/Losers--> <!--Start Top Winners/Losers-->
<div class="flex flex-col justify-center items-center"> <div class="flex flex-col justify-center items-center">
<Table {data} {rawData} /> <Table {data} {rawData} />
@ -49,19 +47,21 @@
<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 !["Pro", "Plus"]?.includes(data?.user?.tier) || data?.user?.freeTrial} {#if !["Pro", "Plus"]?.includes(data?.user?.tier) || data?.user?.freeTrial}
<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 <a
href="/pricing" 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">
<h2 class="text-start text-xl font-semibold text-white ml-3"> <h2 class="text-start text-xl font-semibold e ml-3">
Pro Subscription Pro Subscription
</h2> </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> </div>
<span class="text-white p-3 ml-3 mr-3"> <span class="e 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>
</a> </a>
@ -69,38 +69,42 @@
{/if} {/if}
<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 <a
href="/analysts" href="/analysts"
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">
<h2 class="text-start text-xl font-semibold text-white ml-3"> <h2 class="text-start text-xl font-semibold e ml-3">
Top Analyst Top Analyst
</h2> </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> </div>
<span class="text-white p-3 ml-3 mr-3"> <span class="e p-3 ml-3 mr-3">
Get the latest top Wall Street analyst ratings Get the latest top Wall Street analyst ratings
</span> </span>
</a> </a>
</div> </div>
<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 <a
href="/analysts/top-stocks" href="/analysts/top-stocks"
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">
<h2 class="text-start text-xl font-semibold text-white ml-3"> <h2 class="text-start text-xl font-semibold e ml-3">
Top Stocks Picks Top Stocks Picks
</h2> </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> </div>
<span class="text-white p-3 ml-3 mr-3"> <span class="e p-3 ml-3 mr-3">
Get the latest top Wall Street analyst ratings. Get the latest top Wall Street analyst ratings.
</span> </span>
</a> </a>

20
src/routes/market-mover/+layout.svelte
View File

@ -45,12 +45,12 @@
</script> </script>
<section <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"> <div class="text-sm sm:text-[1rem] breadcrumbs">
<ul> <ul>
<li><a href="/" class="text-gray-300">Home</a></li> <li><a href="/" class="text-muted dark:text-gray-300">Home</a></li>
<li class="text-gray-300">Market Mover</li> <li class="text-muted dark:text-gray-300">Market Mover</li>
</ul> </ul>
</div> </div>
@ -60,20 +60,20 @@
class="relative flex justify-center items-start overflow-hidden w-full" class="relative flex justify-center items-start overflow-hidden w-full"
> >
<main class="w-full lg:pr-5"> <main class="w-full lg:pr-5">
<h1 class="mb-6 text-white text-2xl sm:text-3xl font-bold"> <h1 class="mb-6 text-2xl sm:text-3xl font-bold">Market Mover</h1>
Market Mover
</h1>
<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 <ul
class="flex flex-row items-center w-full text-[1rem] sm:text-lg text-white" class="flex flex-row items-center w-full text-[1rem] sm:text-lg"
> >
{#each tabs as item, index} {#each tabs as item, index}
<a <a
href={item?.path} href={item?.path}
class="p-2 px-5 cursor-pointer {activeIdx === index class="p-2 px-5 cursor-pointer {activeIdx === index
? 'text-white bg-primary/90' ? 'text-muted dark:text-white bg-[#EEEEEE] dark:bg-primary/90 font-semibold'
: 'text-gray-400 sm:hover:text-white sm:hover:bg-primary/90'}" : '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} {item.title}
</a> </a>

34
src/routes/market-mover/gainers/+layout.svelte
View File

@ -40,7 +40,9 @@
description="A list of the stocks with the highest percentage gain, highest percentage loss and most active today. See stock price, volume, market cap and more." description="A list of the stocks with the highest percentage gain, highest percentage loss and most active today. See stock price, volume, market cap and more."
/> />
<section class="w-full overflow-hidden m-auto min-h-screen"> <section
class="w-full overflow-hidden m-auto min-h-screen text-muted dark:text-white"
>
<div class="flex justify-center w-full m-auto overflow-hidden"> <div class="flex justify-center w-full m-auto 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"
@ -48,55 +50,55 @@
<main class="w-full"> <main class="w-full">
<!--Start Top Winners/Losers--> <!--Start Top Winners/Losers-->
<nav class=" pt-1 overflow-x-auto whitespace-nowrap"> <nav class="overflow-x-auto whitespace-nowrap">
<ul <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] text-white"
> >
<a <a
href="/market-mover/gainers" href="/market-mover/gainers"
class="p-2 px-5 cursor-pointer {timePeriod === 'gainers' class="p-2 px-5 cursor-pointer {timePeriod === 'gainers'
? 'text-white bg-primary/90' ? 'text-muted dark:text-white bg-[#EEEEEE] dark:bg-primary/90 font-semibold'
: 'text-gray-400 sm:hover:text-white sm:hover:bg-primary/90'}" : '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'}"
> >
Today Today
</a> </a>
<a <a
href="/market-mover/gainers/week" href="/market-mover/gainers/week"
class="p-2 px-5 cursor-pointer {timePeriod === 'week' class="p-2 px-5 cursor-pointer {timePeriod === 'week'
? 'text-white bg-primary/90' ? 'text-muted dark:text-white bg-[#EEEEEE] dark:bg-primary/90 font-semibold'
: 'text-gray-400 sm:hover:text-white sm:hover:bg-primary/90'}" : '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'}"
> >
Week Week
</a> </a>
<a <a
href="/market-mover/gainers/month" href="/market-mover/gainers/month"
class="p-2 px-5 cursor-pointer {timePeriod === 'month' class="p-2 px-5 cursor-pointer {timePeriod === 'month'
? 'text-white bg-primary/90' ? 'text-muted dark:text-white bg-[#EEEEEE] dark:bg-primary/90 font-semibold'
: 'text-gray-400 sm:hover:text-white sm:hover:bg-primary/90'}" : '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'}"
> >
Month Month
</a> </a>
<a <a
href="/market-mover/gainers/year" href="/market-mover/gainers/year"
class="p-2 px-5 cursor-pointer {timePeriod === 'year' class="p-2 px-5 cursor-pointer {timePeriod === 'year'
? 'text-white bg-primary/90' ? 'text-muted dark:text-white bg-[#EEEEEE] dark:bg-primary/90 font-semibold'
: 'text-gray-400 sm:hover:text-white sm:hover:bg-primary/90'}" : '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'}"
> >
Year Year
</a> </a>
<a <a
href="/market-mover/gainers/3Y" href="/market-mover/gainers/3Y"
class="p-2 px-5 cursor-pointer {timePeriod === '3Y' class="p-2 px-5 cursor-pointer {timePeriod === '3Y'
? 'text-white bg-primary/90' ? 'text-muted dark:text-white bg-[#EEEEEE] dark:bg-primary/90 font-semibold'
: 'text-gray-400 sm:hover:text-white sm:hover:bg-primary/90'}" : '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'}"
> >
3 Years 3 Years
</a> </a>
<a <a
href="/market-mover/gainers/5Y" href="/market-mover/gainers/5Y"
class="p-2 px-5 cursor-pointer {timePeriod === '5Y' class="p-2 px-5 cursor-pointer {timePeriod === '5Y'
? 'text-white bg-primary/90' ? 'text-muted dark:text-white bg-[#EEEEEE] dark:bg-primary/90 font-semibold'
: 'text-gray-400 sm:hover:text-white sm:hover:bg-primary/90'}" : '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'}"
> >
5 Years 5 Years
</a> </a>
@ -110,7 +112,7 @@
<div <div
class="title-group flex flex-row items-center justify-start mb-3" class="title-group flex flex-row items-center justify-start mb-3"
> >
<h1 class="text-white text-xl sm:text-2xl font-semibold"> <h1 class="text-xl sm:text-2xl font-semibold">
{displayTitle[timePeriod]?.replace("title", title)} {displayTitle[timePeriod]?.replace("title", title)}
</h1> </h1>
{#if timePeriod === "1D" && ["Gainers", "Losers"]?.includes(title)} {#if timePeriod === "1D" && ["Gainers", "Losers"]?.includes(title)}
@ -122,7 +124,7 @@
{/if} {/if}
<div <div
class="mb-0 ml-5 mt-1 whitespace-nowrap text-sm font-semiboldt text-white" class="mb-0 ml-5 mt-1 whitespace-nowrap text-sm font-semibold"
> >
<span class="hidden lg:inline">Updated</span> <span class="hidden lg:inline">Updated</span>
{lastTradingDay} {lastTradingDay}

22
src/routes/options-flow/+page.svelte
View File

@ -778,7 +778,7 @@
} }
} }
} else { } else {
toast.error("Only for Pro Members", { toast.error("Unlock Feature with Pro Tier 🔥", {
style: `border-radius: 5px; background: #fff; color: #000; border-color: ${$mode === "light" ? "#F9FAFB" : "#4B5563"}; font-size: 15px;`, style: `border-radius: 5px; background: #fff; color: #000; border-color: ${$mode === "light" ? "#F9FAFB" : "#4B5563"}; font-size: 15px;`,
}); });
} }
@ -869,7 +869,7 @@
class="xl:tooltip xl:tooltip-bottom flex flex-col items-center mr-3 cursor-pointer" class="xl:tooltip xl:tooltip-bottom flex flex-col items-center mr-3 cursor-pointer"
> >
<div <div
class="rounded-full w-10 h-10 relative bg-[#000] flex items-center justify-center" class="rounded-full w-10 h-10 relative bg-gray-400 dark:bg-[#000] flex items-center justify-center"
> >
{#if !muted} {#if !muted}
<svg <svg
@ -877,7 +877,7 @@
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 16 16" viewBox="0 0 16 16"
><path ><path
fill="#fff" fill="currentColor"
d="M9 2.5a.5.5 0 0 0-.849-.358l-2.927 2.85H3.5a1.5 1.5 0 0 0-1.5 1.5v2.99a1.5 1.5 0 0 0 1.5 1.5h1.723l2.927 2.875A.5.5 0 0 0 9 13.5zm1.111 2.689a.5.5 0 0 1 .703-.08l.002.001l.002.002l.005.004l.015.013l.046.04c.036.034.085.08.142.142c.113.123.26.302.405.54c.291.48.573 1.193.573 2.148c0 .954-.282 1.668-.573 2.148a3.394 3.394 0 0 1-.405.541a2.495 2.495 0 0 1-.202.196l-.008.007h-.001s-.447.243-.703-.078a.5.5 0 0 1 .075-.7l.002-.002l-.001.001l.002-.001h-.001l.018-.016c.018-.017.048-.045.085-.085a2.4 2.4 0 0 0 .284-.382c.21-.345.428-.882.428-1.63c0-.747-.218-1.283-.428-1.627a2.382 2.382 0 0 0-.368-.465a.5.5 0 0 1-.096-.717m1.702-2.08a.5.5 0 1 0-.623.782l.011.01l.052.045c.047.042.116.107.201.195c.17.177.4.443.63.794c.46.701.92 1.733.92 3.069a5.522 5.522 0 0 1-.92 3.065c-.23.35-.46.614-.63.79a3.922 3.922 0 0 1-.252.24l-.011.01h-.001a.5.5 0 0 0 .623.782l.033-.027l.075-.065c.063-.057.15-.138.253-.245a6.44 6.44 0 0 0 .746-.936a6.522 6.522 0 0 0 1.083-3.614a6.542 6.542 0 0 0-1.083-3.618a6.517 6.517 0 0 0-.745-.938a4.935 4.935 0 0 0-.328-.311l-.023-.019l-.007-.006l-.002-.002zM10.19 5.89l-.002-.001Z" d="M9 2.5a.5.5 0 0 0-.849-.358l-2.927 2.85H3.5a1.5 1.5 0 0 0-1.5 1.5v2.99a1.5 1.5 0 0 0 1.5 1.5h1.723l2.927 2.875A.5.5 0 0 0 9 13.5zm1.111 2.689a.5.5 0 0 1 .703-.08l.002.001l.002.002l.005.004l.015.013l.046.04c.036.034.085.08.142.142c.113.123.26.302.405.54c.291.48.573 1.193.573 2.148c0 .954-.282 1.668-.573 2.148a3.394 3.394 0 0 1-.405.541a2.495 2.495 0 0 1-.202.196l-.008.007h-.001s-.447.243-.703-.078a.5.5 0 0 1 .075-.7l.002-.002l-.001.001l.002-.001h-.001l.018-.016c.018-.017.048-.045.085-.085a2.4 2.4 0 0 0 .284-.382c.21-.345.428-.882.428-1.63c0-.747-.218-1.283-.428-1.627a2.382 2.382 0 0 0-.368-.465a.5.5 0 0 1-.096-.717m1.702-2.08a.5.5 0 1 0-.623.782l.011.01l.052.045c.047.042.116.107.201.195c.17.177.4.443.63.794c.46.701.92 1.733.92 3.069a5.522 5.522 0 0 1-.92 3.065c-.23.35-.46.614-.63.79a3.922 3.922 0 0 1-.252.24l-.011.01h-.001a.5.5 0 0 0 .623.782l.033-.027l.075-.065c.063-.057.15-.138.253-.245a6.44 6.44 0 0 0 .746-.936a6.522 6.522 0 0 0 1.083-3.614a6.542 6.542 0 0 0-1.083-3.618a6.517 6.517 0 0 0-.745-.938a4.935 4.935 0 0 0-.328-.311l-.023-.019l-.007-.006l-.002-.002zM10.19 5.89l-.002-.001Z"
/></svg /></svg
> >
@ -887,7 +887,7 @@
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24" viewBox="0 0 24 24"
><path ><path
fill="#fff" fill="currentColor"
d="M3.28 2.22a.75.75 0 1 0-1.06 1.06L6.438 7.5H4.25A2.25 2.25 0 0 0 2 9.749v4.497a2.25 2.25 0 0 0 2.25 2.25h3.68a.75.75 0 0 1 .498.19l4.491 3.994c.806.716 2.081.144 2.081-.934V16.06l5.72 5.72a.75.75 0 0 0 1.06-1.061zm13.861 11.74l1.138 1.137A6.974 6.974 0 0 0 19 12a6.973 6.973 0 0 0-.84-3.328a.75.75 0 0 0-1.32.714c.42.777.66 1.666.66 2.614c0 .691-.127 1.351-.359 1.96m2.247 2.246l1.093 1.094A9.956 9.956 0 0 0 22 12a9.959 9.959 0 0 0-1.96-5.946a.75.75 0 0 0-1.205.892A8.459 8.459 0 0 1 20.5 12a8.458 8.458 0 0 1-1.112 4.206M9.52 6.338l5.48 5.48V4.25c0-1.079-1.274-1.65-2.08-.934z" d="M3.28 2.22a.75.75 0 1 0-1.06 1.06L6.438 7.5H4.25A2.25 2.25 0 0 0 2 9.749v4.497a2.25 2.25 0 0 0 2.25 2.25h3.68a.75.75 0 0 1 .498.19l4.491 3.994c.806.716 2.081.144 2.081-.934V16.06l5.72 5.72a.75.75 0 0 0 1.06-1.061zm13.861 11.74l1.138 1.137A6.974 6.974 0 0 0 19 12a6.973 6.973 0 0 0-.84-3.328a.75.75 0 0 0-1.32.714c.42.777.66 1.666.66 2.614c0 .691-.127 1.351-.359 1.96m2.247 2.246l1.093 1.094A9.956 9.956 0 0 0 22 12a9.959 9.959 0 0 0-1.96-5.946a.75.75 0 0 0-1.205.892A8.459 8.459 0 0 1 20.5 12a8.458 8.458 0 0 1-1.112 4.206M9.52 6.338l5.48 5.48V4.25c0-1.079-1.274-1.65-2.08-.934z"
/></svg /></svg
> >
@ -934,7 +934,7 @@
<div class="sm:ml-auto w-full sm:w-fit pt-5"> <div class="sm:ml-auto w-full sm:w-fit pt-5">
<div class="relative flex flex-col sm:flex-row items-center"> <div class="relative flex flex-col sm:flex-row items-center">
<div <div
class="relative w-full sm:w-fit pl-3 sm:mr-5 mb-4 sm:mb-0 flex-auto text-center bg-white dark:bg-secondary rounded-md border border-gray-300 dark:border-gray-600" class="relative w-full sm:w-fit pl-3 sm:mr-5 mb-4 sm:mb-0 flex-auto text-center shadow-sm bg-white dark:bg-secondary rounded-md border border-gray-300 dark:border-gray-600"
> >
<label class="flex flex-row items-center"> <label class="flex flex-row items-center">
<input <input
@ -989,8 +989,8 @@
<Popover.Trigger asChild let:builder> <Popover.Trigger asChild let:builder>
<Button <Button
class={cn( class={cn(
"w-full sm:w-[160px] truncate sm:mr-3 py-3 bg-[#000] sm:hover:bg-[#000] sm:hover: justify-center sm:justify-start text-center sm:text-left font-normal border-none rounded-md", "w-full sm:w-[160px] truncate sm:mr-3 py-3 shadow-sm border-gray-300 justify-center sm:justify-start text-center sm:text-left font-normal border-none rounded-md",
!selectedDate && "text-gray-300", !selectedDate && "text-muted dark:text-gray-300",
)} )}
builders={[builder]} builders={[builder]}
> >
@ -1000,9 +1000,11 @@
: "Pick a date"} : "Pick a date"}
</Button> </Button>
</Popover.Trigger> </Popover.Trigger>
<Popover.Content class="w-auto p-0 border-gray-500"> <Popover.Content
class="w-auto p-0 border-gray-500 bg-white dark:bg-[#000]"
>
<Calendar <Calendar
class="bg-default " class=" "
bind:value={selectedDate} bind:value={selectedDate}
initialFocus initialFocus
onValueChange={getHistoricalFlow} onValueChange={getHistoricalFlow}
@ -1043,7 +1045,7 @@
> >
<label <label
for="ruleModal" for="ruleModal"
class="inline-flex cursor-pointer items-center justify-center space-x-1 whitespace-nowrap rounded-md border border-gray-300 dark:border-none py-2 pl-3 pr-4 text-base font-semibold shadow-sm bg-gray-300 sm:hover:bg-gray-400 dark:bg-[#000] dark:sm:hover:bg-default/60 ease-out focus:outline-hidden focus:ring-2 focus:ring-blue-500" class="inline-flex cursor-pointer items-center justify-center space-x-1 whitespace-nowrap rounded-md border border-gray-300 dark:border-none py-2 pl-3 pr-4 text-base font-semibold shadow-sm bg-white sm:hover:bg-gray-100 dark:bg-[#000] dark:sm:hover:bg-default/60 ease-out focus:outline-hidden focus:ring-2 focus:ring-blue-500"
> >
<svg <svg
class="h-5 w-5" class="h-5 w-5"

42
src/routes/stocks/+page.svelte
View File

@ -18,8 +18,8 @@
> >
<div class="text-sm sm:text-[1rem] breadcrumbs"> <div class="text-sm sm:text-[1rem] breadcrumbs">
<ul> <ul>
<li><a href="/" class="text-gray-300">Home</a></li> <li><a href="/" class="text-muted dark:text-gray-300">Home</a></li>
<li class="text-gray-300">All Stocks</li> <li class="text-muted dark:text-gray-300">All Stocks</li>
</ul> </ul>
</div> </div>
@ -29,16 +29,16 @@
class="relative flex justify-center items-start overflow-hidden w-full" class="relative flex justify-center items-start overflow-hidden w-full"
> >
<main class="w-full lg:w-3/4 lg:pr-5"> <main class="w-full lg:w-3/4 lg:pr-5">
<div class="mb-6 border-b-[2px]"> <div class="mb-2 border-b-[2px]">
<h1 class="mb-1 text-white text-2xl sm:text-3xl font-bold"> <h1 class="mb-1 e text-2xl sm:text-3xl font-bold">
All Stock Symbols All Stock Symbols
</h1> </h1>
<p class="mb-3 px-1 text-base font-semibold text-muted sm:px-0"> <p class="mb-3 px-1 font-semibold sm:px-0">
List of all {rawData?.length} stock symbols we support List of all {rawData?.length} stock symbols we support
</p> </p>
</div> </div>
<div class="w-full m-auto mb-10 bg-default"> <div class="w-full m-auto">
<!--Start Top Winners/Losers--> <!--Start Top Winners/Losers-->
<div class="flex flex-col justify-center items-center"> <div class="flex flex-col justify-center items-center">
<Table {data} {rawData} /> <Table {data} {rawData} />
@ -48,19 +48,21 @@
<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 !["Pro", "Plus"]?.includes(data?.user?.tier) || data?.user?.freeTrial} {#if !["Pro", "Plus"]?.includes(data?.user?.tier) || data?.user?.freeTrial}
<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 <a
href="/pricing" 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">
<h2 class="text-start text-xl font-semibold text-white ml-3"> <h2 class="text-start text-xl font-semibold e ml-3">
Pro Subscription Pro Subscription
</h2> </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> </div>
<span class="text-white p-3 ml-3 mr-3"> <span class="e 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>
</a> </a>
@ -68,38 +70,42 @@
{/if} {/if}
<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 <a
href="/analysts" href="/analysts"
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">
<h2 class="text-start text-xl font-semibold text-white ml-3"> <h2 class="text-start text-xl font-semibold e ml-3">
Top Analyst Top Analyst
</h2> </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> </div>
<span class="text-white p-3 ml-3 mr-3"> <span class="e p-3 ml-3 mr-3">
Get the latest top Wall Street analyst ratings Get the latest top Wall Street analyst ratings
</span> </span>
</a> </a>
</div> </div>
<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 <a
href="/analysts/top-stocks" href="/analysts/top-stocks"
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">
<h2 class="text-start text-xl font-semibold text-white ml-3"> <h2 class="text-start text-xl font-semibold e ml-3">
Top Stocks Picks Top Stocks Picks
</h2> </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> </div>
<span class="text-white p-3 ml-3 mr-3"> <span class="e p-3 ml-3 mr-3">
Get the latest top Wall Street analyst ratings. Get the latest top Wall Street analyst ratings.
</span> </span>
</a> </a>

64
src/routes/stocks/[tickerID]/+page.svelte
View File

@ -796,11 +796,11 @@
><tr ><tr
class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-1 text-sm" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 text-sm"
>Bid</td >Bid</td
> >
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-1 sm:text-right" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:text-right"
>{$wsBidPrice !== 0 && $wsBidPrice !== null >{$wsBidPrice !== 0 && $wsBidPrice !== null
? $wsBidPrice ? $wsBidPrice
: ((data?.getStockQuote?.bid !== 0 : ((data?.getStockQuote?.bid !== 0
@ -811,7 +811,7 @@
<tr <tr
class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-1 text-sm" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 text-sm"
><a ><a
href={`/stocks/${$stockTicker}/statistics/market-cap`} href={`/stocks/${$stockTicker}/statistics/market-cap`}
class="sm:hover:text-blue-400 underline underline-offset-4" class="sm:hover:text-blue-400 underline underline-offset-4"
@ -819,7 +819,7 @@
></td ></td
> >
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-1 sm:text-right" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:text-right"
>{@html abbreviateNumber( >{@html abbreviateNumber(
data?.getStockQuote?.marketCap, data?.getStockQuote?.marketCap,
false, false,
@ -830,11 +830,11 @@
<tr <tr
class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-1 text-sm" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 text-sm"
>Revenue (ttm)</td >Revenue (ttm)</td
> >
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-1 sm:text-right" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:text-right"
>{@html stockDeck?.revenueTTM !== null && >{@html stockDeck?.revenueTTM !== null &&
stockDeck?.revenueTTM !== 0 stockDeck?.revenueTTM !== 0
? abbreviateNumber(stockDeck?.revenueTTM, false, true) ? abbreviateNumber(stockDeck?.revenueTTM, false, true)
@ -844,11 +844,11 @@
<tr <tr
class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-1 text-sm" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 text-sm"
>Net Income (ttm)</td >Net Income (ttm)</td
> >
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-1 sm:text-right" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:text-right"
>{@html stockDeck?.netIncomeTTM !== null >{@html stockDeck?.netIncomeTTM !== null
? abbreviateNumber(stockDeck?.netIncomeTTM, false, true) ? abbreviateNumber(stockDeck?.netIncomeTTM, false, true)
: "n/a"}</td : "n/a"}</td
@ -858,40 +858,40 @@
<tr <tr
class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-1 text-sm" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 text-sm"
>EPS (ttm)</td >EPS (ttm)</td
> >
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-1 sm:text-right" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:text-right"
>{data?.getStockQuote?.eps ?? "n/a"}</td >{data?.getStockQuote?.eps ?? "n/a"}</td
></tr ></tr
> >
<tr <tr
class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-1 text-sm" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 text-sm"
>PE Ratio (ttm)</td >PE Ratio (ttm)</td
> >
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-1 sm:text-right" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:text-right"
>{data?.getStockQuote?.pe ?? "n/a"}</td >{data?.getStockQuote?.pe ?? "n/a"}</td
></tr ></tr
> >
<tr <tr
class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-1 text-sm" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 text-sm"
>Forward PE</td >Forward PE</td
> >
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-1 sm:text-right" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:text-right"
>{stockDeck?.forwardPE ?? "n/a"}</td >{stockDeck?.forwardPE ?? "n/a"}</td
></tr ></tr
> >
<tr <tr
class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-1 text-sm" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 text-sm"
><a ><a
href={data?.getAnalystSummary?.consensusRating !== href={data?.getAnalystSummary?.consensusRating !==
undefined undefined
@ -904,7 +904,7 @@
> >
</td> </td>
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-1 sm:text-right" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:text-right"
>{data?.getAnalystSummary?.consensusRating !== null && >{data?.getAnalystSummary?.consensusRating !== null &&
data?.getAnalystSummary?.consensusRating !== "n/a" && data?.getAnalystSummary?.consensusRating !== "n/a" &&
data?.getAnalystSummary?.consensusRating !== undefined data?.getAnalystSummary?.consensusRating !== undefined
@ -919,11 +919,11 @@
><tr ><tr
class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-1 text-sm" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 text-sm"
>Ask</td >Ask</td
> >
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-1 sm:text-right" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:text-right"
>{$wsAskPrice !== 0 && $wsAskPrice !== null >{$wsAskPrice !== 0 && $wsAskPrice !== null
? $wsAskPrice ? $wsAskPrice
: ((data?.getStockQuote?.ask !== 0 : ((data?.getStockQuote?.ask !== 0
@ -934,11 +934,11 @@
<tr <tr
class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-1 text-sm" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 text-sm"
>Volume</td >Volume</td
> >
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-1 sm:text-right" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:text-right"
>{data?.getStockQuote?.volume?.toLocaleString( >{data?.getStockQuote?.volume?.toLocaleString(
"en-us", "en-us",
)}</td )}</td
@ -947,11 +947,11 @@
<tr <tr
class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-1 text-sm" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 text-sm"
>Avg. Volume (20D)</td >Avg. Volume (20D)</td
> >
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-1 sm:text-right" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:text-right"
>{data?.getStockQuote?.avgVolume !== undefined >{data?.getStockQuote?.avgVolume !== undefined
? data?.getStockQuote?.avgVolume?.toLocaleString( ? data?.getStockQuote?.avgVolume?.toLocaleString(
"en-us", "en-us",
@ -962,33 +962,33 @@
<tr <tr
class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-1 text-sm" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 text-sm"
>Open</td >Open</td
> >
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-1 sm:text-right" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:text-right"
>{data?.getStockQuote?.open?.toFixed(2)}</td >{data?.getStockQuote?.open?.toFixed(2)}</td
></tr ></tr
> >
<tr <tr
class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-1 text-sm" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 text-sm"
>Previous Close</td >Previous Close</td
> >
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-1 sm:text-right" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:text-right"
>{data?.getStockQuote?.previousClose?.toFixed(2)}</td >{data?.getStockQuote?.previousClose?.toFixed(2)}</td
></tr ></tr
> >
<tr <tr
class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-1 text-sm" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 text-sm"
>Day's Range</td >Day's Range</td
> >
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-1 sm:text-right" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:text-right"
>{data?.getStockQuote?.dayLow?.toFixed(2)} - {data?.getStockQuote?.dayHigh?.toFixed( >{data?.getStockQuote?.dayLow?.toFixed(2)} - {data?.getStockQuote?.dayHigh?.toFixed(
2, 2,
)}</td )}</td
@ -997,11 +997,11 @@
<tr <tr
class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-1 text-sm" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 text-sm"
>52-Week Range</td >52-Week Range</td
> >
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-1 sm:text-right" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:text-right"
>{data?.getStockQuote?.yearLow?.toFixed(2)} - {data?.getStockQuote?.yearHigh?.toFixed( >{data?.getStockQuote?.yearLow?.toFixed(2)} - {data?.getStockQuote?.yearHigh?.toFixed(
2, 2,
)}</td )}</td
@ -1010,11 +1010,11 @@
<tr <tr
class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-300 dark:border-gray-800 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-1 text-sm" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 text-sm"
>Beta</td >Beta</td
> >
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-1 sm:text-right" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:text-right"
>{stockDeck?.beta?.toFixed(2)}</td >{stockDeck?.beta?.toFixed(2)}</td
></tr ></tr
> >

10
src/routes/stocks/[tickerID]/profile/+layout.svelte
View File

@ -35,7 +35,7 @@
} }
</script> </script>
<section class="w-auto bg-default overflow-hidden text-black h-full"> <section class="w-auto overflow-hidden text-muted dark:text-white h-full">
<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">
@ -47,8 +47,8 @@
href={`/stocks/${$stockTicker}/profile`} href={`/stocks/${$stockTicker}/profile`}
on:click={() => changeSubSection("overview")} on:click={() => changeSubSection("overview")}
class="p-2 px-5 cursor-pointer {displaySubSection === 'overview' class="p-2 px-5 cursor-pointer {displaySubSection === 'overview'
? 'text-white bg-primary/90' ? 'text-muted dark:text-white bg-[#EEEEEE] dark:bg-primary/90 font-semibold'
: 'text-gray-400 sm:hover:text-white sm:hover:bg-primary/90'}" : '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'}"
> >
Overview Overview
</a> </a>
@ -57,8 +57,8 @@
href={`/stocks/${$stockTicker}/profile/employees`} href={`/stocks/${$stockTicker}/profile/employees`}
on:click={() => changeSubSection("employees")} on:click={() => changeSubSection("employees")}
class="p-2 px-5 cursor-pointer {displaySubSection === 'employees' class="p-2 px-5 cursor-pointer {displaySubSection === 'employees'
? 'text-white bg-primary/90' ? 'text-muted dark:text-white bg-[#EEEEEE] dark:bg-primary/90 font-semibold'
: 'text-gray-400 sm:hover:text-white sm:hover:bg-primary/90'}" : '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'}"
> >
Employees Employees
</a> </a>

162
src/routes/stocks/[tickerID]/profile/+page.svelte
View File

@ -45,7 +45,7 @@ ${paragraphs.join("\n")}
description={`Company profile for ${$displayCompanyName} (${$stockTicker}) with a description, list of executives, contact details and other key facts.`} description={`Company profile for ${$displayCompanyName} (${$stockTicker}) with a description, list of executives, contact details and other key facts.`}
/> />
<section class="w-full bg-default overflow-hidden text-white h-full"> <section class="w-full overflow-hidden text-muted dark:text-white h-full">
<div class="w-full flex h-full overflow-hidden"> <div class="w-full flex 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"
@ -62,7 +62,7 @@ ${paragraphs.join("\n")}
</div> </div>
<div class="lg:-mr-6 shrink-0 lg:float-right lg:w-[336px]"> <div class="lg:-mr-6 shrink-0 lg:float-right lg:w-[336px]">
<div <div
class="mt-7 rounded border border-gray-600 bg-primary px-3 pb-2 pt-3 xs:px-4 xs:pt-4 lg:mt-1" class="mt-7 rounded border border-gray-300 dark:border-gray-600 bg-gray-200 shadow-sm dark:bg-primary px-3 pb-2 pt-3 xs:px-4 xs:pt-4 lg:mt-1"
> >
<div class="text-center text-2xl font-semibold"> <div class="text-center text-2xl font-semibold">
{$displayCompanyName} {$displayCompanyName}
@ -76,7 +76,8 @@ ${paragraphs.join("\n")}
</div> </div>
<table class="w-full"> <table class="w-full">
<tbody <tbody
><tr class="border-b border-gray-600 last:border-0" ><tr
class="border-b border-gray-300 dark:border-gray-600 last:border-0"
><td ><td
class="px-1 py-1.5 font-semibold lg:py-2" class="px-1 py-1.5 font-semibold lg:py-2"
data-svelte-h="svelte-bpivlp">Country</td data-svelte-h="svelte-bpivlp">Country</td
@ -88,7 +89,8 @@ ${paragraphs.join("\n")}
></tr ></tr
> >
<tr class="border-b border-gray-600 last:border-0" <tr
class="border-b border-gray-300 dark:border-gray-600 last:border-0"
><td ><td
class="px-1 py-1.5 font-semibold lg:py-2" class="px-1 py-1.5 font-semibold lg:py-2"
data-svelte-h="svelte-pqn7mx">IPO Date</td data-svelte-h="svelte-pqn7mx">IPO Date</td
@ -105,19 +107,21 @@ ${paragraphs.join("\n")}
: "n/a"}</td : "n/a"}</td
></tr ></tr
> >
<tr class="border-b border-gray-600 last:border-0" <tr
class="border-b border-gray-300 dark:border-gray-600 last:border-0"
><td class="px-1 py-1.5 font-semibold lg:py-2">Industry</td> ><td class="px-1 py-1.5 font-semibold lg:py-2">Industry</td>
<td class="px-1 py-1.5 text-right lg:py-2" <td class="px-1 py-1.5 text-right lg:py-2"
><a ><a
href={rawData?.industry href={rawData?.industry
? getIndustryHref(rawData?.industry) ? getIndustryHref(rawData?.industry)
: "#"} : "#"}
class="sm:hover:text-blue-400 text-white underline underline-offset-4" class="sm:hover:text-blue-500 dark:sm:hover:text-blue-400 underline underline-offset-4"
>{rawData?.industry ?? "n/a"}</a >{rawData?.industry ?? "n/a"}</a
></td ></td
></tr ></tr
> >
<tr class="border-b border-gray-600 last:border-0" <tr
class="border-b border-gray-300 dark:border-gray-600 last:border-0"
><td ><td
class="px-1 py-1.5 font-semibold lg:py-2" class="px-1 py-1.5 font-semibold lg:py-2"
data-svelte-h="svelte-5e1uzt">Sector</td data-svelte-h="svelte-5e1uzt">Sector</td
@ -127,17 +131,18 @@ ${paragraphs.join("\n")}
href={sectorNavigation?.find( href={sectorNavigation?.find(
(item) => item?.title === rawData?.sector, (item) => item?.title === rawData?.sector,
)?.link} )?.link}
class="sm:hover:text-blue-400 text-white underline underline-offset-4" class="sm:hover:text-blue-500 dark:sm:hover:text-blue-400 underline underline-offset-4"
>{rawData?.sector ? rawData?.sector : "n/a"}</a >{rawData?.sector ? rawData?.sector : "n/a"}</a
></td ></td
></tr ></tr
> >
<tr class="border-b border-gray-600 last:border-0" <tr
class="border-b border-gray-300 dark:border-gray-600 last:border-0"
><td class="px-1 py-1.5 font-semibold lg:py-2">Employees</td ><td class="px-1 py-1.5 font-semibold lg:py-2">Employees</td
> >
<td class="px-1 py-1.5 text-right lg:py-2" <td class="px-1 py-1.5 text-right lg:py-2"
><a ><a
class="sm:hover:text-blue-400 text-white underline underline-offset-4" class="sm:hover:text-blue-500 dark:sm:hover:text-blue-400 underline underline-offset-4"
href={`/stocks/${$stockTicker}/profile/employees`} href={`/stocks/${$stockTicker}/profile/employees`}
>{rawData?.fullTimeEmployees >{rawData?.fullTimeEmployees
? new Intl.NumberFormat("en")?.format( ? new Intl.NumberFormat("en")?.format(
@ -147,7 +152,8 @@ ${paragraphs.join("\n")}
></td ></td
></tr ></tr
> >
<tr class="border-b border-gray-600 last:border-0" <tr
class="border-b border-gray-300 dark:border-gray-600 last:border-0"
><td ><td
class="px-1 py-1.5 font-semibold lg:py-2" class="px-1 py-1.5 font-semibold lg:py-2"
data-svelte-h="svelte-1qhfmvo">CEO</td data-svelte-h="svelte-1qhfmvo">CEO</td
@ -163,18 +169,14 @@ ${paragraphs.join("\n")}
Contact Details Contact Details
</h2> </h2>
<div <div
class="rounded border border-gray-600 bg-primary px-4 pb-2 pt-4" class="rounded border border-gray-300 dark:border-gray-600 bg-gray-200 shadow-sm dark:bg-primary px-4 pb-2 pt-4"
> >
<table class="w-full"> <table class="w-full">
<tbody <tbody
><tr class="border-b border-gray-600 last:border-0" ><tr
class="border-b border-gray-300 dark:border-gray-600 last:border-0"
><td colspan="2" class="pb-3" ><td colspan="2" class="pb-3"
><div ><div class="mb-2 text-lg font-bold">Address:</div>
class="mb-2 text-lg font-bold"
data-svelte-h="svelte-4u53xl"
>
Address:
</div>
<div> <div>
{rawData?.address {rawData?.address
? rawData?.address ? rawData?.address
@ -187,12 +189,13 @@ ${paragraphs.join("\n")}
></tr ></tr
> >
<tr class="border-b border-gray-600 last:border-0" <tr
class="border-b border-gray-300 dark:border-gray-600 last:border-0"
><td class="px-0.5 py-2 font-semibold">Website</td> ><td class="px-0.5 py-2 font-semibold">Website</td>
<td class="px-0.5 py-2 text-right"> <td class="px-0.5 py-2 text-right">
<a <a
href={rawData?.website} href={rawData?.website}
class="sm:hover:text-white truncate text-blue-400" class="sm:hover:text-muted dark:sm:hover:text-white truncate text-blue-500 dark:text-blue-400"
target="_blank">{rawData?.website ?? "n/a"}</a target="_blank">{rawData?.website ?? "n/a"}</a
></td ></td
></tr ></tr
@ -202,87 +205,81 @@ ${paragraphs.join("\n")}
</div> </div>
<h2 class="mt-6 xs:mt-8 font-bold text-2xl mb-2">Stock Details</h2> <h2 class="mt-6 xs:mt-8 font-bold text-2xl mb-2">Stock Details</h2>
<div <div
class="rounded border border-gray-600 bg-primary px-2 pb-2 pt-2 xs:px-4 xs:pt-2.5" class="rounded border border-gray-300 dark:border-gray-600 bg-gray-200 shadow-sm dark:bg-primary px-2 pb-2 pt-2 xs:px-4 xs:pt-2.5"
> >
<table class="w-full"> <table class="w-full">
<tbody <tbody
><tr class="border-b border-gray-600 last:border-0" ><tr
><td class="border-b border-gray-300 dark:border-gray-600 last:border-0"
class="px-1 py-1.5 font-semibold lg:py-2" ><td class="px-1 py-1.5 font-semibold lg:py-2"
data-svelte-h="svelte-lmvnpx">Ticker Symbol</td >Ticker Symbol</td
> >
<td class="px-1 py-1.5 text-right lg:py-2" <td class="px-1 py-1.5 text-right lg:py-2"
>{rawData?.symbol ?? "n/a"}</td >{rawData?.symbol ?? "n/a"}</td
></tr ></tr
> >
<tr class="border-b border-gray-600 last:border-0" <tr
><td class="border-b border-gray-300 dark:border-gray-600 last:border-0"
class="px-1 py-1.5 font-semibold lg:py-2" ><td class="px-1 py-1.5 font-semibold lg:py-2">Exchange</td>
data-svelte-h="svelte-h7dsem">Exchange</td
>
<td class="px-1 py-1.5 text-right lg:py-2" <td class="px-1 py-1.5 text-right lg:py-2"
>{rawData?.exchange ?? "n/a"}</td >{rawData?.exchange ?? "n/a"}</td
></tr ></tr
> >
<tr class="border-b border-gray-600 last:border-0" <tr
><td class="border-b border-gray-300 dark:border-gray-600 last:border-0"
class="px-1 py-1.5 font-semibold lg:py-2" ><td class="px-1 py-1.5 font-semibold lg:py-2"
data-svelte-h="svelte-q9yzrm">Fiscal Year</td >Fiscal Year</td
> >
<td class="px-1 py-1.5 text-right lg:py-2" <td class="px-1 py-1.5 text-right lg:py-2"
>{rawData?.fiscalYearRange ?? "n/a"}</td >{rawData?.fiscalYearRange ?? "n/a"}</td
></tr ></tr
> >
<tr class="border-b border-gray-600 last:border-0" <tr
><td class="border-b border-gray-300 dark:border-gray-600 last:border-0"
class="px-1 py-1.5 font-semibold lg:py-2" ><td class="px-1 py-1.5 font-semibold lg:py-2"
data-svelte-h="svelte-1tbczfa">Reporting Currency</td >Reporting Currency</td
> >
<td class="px-1 py-1.5 text-right lg:py-2" <td class="px-1 py-1.5 text-right lg:py-2"
>{rawData?.currency ?? "n/a"}</td >{rawData?.currency ?? "n/a"}</td
></tr ></tr
> >
<tr class="border-b border-gray-600 last:border-0" <tr
><td class="border-b border-gray-300 dark:border-gray-600 last:border-0"
class="px-1 py-1.5 font-semibold lg:py-2" ><td class="px-1 py-1.5 font-semibold lg:py-2">CIK Code</td>
data-svelte-h="svelte-ucpcs9">CIK Code</td
>
<td class="px-1 py-1.5 text-right lg:py-2" <td class="px-1 py-1.5 text-right lg:py-2"
>{rawData?.cik ?? "n/a"}</td >{rawData?.cik ?? "n/a"}</td
></tr ></tr
> >
<tr class="border-b border-gray-600 last:border-0" <tr
><td class="border-b border-gray-300 dark:border-gray-600 last:border-0"
class="px-1 py-1.5 font-semibold lg:py-2" ><td class="px-1 py-1.5 font-semibold lg:py-2"
data-svelte-h="svelte-1fdyovu">CUSIP Number</td >CUSIP Number</td
> >
<td class="px-1 py-1.5 text-right lg:py-2" <td class="px-1 py-1.5 text-right lg:py-2"
>{rawData?.cusip ?? "n/a"}</td >{rawData?.cusip ?? "n/a"}</td
></tr ></tr
> >
<tr class="border-b border-gray-600 last:border-0" <tr
><td class="border-b border-gray-300 dark:border-gray-600 last:border-0"
class="px-1 py-1.5 font-semibold lg:py-2" ><td class="px-1 py-1.5 font-semibold lg:py-2"
data-svelte-h="svelte-t5u2mr">ISIN Number</td >ISIN Number</td
> >
<td class="px-1 py-1.5 text-right lg:py-2" <td class="px-1 py-1.5 text-right lg:py-2"
>{rawData?.isin ?? "n/a"}</td >{rawData?.isin ?? "n/a"}</td
></tr ></tr
> >
<tr class="border-b border-gray-600 last:border-0" <tr
><td class="border-b border-gray-300 dark:border-gray-600 last:border-0"
class="px-1 py-1.5 font-semibold lg:py-2" ><td class="px-1 py-1.5 font-semibold lg:py-2"
data-svelte-h="svelte-x8apyl">Employer ID</td >Employer ID</td
> >
<td class="px-1 py-1.5 text-right lg:py-2" <td class="px-1 py-1.5 text-right lg:py-2"
>{rawData?.taxIdentificationNumber ?? "n/a"}</td >{rawData?.taxIdentificationNumber ?? "n/a"}</td
></tr ></tr
> >
<tr class="border-b border-gray-600 last:border-0" <tr
><td class="border-b border-gray-300 dark:border-gray-600 last:border-0"
class="px-1 py-1.5 font-semibold lg:py-2" ><td class="px-1 py-1.5 font-semibold lg:py-2">SIC Code</td>
data-svelte-h="svelte-1o4kelt">SIC Code</td
>
<td class="px-1 py-1.5 text-right lg:py-2" <td class="px-1 py-1.5 text-right lg:py-2"
>{rawData?.sicCode ?? "n/a"}</td >{rawData?.sicCode ?? "n/a"}</td
></tr ></tr
@ -298,27 +295,27 @@ ${paragraphs.join("\n")}
</h2> </h2>
{#if rawData?.executives?.length > 0} {#if rawData?.executives?.length > 0}
<table class="mb-6 w-full text-base xs:mb-8"> <table class="mb-6 w-full text-base xs:mb-8">
<thead class="bg-primary" <thead class="bg-gray-200 shadow-sm dark:bg-primary"
><tr class="border-y border-gray-600" ><tr class="border-y border-gray-300 dark:border-gray-600"
><th ><th
class="px-2 py-2.5 text-left font-semibold text-white xs:px-3 xs:py-3 sm:px-4" class="px-2 py-2.5 text-left font-semibold xs:px-3 xs:py-3 sm:px-4"
>Name</th >Name</th
> >
<th <th
class="px-2 py-2.5 text-left font-semibold text-white xs:px-3 xs:py-3 sm:px-4" class="px-2 py-2.5 text-left font-semibold xs:px-3 xs:py-3 sm:px-4"
>Position</th >Position</th
></tr ></tr
></thead ></thead
> >
<tbody> <tbody>
{#each rawData?.executives as item} {#each rawData?.executives as item}
<tr class="border-b border-gray-600 text-sm sm:text-[1rem]" <tr
class="border-b border-gray-300 dark:border-gray-600 text-sm sm:text-[1rem]"
><td ><td
class="px-2 py-2.5 align-top font-semibold text-white xs:px-3 xs:py-3 sm:px-4" class="px-2 py-2.5 align-top font-semibold xs:px-3 xs:py-3 sm:px-4"
>{item?.name}</td >{item?.name}</td
> >
<td <td class="px-2 py-2.5 align-top xs:px-3 xs:py-3 sm:px-4"
class="px-2 py-2.5 align-top text-white xs:px-3 xs:py-3 sm:px-4"
>{item?.position}</td >{item?.position}</td
> >
</tr> </tr>
@ -334,27 +331,24 @@ ${paragraphs.join("\n")}
{#if rawData?.filings?.length > 0} {#if rawData?.filings?.length > 0}
<table class="w-full"> <table class="w-full">
<thead <thead
><tr class="border-b border-t border-gray-600 bg-primary" ><tr
><th class="px-1 py-2 text-left text-white xs:px-2">Date</th class="border-b border-t border-gray-300 dark:border-gray-600 bg-gray-200 shadow-sm dark:bg-primary"
> ><th class="px-1 py-2 text-left xs:px-2">Date</th>
<th class="px-1 py-2 text-left text-white xs:px-2">Type</th> <th class="px-1 py-2 text-left xs:px-2">Type</th>
<th class="px-1 py-2 text-left text-white xs:px-2">Title</th <th class="px-1 py-2 text-left xs:px-2">Title</th></tr
></tr
></thead ></thead
> >
<tbody> <tbody>
{#each rawData?.filings as item} {#each rawData?.filings as item}
<tr class="border-b border-gray-600 text-sm sm:text-[1rem]" <tr
><td class="border-b border-gray-300 dark:border-gray-600 text-sm sm:text-[1rem]"
class="whitespace-nowrap py-3 pr-1 align-top text-white xs:px-2" ><td class="whitespace-nowrap py-3 pr-1 align-top xs:px-2"
>{item?.date}</td >{item?.date}</td
> >
<td class="px-1 py-3 align-top text-white xs:px-2" <td class="px-1 py-3 align-top xs:px-2">{item?.type}</td>
>{item?.type}</td
>
<td class="py-3 pl-1 align-top xs:px-2" <td class="py-3 pl-1 align-top xs:px-2"
><a ><a
class="text-blue-400 sm:hover:text-white 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 sm:hover:underline-offset-4"
href={item?.link} href={item?.link}
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
@ -371,10 +365,10 @@ ${paragraphs.join("\n")}
No SEC filings available. No SEC filings available.
{/if} {/if}
<div <div
class="border-b border-gray-600 py-3 text-lg sm:text-xl font-semibold" class="border-b border-gray-300 dark:border-gray-600 py-3 text-lg sm:text-xl font-semibold"
> >
<a <a
class="text-blue-400 sm:hover:text-white 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 sm:hover:underline-offset-4"
href={`https://www.sec.gov/cgi-bin/browse-edgar?CIK=${rawData?.cik}&amp;count=100`} href={`https://www.sec.gov/cgi-bin/browse-edgar?CIK=${rawData?.cik}&amp;count=100`}
target="_blank" target="_blank"
rel="noopener noreferrer">View All SEC Filings</a rel="noopener noreferrer">View All SEC Filings</a