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

ui fixes

Browse Source
This commit is contained in:
MuslemRahimi 2024-11-23 17:24:58 +01:00
parent f70e2ef1b6
commit 7af34469f4
55 changed files with 442 additions and 380 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/lib/components/AnalystCard.svelte
View File

@ -49,7 +49,7 @@
: 'hidden'}"
>
<div
class="sm:rounded-md shadow-lg bg-[#000] sm:bg-[#09090B] sm:border sm:border-slate-800 h-auto {$screenWidth <
class="sm:rounded-md shadow-lg bg-[#000] sm:bg-[#09090B] sm:border sm:border-gray-600 h-auto {$screenWidth <
640
? 'w-screen pt-16'
: ''} md:w-[420px] xl:w-[450px] -mx-1 sm:mx-0"

54
src/lib/components/AnalystEstimate.svelte
View File

@ -323,7 +323,7 @@
{item?.val === "0.00" ||
item?.val === null ||
item?.val === 0
? "-"
? "n/a"
: abbreviateNumber(item?.val.toFixed(2))}
</td>
{/each}
@ -340,30 +340,42 @@
class="text-white text-sm sm:text-[1rem] text-end font-medium bg-[#09090B]"
>
{#if index === 0 || tableActualRevenue?.length === 0}
-
n/a
{:else if item?.val === null}
{#if tableForecastRevenue[index]?.val - tableForecastRevenue[index - 1]?.val > 0}
<span class="text-orange-400">
{(
((tableForecastRevenue[index]?.val -
tableForecastRevenue[index - 1]?.val) /
Math.abs(
tableForecastRevenue[index - 1]?.val,
)) *
100
)?.toFixed(2)}%&#42;
{(() => {
const previousVal =
tableForecastRevenue[index - 1]?.val ?? 0;
const currentVal =
tableForecastRevenue[index]?.val ?? 0;
const change =
((currentVal - previousVal) /
Math.abs(previousVal)) *
100;
return isFinite(change)
? `${change.toFixed(2)}%*`
: "n/a";
})()}
</span>
{:else if tableForecastRevenue[index]?.val - tableForecastRevenue[index - 1]?.val < 0}
<span class="text-orange-400">
{(
((tableForecastRevenue[index]?.val -
tableForecastRevenue[index - 1]?.val) /
Math.abs(
tableForecastRevenue[index - 1]?.val,
)) *
100
)?.toFixed(2)}%&#42;
{(() => {
const previousVal =
tableForecastRevenue[index - 1]?.val ?? 0;
const currentVal =
tableForecastRevenue[index]?.val ?? 0;
const change =
((currentVal - previousVal) /
Math.abs(previousVal)) *
100;
return isFinite(change)
? `${change.toFixed(2)}%*`
: "n/a";
})()}
</span>
{:else}
n/a
{/if}
{:else if item?.val - tableActualRevenue[index - 1]?.val > 0}
<span class="text-[#00FC50]">
@ -418,7 +430,7 @@
class="text-white text-sm sm:text-[1rem] text-end font-medium bg-[#09090B]"
>
{#if index === 0 || tableActualEPS?.length === 0}
-
n/a
{:else if item?.val === null}
{#if tableForecastEPS[index]?.val - tableForecastEPS[index - 1]?.val > 0}
<span class="text-orange-400">
@ -491,7 +503,7 @@
class="text-white text-sm sm:text-[1rem] text-end font-medium border-b border-[#27272A] bg-[#09090B]"
>
{item?.numOfAnalysts === (null || 0)
? "-"
? "n/a"
: item?.numOfAnalysts}
</td>
{/each}
@ -504,7 +516,7 @@
&#42; This value depends on the forecast
</div>
<!--
<div class="mt-5 text-gray-100 text-sm sm:text-[1rem] sm:rounded-md h-auto border border-slate-800 p-4">
<div class="mt-5 text-gray-100 text-sm sm:text-[1rem] sm:rounded-md h-auto border border-gray-600 p-4">
<svg class="w-5 h-5 inline-block mr-0.5 flex-shrink-0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"
><path fill="#fff" d="M128 24a104 104 0 1 0 104 104A104.11 104.11 0 0 0 128 24m-4 48a12 12 0 1 1-12 12a12 12 0 0 1 12-12m12 112a16 16 0 0 1-16-16v-40a8 8 0 0 1 0-16a16 16 0 0 1 16 16v40a8 8 0 0 1 0 16" /></svg
>

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

@ -49,7 +49,7 @@
<div class="sm:space-y-3">
<div
class="lg:rounded-md shadow-lg sm:border sm:border-slate-800 bg-[#000] lg:bg-[#09090B] h-auto h-auto w-screen pt-16 sm:w-full md:w-[420px] xl:w-[450px] lg:pt-0"
class="lg:rounded-md shadow-lg sm:border sm:border-gray-600 bg-[#000] lg:bg-[#09090B] h-auto h-auto w-screen pt-16 sm:w-full md:w-[420px] xl:w-[450px] lg:pt-0"
>
<!--Start Header-->
<div
@ -80,7 +80,7 @@
<!--End Header-->
<!--Start Content-->
<div class="w-full flex flex-wrap border-t border-slate-800">
<div class="w-full flex flex-wrap border-t border-gray-600">
<h2 class="text-start ml-4 text-2xl font-bold text-white pb-2 mt-3">
Crypto Info
</h2>

2
src/lib/components/DCF.svelte
View File

@ -340,7 +340,7 @@
{#if Math?.abs(change) > 30}
<div
class=" mb-5 text-gray-100 text-sm sm:text-[1rem] sm:rounded-md h-auto border border-slate-800 p-4"
class=" mb-5 text-gray-100 text-sm sm:text-[1rem] sm:rounded-md h-auto border border-gray-600 p-4"
>
<svg
class="w-5 h-5 inline-block mr-0.5 flex-shrink-0"

2
src/lib/components/DividendCard.svelte
View File

@ -24,7 +24,7 @@
: 'hidden'}"
>
<div
class="sm:rounded-md shadow-lg bg-[#000] lg:bg-[#09090B] lg:border lg:border-slate-800 h-auto {$screenWidth <=
class="sm:rounded-md shadow-lg bg-[#000] lg:bg-[#09090B] lg:border lg:border-gray-600 h-auto {$screenWidth <=
800
? 'w-screen pt-16'
: ''} md:w-[420px] xl:w-[450px]"

2
src/lib/components/ESGCard.svelte
View File

@ -51,7 +51,7 @@
: 'hidden'}"
>
<div
class="sm:rounded-md shadow-lg bg-[#000] sm:bg-[#09090B] sm:border sm:border-slate-800 h-auto sm:h-[470px] {$screenWidth <
class="sm:rounded-md shadow-lg bg-[#000] sm:bg-[#09090B] sm:border sm:border-gray-600 h-auto sm:h-[470px] {$screenWidth <
640
? 'w-screen pt-16'
: ''} md:w-[420px] xl:w-[450px] -mx-1 sm:mx-0"

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

@ -77,7 +77,7 @@
<div class="sm:space-y-3">
<div
class="sm:rounded-md shadow-lg sm:border sm:border-slate-800 bg-[#000] lg:bg-[#09090B] h-auto h-auto w-screen pt-16 sm:w-full md:w-[420px] xl:w-[450px] lg:pt-0"
class="sm:rounded-md shadow-lg sm:border sm:border-gray-600 bg-[#000] lg:bg-[#09090B] h-auto h-auto w-screen pt-16 sm:w-full md:w-[420px] xl:w-[450px] lg:pt-0"
>
<!--Start Header-->
<div
@ -114,7 +114,7 @@
<!--End Header-->
<!--Start Content-->
<div class="w-full flex flex-wrap border-t border-slate-800">
<div class="w-full flex flex-wrap border-t border-gray-600">
<h2 class="text-start ml-4 text-2xl font-bold text-white pb-2 mt-3">
ETF Info
</h2>

2
src/lib/components/Footer.svelte
View File

@ -4,7 +4,7 @@
<!--Footer-->
<footer
class="bg-[#09090B] border-t border-slate-800 z-20 sm:z-50 relative bottom-0 w-full sm:px-10 m-auto"
class="bg-[#09090B] border-t border-gray-600 z-20 sm:z-50 relative bottom-0 w-full sm:px-10 m-auto"
>
<div class="container mx-auto px-5 sm:px-3">
<div class="w-full flex flex-col md:flex-row py-6">

2
src/lib/components/Markdown.svelte
View File

@ -180,7 +180,7 @@
{#if mk?.id === id}
<div class="flex flex-col">
<span class="text-gray-400 mb-4">[{outputCounter}] : </span>
<div class="border-b border-slate-800 rounded-md">
<div class="border-b border-gray-600 rounded-md">
{#if hasContent(value)}
{@html value}
{:else}

2
src/lib/components/OptionsData.svelte
View File

@ -250,7 +250,7 @@
{:else}
<div class="flex justify-center items-center m-auto mt-16 mb-6">
<div
class="text-gray-100 text-sm sm:text-[1rem] sm:rounded-md h-auto border border-slate-800 p-4"
class="text-gray-100 text-sm sm:text-[1rem] sm:rounded-md h-auto border border-gray-600 p-4"
>
<svg
class="w-5 h-5 inline-block sm:mr-2 flex-shrink-0"

8
src/lib/components/RuleControl.svelte
View File

@ -27,12 +27,12 @@
{title?.replace('[%]','')} {condition} {value} {unit}
<label on:click={() => changeRuleCondition('under')} class="ml-5 cursor-pointer flex flex-row mr-2 justify-center items-center">
<input type="radio" class="radio checked:bg-[#fff] bg-[#09090B] border border-slate-800 mr-2"
<input type="radio" class="radio checked:bg-[#fff] bg-[#09090B] border border-gray-600 mr-2"
checked={condition === 'under'} name={ruleName} />
<span class="label-text text-white">Under</span>
</label>
<label on:click={() => changeRuleCondition('over')} class="cursor-pointer flex flex-row ml-2 justify-center items-center">
<input type="radio" class="radio checked:bg-[#fff] bg-[#09090B] border border-slate-800 mr-2"
<input type="radio" class="radio checked:bg-[#fff] bg-[#09090B] border border-gray-600 mr-2"
checked={condition === 'over'} name={ruleName} />
<span class="label-text text-white">Over</span>
</label>
@ -114,7 +114,7 @@
>
<input
type="radio"
class="radio checked:bg-[#fff] bg-[#09090B] border border-slate-800 mr-2"
class="radio checked:bg-[#fff] bg-[#09090B] border border-gray-600 mr-2"
checked={condition === "under"}
name={ruleName}
/>
@ -126,7 +126,7 @@
>
<input
type="radio"
class="radio checked:bg-[#fff] bg-[#09090B] border border-slate-800 mr-2"
class="radio checked:bg-[#fff] bg-[#09090B] border border-gray-600 mr-2"
checked={condition === "over"}
name={ruleName}
/>

2
src/lib/components/Searchbar.svelte
View File

@ -469,7 +469,7 @@
<label for="modal-search" class="sr-only">Search</label>
<input
id="modal-search"
class="rounded-md w-full text-white bg-[#09090B] border border-slate-800 focus:ring-transparent placeholder-gray-200 py-3 pl-10 pr-4"
class="rounded-md w-full text-white bg-[#09090B] border border-gray-600 focus:ring-transparent placeholder-gray-200 py-3 pl-10 pr-4"
type="search"
placeholder="Search Anything…"
bind:value={searchQuery}

2
src/lib/components/ShareStatistics.svelte
View File

@ -78,7 +78,7 @@
</div>
{:else}
<div
class="mt-5 text-gray-100 text-sm sm:text-[1rem] sm:rounded-md h-auto border border-slate-800 p-4"
class="mt-5 text-gray-100 text-sm sm:text-[1rem] sm:rounded-md h-auto border border-gray-600 p-4"
>
<svg
class="w-5 h-5 inline-block mr-0.5 flex-shrink-0"

2
src/lib/components/SimilarETFCard.svelte
View File

@ -21,7 +21,7 @@
: 'hidden'}"
>
<div
class="sm:rounded-md shadow-lg bg-[#000] sm:bg-[#09090B] sm:border sm:border-slate-800 h-auto {$screenWidth <
class="sm:rounded-md shadow-lg bg-[#000] sm:bg-[#09090B] sm:border sm:border-gray-600 h-auto {$screenWidth <
640
? 'w-screen pt-16'
: ''} md:w-[420px] xl:w-[450px]"

2
src/lib/components/SimilarTickerCard.svelte
View File

@ -21,7 +21,7 @@
: 'hidden'}"
>
<div
class="sm:rounded-md shadow-lg bg-[#000] sm:bg-[#09090B] sm:border sm:border-slate-800 h-auto {$screenWidth <
class="sm:rounded-md shadow-lg bg-[#000] sm:bg-[#09090B] sm:border sm:border-gray-600 h-auto {$screenWidth <
640
? 'w-screen pt-16'
: ''} md:w-[420px] xl:w-[450px]"

32
src/lib/components/SkeletonLoading.svelte
View File

@ -1,19 +1,27 @@
<!-- Skeleton Post -->
<div class=" mt-5 shadow-lg">
<!-- List container -->
<div class="flex flex-col">
<!-- Item -->
<div class="border border-slate-800 rounded-md bg-[#09090B]">
<div class="border border-gray-600 rounded-md bg-[#09090B]">
<div class="flex h-auto justify-between items-center">
<div role="status" class="animate-pulse space-x-8 md:flex md:items-center mb-4">
<div class="flex items-center justify-center w-48 h-28 sm:w-48 sm:h-48 bg-[#09090B] rounded ">
<svg class="w-12 h-12 text-gray-200" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" viewBox="0 0 640 512"><path d="M480 80C480 35.82 515.8 0 560 0C604.2 0 640 35.82 640 80C640 124.2 604.2 160 560 160C515.8 160 480 124.2 480 80zM0 456.1C0 445.6 2.964 435.3 8.551 426.4L225.3 81.01C231.9 70.42 243.5 64 256 64C268.5 64 280.1 70.42 286.8 81.01L412.7 281.7L460.9 202.7C464.1 196.1 472.2 192 480 192C487.8 192 495 196.1 499.1 202.7L631.1 419.1C636.9 428.6 640 439.7 640 450.9C640 484.6 612.6 512 578.9 512H55.91C25.03 512 .0006 486.1 .0006 456.1L0 456.1z"/></svg>
<div
role="status"
class="animate-pulse space-x-8 md:flex md:items-center mb-4"
>
<div
class="flex items-center justify-center w-48 h-28 sm:w-48 sm:h-48 bg-[#09090B] rounded"
>
<svg
class="w-12 h-12 text-gray-200"
xmlns="http://www.w3.org/2000/svg"
aria-hidden="true"
fill="currentColor"
viewBox="0 0 640 512"
><path
d="M480 80C480 35.82 515.8 0 560 0C604.2 0 640 35.82 640 80C640 124.2 604.2 160 560 160C515.8 160 480 124.2 480 80zM0 456.1C0 445.6 2.964 435.3 8.551 426.4L225.3 81.01C231.9 70.42 243.5 64 256 64C268.5 64 280.1 70.42 286.8 81.01L412.7 281.7L460.9 202.7C464.1 196.1 472.2 192 480 192C487.8 192 495 196.1 499.1 202.7L631.1 419.1C636.9 428.6 640 439.7 640 450.9C640 484.6 612.6 512 578.9 512H55.91C25.03 512 .0006 486.1 .0006 456.1L0 456.1z"
/></svg
>
</div>
<div class="w-full md:w-96">
<div class="h-2.5 bg-gray-100 rounded-full w-48 mb-4"></div>
@ -25,11 +33,7 @@
</div>
<span class="sr-only">Loading...</span>
</div>
</div>
</div>
</div>
</div>

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

@ -305,7 +305,7 @@
<label for="modal-search" class="sr-only">Search</label>
<input
id="modal-search"
class="rounded-md w-full text-white bg-[#09090B] border border-slate-800 focus:ring-transparent placeholder-gray-200 py-3 pl-10 pr-4"
class="rounded-md w-full text-white bg-[#09090B] border border-gray-600 focus:ring-transparent placeholder-gray-200 py-3 pl-10 pr-4"
type="search"
placeholder="Search Anything…"
bind:value={searchQuery}
@ -484,7 +484,7 @@
<label for="modal-search" class="sr-only">Search</label>
<input
id="modal-search"
class="rounded-md w-full text-white bg-[#09090B] border border-slate-800 focus:ring-transparent placeholder-gray-200 py-3 pl-10 pr-4"
class="rounded-md w-full text-white bg-[#09090B] border border-gray-600 focus:ring-transparent placeholder-gray-200 py-3 pl-10 pr-4"
type="search"
placeholder="Search Anything…"
bind:value={searchQuery}

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

@ -81,7 +81,7 @@
<div class="sm:space-y-3">
<div
class="sm:rounded-md lg:border lg:border-slate-800 bg-[#000] lg:bg-[#09090B] h-auto w-screen pt-16 sm:w-full md:w-[420px] xl:w-[450px] lg:pt-0"
class="sm:rounded-md lg:border lg:border-gray-600 bg-[#000] lg:bg-[#09090B] h-auto w-screen pt-16 sm:w-full md:w-[420px] xl:w-[450px] lg:pt-0"
>
<!--Start Header-->
<div
@ -112,7 +112,7 @@
</div>
<!--End Header-->
<!--Start Content-->
<div class="w-full flex flex-wrap border-t border-slate-800 px-2">
<div class="w-full flex flex-wrap border-t border-gray-600 px-2">
<h2 class="text-start ml-2 text-2xl font-bold text-white pb-2 mt-3">
Company Info
</h2>

2
src/lib/components/TopETFTickerHolder.svelte
View File

@ -19,7 +19,7 @@
: 'hidden'}"
>
<div
class="sm:rounded-md shadow-lg bg-[#000] sm:bg-[#09090B] sm:border sm:border-slate-800 h-auto {$screenWidth <
class="sm:rounded-md shadow-lg bg-[#000] sm:bg-[#09090B] sm:border sm:border-gray-600 h-auto {$screenWidth <
640
? 'w-screen pt-16'
: ''} md:w-[420px] xl:w-[450px]"

2
src/lib/components/TopHoldingCard.svelte
View File

@ -41,7 +41,7 @@
class="space-y-3 lg:pt-5 lg:{topHoldingList?.length !== 0 ? '' : 'hidden'}"
>
<div
class="sm:rounded-sm shadow-lg bg-[#000] lg:bg-[#09090B] lg:border lg:border-slate-800 h-auto {$screenWidth <=
class="sm:rounded-sm shadow-lg bg-[#000] lg:bg-[#09090B] lg:border lg:border-gray-600 h-auto {$screenWidth <=
800
? 'w-screen pt-16'
: ''} md:w-[420px] xl:w-[450px]"

2
src/lib/components/WatchListCard.svelte
View File

@ -143,7 +143,7 @@
</table>
</div>
<div class="w-full m-auto border-b border-slate-800 mt-16 mb-16"></div>
<div class="w-full m-auto border-b border-gray-600 mt-16 mb-16"></div>
<h2
class="text-start text-white ml-2 text-xl font-bold text-black mb-3"

6
src/routes/+page.svelte
View File

@ -633,7 +633,7 @@
</ul>
{:else}
<div
class="text-left text-white sm:p-5 w-fit rounded-md flex flex-row items-center sm:border sm:border-slate-800 text-[1rem]"
class="text-left text-white sm:p-5 w-fit rounded-md flex flex-row items-center sm:border sm:border-gray-600 text-[1rem]"
>
<svg
class="hidden sm:inline-block w-6 h-6 flex-shrink-0 sm:mr-2"
@ -719,7 +719,7 @@
</ul>
{:else}
<div
class="text-left text-white sm:p-5 w-fit rounded-md flex flex-row items-center sm:border sm:border-slate-800 text-[1rem]"
class="text-left text-white sm:p-5 w-fit rounded-md flex flex-row items-center sm:border sm:border-gray-600 text-[1rem]"
>
<svg
class="hidden sm:inline-block w-6 h-6 flex-shrink-0 sm:mr-2"
@ -798,7 +798,7 @@
</ul>
{:else}
<div
class="text-left text-white sm:p-5 w-fit rounded-md flex flex-row items-center sm:border sm:border-slate-800 text-[1rem]"
class="text-left text-white sm:p-5 w-fit rounded-md flex flex-row items-center sm:border sm:border-gray-600 text-[1rem]"
>
<svg
class="hidden sm:inline-block w-6 h-6 flex-shrink-0 sm:mr-2"

2
src/routes/contact/+page.svelte
View File

@ -109,7 +109,7 @@
</div>
<div
class="card w-full rounded-none sm:rounded-xl border-t border-slate-800 sm:border sm:border-slate-800 m-auto"
class="card w-full rounded-none sm:rounded-xl border-t border-gray-600 sm:border sm:border-gray-600 m-auto"
>
<div class="card-body">
<h2 class="card-title text-2xl mb-5 text-white">Support</h2>

8
src/routes/crypto/[tickerID]/+layout.svelte
View File

@ -357,7 +357,7 @@
<div class="navbar w-full px-4 py-2">
<div
class="{isScrolled
? 'border-b border-slate-800 ease-in'
? 'border-b border-gray-600 ease-in'
: 'ease-out'} m-auto w-full"
>
<div
@ -699,7 +699,7 @@
>
<!--<img class="rounded-full w-10 h-10" src={logoUrl} alt="" />-->
<div
class="rounded-full w-10 h-10 relative bg-[#141417] flex items-center justify-center border border-slate-800"
class="rounded-full w-10 h-10 relative bg-[#141417] flex items-center justify-center border border-gray-600"
>
<img
style="clip-path: circle(50%);"
@ -729,14 +729,14 @@
<div class="hidden sm:flex ml-auto">
{#if holdingShares !== 0 && data?.user}
<label for="{!data?.user ? 'userLogin' : userPortfolio?.length !== 0 ? 'typeOfTrade' : ''}" class="py-2 px-3 text-sm sm:text-[1rem] cursor-pointer mr-1 flex flex-row ease-in-out duration-100 rounded-full shadow-lg bg-[#09090B] hover:bg-[#313131] border border-slate-800 normal-case cursor-pointer items-center">
<label for="{!data?.user ? 'userLogin' : userPortfolio?.length !== 0 ? 'typeOfTrade' : ''}" class="py-2 px-3 text-sm sm:text-[1rem] cursor-pointer mr-1 flex flex-row ease-in-out duration-100 rounded-full shadow-lg bg-[#09090B] hover:bg-[#313131] border border-gray-600 normal-case cursor-pointer items-center">
<svg class="w-5 h-5 mr-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="white" d="M8 2.5a.5.5 0 0 0-1 0V7H2.5a.5.5 0 0 0 0 1H7v4.5a.5.5 0 0 0 1 0V8h4.5a.5.5 0 0 0 0-1H8z"/></svg>
<span class="text-white font-medium">
Portfolio
</span>
</label>
{:else}
<label for="{!data?.user ? 'userLogin' : userPortfolio?.length === 0 ? 'addPortfolio' : 'buyTradeModal'}" class="py-2 px-3 text-sm sm:text-[1rem] cursor-pointer mr-1 flex flex-row ease-in-out duration-100 rounded-full shadow-lg bg-[#09090B] hover:bg-[#313131] border border-slate-800 normal-case cursor-pointer items-center">
<label for="{!data?.user ? 'userLogin' : userPortfolio?.length === 0 ? 'addPortfolio' : 'buyTradeModal'}" class="py-2 px-3 text-sm sm:text-[1rem] cursor-pointer mr-1 flex flex-row ease-in-out duration-100 rounded-full shadow-lg bg-[#09090B] hover:bg-[#313131] border border-gray-600 normal-case cursor-pointer items-center">
<svg class="w-5 h-5 mr-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="white" d="M8 2.5a.5.5 0 0 0-1 0V7H2.5a.5.5 0 0 0 0 1H7v4.5a.5.5 0 0 0 1 0V8h4.5a.5.5 0 0 0 0-1H8z"/></svg>
<span class="text-white font-medium">
Portfolio

2
src/routes/crypto/[tickerID]/+page.svelte
View File

@ -1250,7 +1250,7 @@ afterUpdate(async () => {
<label
on:click={changeChartType}
class="ml-auto mr-5 -mt-1 sm:hidden border border-slate-800 px-2.5 py-1 rounded-xl"
class="ml-auto mr-5 -mt-1 sm:hidden border border-gray-600 px-2.5 py-1 rounded-xl"
>
{#if displayChartType === "line"}
<svg

10
src/routes/crypto/[tickerID]/congress-trading/+page.svelte
View File

@ -166,7 +166,7 @@
</h1>
<div
class="text-white p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
class="text-white p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"
@ -433,7 +433,7 @@
<div class="relative w-full mt-10">
{#each senateTradingList as item}
<div
class="w-full bg-[#09090B] border border-slate-800 shadow-lg h-auto pb-4 pt-4 mb-7"
class="w-full bg-[#09090B] border border-gray-600 shadow-lg h-auto pb-4 pt-4 mb-7"
>
<div class="flex flex-col relative">
{#if item?.party === "Republican"}
@ -492,7 +492,7 @@
</div>
<div
class="border-1 border-b border-slate-800 w-full mt-5 mb-5"
class="border-1 border-b border-gray-600 w-full mt-5 mb-5"
/>
<div class="flex flex-row items-center pr-4 pl-4">
@ -536,7 +536,7 @@
</div>
<div
class="border-1 border-b border-slate-800 w-full mt-5 mb-5"
class="border-1 border-b border-gray-600 w-full mt-5 mb-5"
/>
<div class="flex flex-row items-center pr-4 pl-4">
@ -575,7 +575,7 @@
{#if rawData?.length >= 20}
<label
on:click={backToTop}
class="w-32 py-1.5 mt-10 hover:bg-white hover:bg-opacity-[0.05] cursor-pointer m-auto flex justify-center items-center border border-slate-800 rounded-full"
class="w-32 py-1.5 mt-10 hover:bg-white hover:bg-opacity-[0.05] cursor-pointer m-auto flex justify-center items-center border border-gray-600 rounded-full"
>
Back to top
</label>

4
src/routes/crypto/[tickerID]/stats/+page.svelte
View File

@ -123,7 +123,7 @@ updateYearRange()
</h1>
<div
class="text-white p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
class="text-white p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"
@ -319,7 +319,7 @@ updateYearRange()
>
<thead>
<tr
class="bg-[#09090B] border-slate-800 rounded text-white font-semibold"
class="bg-[#09090B] border-gray-600 rounded text-white font-semibold"
>
<th class="text-start text-sm sm:text-[1rem]">Started</th>
<th class="text-sm sm:text-[1rem] text-end">Recovered</th>

2
src/routes/dividends-calendar/+page.svelte
View File

@ -540,7 +540,7 @@
</div>
{:else}
<div
class="text-white p-5 mt-5 w-fit m-auto rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-[1rem]"
class="text-white p-5 mt-5 w-fit m-auto rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"

2
src/routes/earnings-calendar/+page.svelte
View File

@ -606,7 +606,7 @@
</div>
{:else}
<div
class="text-white p-5 mt-5 w-fit m-auto rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-[1rem]"
class="text-white p-5 mt-5 w-fit m-auto rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"

2
src/routes/economic-calendar/+page.svelte
View File

@ -755,7 +755,7 @@
</div>
{:else}
<div
class="text-white p-5 mt-5 w-fit m-auto rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-[1rem]"
class="text-white p-5 mt-5 w-fit m-auto rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"

2
src/routes/economic-indicator/+page.svelte
View File

@ -848,7 +848,7 @@
class="table table-sm table-compact rounded-none sm:rounded-md w-full border-bg-[#09090B] m-auto mt-4"
>
<thead>
<tr class="border border-slate-800">
<tr class="border border-gray-600">
<th
class="text-white font-semibold text-start text-sm sm:text-[1rem]"
>Date</th

2
src/routes/etf/[tickerID]/+layout.svelte
View File

@ -312,7 +312,7 @@
<div class="navbar w-full px-4 py-2">
<div
class="{isScrolled
? 'border-b border-slate-800 ease-in'
? 'border-b border-gray-600 ease-in'
: 'ease-out'} m-auto w-full"
>
<div

2
src/routes/etf/[tickerID]/holdings/+page.svelte
View File

@ -80,7 +80,7 @@
<div class="sm:p-7 w-full m-auto mt-2 sm:mt-0">
<div class="mb-6">
<div
class="text-white p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
class="text-white p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"

2
src/routes/etf/[tickerID]/insider/+page.svelte
View File

@ -395,7 +395,7 @@
{#if rawData?.length >= 20}
<label
on:click={backToTop}
class="w-32 py-1.5 mt-10 hover:bg-white hover:bg-opacity-[0.05] cursor-pointer m-auto flex justify-center items-center border border-slate-800 rounded-full"
class="w-32 py-1.5 mt-10 hover:bg-white hover:bg-opacity-[0.05] cursor-pointer m-auto flex justify-center items-center border border-gray-600 rounded-full"
>
Back to top
</label>

6
src/routes/etf/[tickerID]/options/+page.svelte
View File

@ -588,7 +588,7 @@
</div>
<div
class="w-fit text-white p-3 sm:p-5 mb-5 rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
class="w-fit text-white p-3 sm:p-5 mb-5 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"
@ -725,7 +725,7 @@
class="text-xl text-white m-auto flex justify-center items-center h-full"
>
<div
class="text-gray-100 text-sm sm:text-[1rem] sm:rounded-md h-auto border border-slate-800 p-4"
class="text-gray-100 text-sm sm:text-[1rem] sm:rounded-md h-auto border border-gray-600 p-4"
>
<svg
class="w-5 h-5 inline-block sm:mr-2 flex-shrink-0"
@ -1130,7 +1130,7 @@
{:else}
<div class="flex justify-center items-center m-auto mt-16 mb-6">
<div
class="text-gray-100 text-sm sm:text-[1rem] rounded-md h-auto border border-slate-800 p-4"
class="text-gray-100 text-sm sm:text-[1rem] rounded-md h-auto border border-gray-600 p-4"
>
<svg
class="w-5 h-5 inline-block sm:mr-2 flex-shrink-0"

4
src/routes/etf/[tickerID]/stats/+page.svelte
View File

@ -123,7 +123,7 @@ updateYearRange()
</h1>
<div
class="text-white p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
class="text-white p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"
@ -319,7 +319,7 @@ updateYearRange()
>
<thead>
<tr
class="bg-[#09090B] border-slate-800 rounded text-white font-semibold"
class="bg-[#09090B] border-gray-600 rounded text-white font-semibold"
>
<th class="text-start text-sm sm:text-[1rem]">Started</th>
<th class="text-sm sm:text-[1rem] text-end">Recovered</th>

4
src/routes/heatmaps/+page.svelte
View File

@ -491,7 +491,7 @@ async function exportTreemap() {
></label>
<div
class="modal-box w-full bg-[#000] sm:bg-[#09090B] sm:border sm:border-slate-800"
class="modal-box w-full bg-[#000] sm:bg-[#09090B] sm:border sm:border-gray-600"
>
<label
for="indexModal"
@ -566,7 +566,7 @@ async function exportTreemap() {
></label>
<div
class="modal-box w-full bg-[#000] sm:bg-[#09090B] sm:border sm:border-slate-800"
class="modal-box w-full bg-[#000] sm:bg-[#09090B] sm:border sm:border-gray-600"
>
<label
for="exportDataModal"

2
src/routes/ipos/[slug]/+page.svelte
View File

@ -232,7 +232,7 @@
{:else}
<div class="flex justify-center items-center m-auto mt-10 mb-6">
<div
class="text-gray-100 text-center text-sm sm:text-[1rem] rounded-md h-auto border border-slate-800 p-4"
class="text-gray-100 text-center text-sm sm:text-[1rem] rounded-md h-auto border border-gray-600 p-4"
>
<svg
class="w-5 h-5 inline-block sm:mr-2 flex-shrink-0"

2
src/routes/newsletter/+page.svelte
View File

@ -123,7 +123,7 @@
</div>
<div
class="bg-[#09090B] sm:mt-10 sm:rounded-xl border-t sm:border hover:border-slate-700 border-slate-800 pb-10"
class="bg-[#09090B] sm:mt-10 sm:rounded-xl border-t sm:border hover:border-slate-700 border-gray-600 pb-10"
>
<div
class="text-white w-5/6 sm:w-full m-auto sm:m-0 text-center sm:text-start font-bold text-2xl flex justify-center sm:justify-start items-center pt-10 sm:ml-10"

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

@ -1316,7 +1316,7 @@ function sendMessage(message) {
>
<input
type="radio"
class="radio checked:bg-[#fff] bg-[#09090B] border border-slate-800 mr-2"
class="radio checked:bg-[#fff] bg-[#09090B] border border-gray-600 mr-2"
checked={ruleCondition[row?.rule] ===
"under"}
name={row?.rule}
@ -1332,7 +1332,7 @@ function sendMessage(message) {
>
<input
type="radio"
class="radio checked:bg-[#fff] bg-[#09090B] border border-slate-800 mr-2"
class="radio checked:bg-[#fff] bg-[#09090B] border border-gray-600 mr-2"
checked={ruleCondition[row?.rule] ===
"over"}
name={row?.rule}
@ -2086,7 +2086,7 @@ function sendMessage(message) {
</div>
{:else}
<div
class="text-white text-center p-3 sm:p-5 mb-10 mt-5 rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
class="text-white text-center p-3 sm:p-5 mb-10 mt-5 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"

4
src/routes/politicians/+page.svelte
View File

@ -273,7 +273,7 @@
? 'sm:hover:shadow-[#80000D]'
: item?.party === 'Democratic'
? 'sm:hover:shadow-[#1358C3]'
: 'sm:hover:shadow-[#636465]'} border-slate-800 shadow-md rounded-md h-auto pb-4 pt-4 mb-7"
: 'sm:hover:shadow-[#636465]'} border-gray-600 shadow-md rounded-md h-auto pb-4 pt-4 mb-7"
>
<div class="flex flex-col relative">
{#if item?.party === "Republican"}
@ -394,7 +394,7 @@
></label>
<div
class="modal-box w-full bg-[#09090B] sm:border sm:border-slate-800 max-h-[600px] overflow-y-scroll"
class="modal-box w-full bg-[#09090B] sm:border sm:border-gray-600 max-h-[600px] overflow-y-scroll"
>
<label
for="filterList"

10
src/routes/stock-screener/+page.svelte
View File

@ -2639,7 +2639,7 @@ const handleKeyDown = (event) => {
>
<input
type="radio"
class="radio ring-0 checked:bg-[#fff] bg-[#09090B] border border-slate-800 mr-2"
class="radio ring-0 checked:bg-[#fff] bg-[#09090B] border border-gray-600 mr-2"
checked={ruleCondition[row?.rule] ===
"under"}
name={row?.rule}
@ -2655,7 +2655,7 @@ const handleKeyDown = (event) => {
>
<input
type="radio"
class="radio checked:bg-[#fff] bg-[#09090B] border border-slate-800 mr-2"
class="radio checked:bg-[#fff] bg-[#09090B] border border-gray-600 mr-2"
checked={ruleCondition[row?.rule] ===
"over"}
name={row?.rule}
@ -2779,12 +2779,12 @@ const handleKeyDown = (event) => {
<!--Start Rules Preview -->
<!--
<div id="step-3" class="m-auto w-5/6 bg-[#09090B] sm:ml-10 h-auto max-h-[400px] no-scrollbar overflow-hidden overflow-y-scroll p-5 sm:rounded-md border-b sm:border sm:hover:border-slate-700 border-slate-800 pb-10">
<div id="step-3" class="m-auto w-5/6 bg-[#09090B] sm:ml-10 h-auto max-h-[400px] no-scrollbar overflow-hidden overflow-y-scroll p-5 sm:rounded-md border-b sm:border sm:hover:border-slate-700 border-gray-600 pb-10">
<div class="flex flex-row items-center pb-5 sm:pb-0">
<div class="text-white font-bold text-xl sm:text-2xl flex justify-start items-center">
{ruleOfList.length} Rules Preview
</div>
<label on:click={handleResetAll} class="ml-auto cursor-pointer transition bg-[#fff] sm:hover:bg-gray-300 border border-slate-800 py-2 px-3 rounded-md text-white text-sm">
<label on:click={handleResetAll} class="ml-auto cursor-pointer transition bg-[#fff] sm:hover:bg-gray-300 border border-gray-600 py-2 px-3 rounded-md text-white text-sm">
Reset All
</label>
</div>
@ -3084,7 +3084,7 @@ const handleKeyDown = (event) => {
{/if}
{:else}
<div
class="text-white p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
class="text-white p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"

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

@ -380,7 +380,7 @@
<div class="navbar w-full px-4 py-2">
<div
class="{isScrolled
? 'border-b border-slate-800 ease-in'
? 'border-b border-gray-600 ease-in'
: 'ease-out'} m-auto w-full"
>
<div

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

@ -31,6 +31,16 @@
$coolMode = false;
let timeFrame = "10Y";
let activeIdx = 0;
const tabs = [
{
title: "Annual",
},
{
title: "Quarterly",
},
];
const statementConfig = [
{
@ -322,10 +332,12 @@
};
$: {
if (timeFrame || displayStatement || filterRule) {
if (filterRule === "annual") {
if (timeFrame || displayStatement || activeIdx) {
if (activeIdx === 0) {
filterRule = "annual";
fullStatement = data?.getIncomeStatement?.annual;
} else {
filterRule = "quarterly";
fullStatement = data?.getIncomeStatement?.quarter;
}
income = filterStatement(fullStatement, timeFrame);
@ -370,7 +382,9 @@
</svelte:head>
<section class="bg-[#09090B] w-full overflow-hidden text-white h-full">
<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 mt-4 sm:mt-0"
>
<div
class="w-full relative flex justify-center items-center overflow-hidden"
>
@ -393,7 +407,7 @@
<div class="grid grid-cols-1 gap-2">
<div
class="text-white p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
class="text-white p-3 sm:p-5 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"
@ -416,51 +430,37 @@
{/if}
</div>
<ul
class="text-[0.8rem] font-medium text-center w-56 w-56 pb-6 flex justify-center sm:justify-end items-center m-auto sm:m-0 sm:ml-auto"
<div
class="inline-flex justify-center w-full rounded-md sm:w-auto sm:ml-auto mt-3 mb-6"
>
<li class="w-full">
<label
on:click={() => (filterRule = "annual")}
class="cursor-pointer rounded-l-md inline-block w-full text-sm py-1.5 {filterRule ===
'annual'
? 'bg-[#fff] text-black'
: 'bg-[#313131] text-white'} font-semibold"
aria-current="page"
<div
class="bg-[#313131] w-full min-w-24 sm:w-fit relative flex flex-wrap items-center justify-center rounded-md p-1 mt-4"
>
Annual
</label>
</li>
<li class="w-full">
{#if data?.user?.tier === "Pro"}
<label
on:click={() => (filterRule = "quartely")}
class="cursor-pointer inline-block w-full py-1.5 text-sm {filterRule ===
'quartely'
? 'bg-[#fff] text-black'
: 'bg-[#313131] text-white'} font-semibold rounded-r-md"
{#each tabs as item, i}
<button
on:click={() => (activeIdx = i)}
class="group relative z-[1] rounded-full w-1/2 min-w-24 md:w-auto px-5 py-1 {activeIdx ===
i
? 'z-0'
: ''} "
>
Quartely
</label>
{:else}
<a
href="/pricing"
class="flex flex-row items-center m-auto justify-center cursor-pointer inline-block w-full py-1.5 bg-[#313131] font-semibold text-white rounded-r-md"
>
<span class="">Quarterly</span>
<svg
class="ml-1 -mt-0.5 w-3.5 h-3.5"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
><path
fill="#A3A3A3"
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
>
</a>
{#if activeIdx === i}
<div
class="absolute inset-0 rounded-md bg-[#fff]"
></div>
{/if}
</li>
</ul>
<span
class="relative text-sm block font-semibold {activeIdx ===
i
? 'text-black'
: 'text-white'}"
>
{item.title}
</span>
</button>
{/each}
</div>
</div>
<div
class="mb-2 flex flex-row items-center w-full justify-end sm:justify-center"
@ -621,7 +621,7 @@
class="table table-sm table-compact rounded-none sm:rounded-md w-full border-bg-[#09090B] m-auto mt-4"
>
<thead>
<tr class="border border-slate-800">
<tr class="border border-gray-600">
<th
class="text-white font-semibold text-start text-sm sm:text-[1rem]"
>{filterRule === "annual"

92
src/routes/stocks/[tickerID]/financials/balance-sheet/+page.svelte
View File

@ -31,6 +31,17 @@
$: $coolMode = false;
let timeFrame = "10Y";
let activeIdx = 0;
const tabs = [
{
title: "Annual",
},
{
title: "Quarterly",
},
];
const statementConfig = [
{
propertyName: "cashAndCashEquivalents",
@ -401,13 +412,14 @@
};
$: {
if (timeFrame || displayStatement || filterRule) {
if (filterRule === "annual") {
if (timeFrame || displayStatement || activeIdx) {
if (activeIdx === 0) {
filterRule = "annual";
fullStatement = data?.getBalanceSheetStatement?.annual;
} else {
filterRule = "quarterly";
fullStatement = data?.getBalanceSheetStatement?.quarter;
}
balanceSheet = filterStatement(fullStatement, timeFrame);
if ($coolMode === true) {
@ -455,7 +467,9 @@
</svelte:head>
<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 mt-4 sm:mt-0"
>
<div
class="relative flex justify-center items-center overflow-hidden w-full"
>
@ -477,7 +491,7 @@
<div class="grid grid-cols-1 gap-2">
<div
class="text-white p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
class="text-white p-3 sm:p-5 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"
@ -500,51 +514,35 @@
{/if}
</div>
<ul
class="text-[0.8rem] font-medium text-center w-56 w-56 pb-6 flex justify-center sm:justify-end items-center m-auto sm:m-0 sm:ml-auto"
<div
class="inline-flex justify-center w-full rounded-md sm:w-auto sm:ml-auto mt-3 mb-6"
>
<li class="w-full">
<label
on:click={() => (filterRule = "annual")}
class="cursor-pointer rounded-l-md inline-block w-full text-sm py-1.5 {filterRule ===
'annual'
? 'bg-[#fff] text-black'
: 'bg-[#313131] text-white'} font-semibold"
aria-current="page"
<div
class="bg-[#313131] w-full min-w-24 sm:w-fit relative flex flex-wrap items-center justify-center rounded-md p-1 mt-4"
>
Annual
</label>
</li>
<li class="w-full">
{#if data?.user?.tier === "Pro"}
<label
on:click={() => (filterRule = "quartely")}
class="cursor-pointer inline-block w-full py-1.5 text-sm {filterRule ===
'quartely'
? 'bg-[#fff] text-black'
: 'bg-[#313131] text-white'} font-semibold rounded-r-md"
{#each tabs as item, i}
<button
on:click={() => (activeIdx = i)}
class="group relative z-[1] rounded-full w-1/2 min-w-24 md:w-auto px-5 py-1 {activeIdx ===
i
? 'z-0'
: ''} "
>
Quartely
</label>
{:else}
<a
href="/pricing"
class="flex flex-row items-center m-auto justify-center cursor-pointer inline-block w-full py-1.5 bg-[#313131] font-semibold text-white rounded-r-md"
>
<span class="">Quarterly</span>
<svg
class="ml-1 -mt-0.5 w-3.5 h-3.5"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
><path
fill="#A3A3A3"
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
>
</a>
{#if activeIdx === i}
<div class="absolute inset-0 rounded-md bg-[#fff]"></div>
{/if}
</li>
</ul>
<span
class="relative text-sm block font-semibold {activeIdx ===
i
? 'text-black'
: 'text-white'}"
>
{item.title}
</span>
</button>
{/each}
</div>
</div>
<div
class="mb-6 sm:mb-3 flex flex-row items-center w-full justify-end sm:justify-center mt-3 sm:mt-0"
@ -733,7 +731,7 @@
class="table table-sm table-compact rounded-none sm:rounded-md w-full border-bg-[#09090B] m-auto mt-4"
>
<thead>
<tr class="border border-slate-800">
<tr class="border border-gray-600">
<th class="text-white font-semibold text-start text-sm"
>{filterRule === "annual"
? "Fiscal Year End"

94
src/routes/stocks/[tickerID]/financials/cash-flow/+page.svelte
View File

@ -30,7 +30,16 @@
let tableList = [];
let timeFrame = "10Y";
let activeIdx = 0;
const tabs = [
{
title: "Annual",
},
{
title: "Quarterly",
},
];
const statementConfig = [
{
propertyName: "netIncome",
@ -346,13 +355,14 @@
};
$: {
if (timeFrame || displayStatement || filterRule) {
if (filterRule === "annual") {
if (timeFrame || displayStatement || activeIdx) {
if (activeIdx === 0) {
filterRule = "annual";
fullStatement = data?.getCashFlowStatement?.annual;
} else {
filterRule = "quarterly";
fullStatement = data?.getCashFlowStatement?.quarter;
}
cashFlow = filterStatement(fullStatement, timeFrame);
if ($coolMode === true) {
@ -400,7 +410,9 @@
</svelte:head>
<section class="w-full 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 mt-4 sm:mt-0"
>
<div
class="relative flex justify-center items-center overflow-hidden w-full"
>
@ -420,7 +432,7 @@
<div class="grid grid-cols-1 gap-2 w-full">
<div
class="w-full text-white p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
class="w-full text-white p-3 sm:p-5 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"
@ -443,51 +455,35 @@
{/if}
</div>
<ul
class="text-[0.8rem] font-medium text-center w-56 w-56 pb-6 flex justify-center sm:justify-end items-center m-auto sm:m-0 sm:ml-auto"
<div
class="inline-flex justify-center w-full rounded-md sm:w-auto sm:ml-auto mt-3 mb-6"
>
<li class="w-full">
<label
on:click={() => (filterRule = "annual")}
class="cursor-pointer rounded-l-md inline-block w-full text-sm py-1.5 {filterRule ===
'annual'
? 'bg-[#fff] text-black'
: 'bg-[#313131] text-white'} font-semibold"
aria-current="page"
<div
class="bg-[#313131] w-full min-w-24 sm:w-fit relative flex flex-wrap items-center justify-center rounded-md p-1 mt-4"
>
Annual
</label>
</li>
<li class="w-full">
{#if data?.user?.tier === "Pro"}
<label
on:click={() => (filterRule = "quartely")}
class="cursor-pointer inline-block w-full py-1.5 text-sm {filterRule ===
'quartely'
? 'bg-[#fff] text-black'
: 'bg-[#313131] text-white'} font-semibold rounded-r-md"
{#each tabs as item, i}
<button
on:click={() => (activeIdx = i)}
class="group relative z-[1] rounded-full w-1/2 min-w-24 md:w-auto px-5 py-1 {activeIdx ===
i
? 'z-0'
: ''} "
>
Quartely
</label>
{:else}
<a
href="/pricing"
class="flex flex-row items-center m-auto justify-center cursor-pointer inline-block w-full py-1.5 bg-[#313131] font-semibold text-white rounded-r-md"
>
<span class="">Quarterly</span>
<svg
class="ml-1 -mt-0.5 w-3.5 h-3.5"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
><path
fill="#A3A3A3"
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
>
</a>
{#if activeIdx === i}
<div class="absolute inset-0 rounded-md bg-[#fff]"></div>
{/if}
</li>
</ul>
<span
class="relative text-sm block font-semibold {activeIdx ===
i
? 'text-black'
: 'text-white'}"
>
{item.title}
</span>
</button>
{/each}
</div>
</div>
<div
class="mb-2 flex flex-row items-center w-full justify-end sm:justify-center"
@ -664,7 +660,7 @@
class="table table-sm table-compact rounded-none sm:rounded-md w-full border-bg-[#09090B] m-auto mt-4"
>
<thead>
<tr class="border border-slate-800">
<tr class="border border-gray-600">
<th
class="text-white font-semibold text-start text-sm sm:text-[1rem]"
>{filterRule === "annual"
@ -1050,7 +1046,7 @@
class="cursor-pointer modal-backdrop bg-[#09090B] bg-opacity-[0.5]"
></label>
<div class="modal-box w-full bg-[#09090B] sm:border sm:border-slate-800">
<div class="modal-box w-full bg-[#09090B] sm:border sm:border-gray-600">
<label
for="timeFrameModal"
class="cursor-pointer absolute right-5 top-2 bg-[#09090B] text-[1.8rem] text-white"
@ -1246,7 +1242,7 @@
<label id="exportDataModal" for="exportDataModal" class="cursor-pointer modal-backdrop bg-[#09090B] bg-opacity-[0.5]"></label>
<div class="modal-box w-full bg-[#09090B] sm:border sm:border-slate-800">
<div class="modal-box w-full bg-[#09090B] sm:border sm:border-gray-600">

90
src/routes/stocks/[tickerID]/financials/ratios/+page.svelte
View File

@ -30,7 +30,16 @@
$coolMode = false;
let timeFrame = "10Y";
let activeIdx = 0;
const tabs = [
{
title: "Annual",
},
{
title: "Quarterly",
},
];
const statementConfig = [
{
propertyName: "priceEarningsRatio",
@ -309,13 +318,14 @@
};
$: {
if (timeFrame || displayStatement || filterRule) {
if (filterRule === "annual") {
if (timeFrame || displayStatement || activeIdx) {
if (activeIdx === 0) {
filterRule = "annual";
fullStatement = data?.getRatiosStatement?.annual;
} else {
filterRule = "quarterly";
fullStatement = data?.getRatiosStatement?.quarter;
}
ratios = filterStatement(fullStatement, timeFrame);
if ($coolMode === true) {
@ -364,7 +374,9 @@
</svelte:head>
<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 mt-4 sm:mt-0"
>
<div
class="w-full relative flex justify-center items-center overflow-hidden"
>
@ -384,7 +396,7 @@
<div class="grid grid-cols-1 gap-2">
<div
class="text-white p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
class="text-white p-3 sm:p-5 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"
@ -407,51 +419,35 @@
{/if}
</div>
<ul
class="text-[0.8rem] font-medium text-center w-56 w-56 pb-6 flex justify-center sm:justify-end items-center m-auto sm:m-0 sm:ml-auto"
<div
class="inline-flex justify-center w-full rounded-md sm:w-auto sm:ml-auto mt-3 mb-6"
>
<li class="w-full">
<label
on:click={() => (filterRule = "annual")}
class="cursor-pointer rounded-l-md inline-block w-full text-sm py-1.5 {filterRule ===
'annual'
? 'bg-[#fff] text-black'
: 'bg-[#313131] text-white'} font-semibold"
aria-current="page"
<div
class="bg-[#313131] w-full min-w-24 sm:w-fit relative flex flex-wrap items-center justify-center rounded-md p-1 mt-4"
>
Annual
</label>
</li>
<li class="w-full">
{#if data?.user?.tier === "Pro"}
<label
on:click={() => (filterRule = "quartely")}
class="cursor-pointer inline-block w-full py-1.5 text-sm {filterRule ===
'quartely'
? 'bg-[#fff] text-black'
: 'bg-[#313131] text-white'} font-semibold rounded-r-md"
{#each tabs as item, i}
<button
on:click={() => (activeIdx = i)}
class="group relative z-[1] rounded-full w-1/2 min-w-24 md:w-auto px-5 py-1 {activeIdx ===
i
? 'z-0'
: ''} "
>
Quartely
</label>
{:else}
<a
href="/pricing"
class="flex flex-row items-center m-auto justify-center cursor-pointer inline-block w-full py-1.5 bg-[#313131] font-semibold text-white rounded-r-md"
>
<span class="">Quarterly</span>
<svg
class="ml-1 -mt-0.5 w-3.5 h-3.5"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
><path
fill="#A3A3A3"
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
>
</a>
{#if activeIdx === i}
<div class="absolute inset-0 rounded-md bg-[#fff]"></div>
{/if}
</li>
</ul>
<span
class="relative text-sm block font-semibold {activeIdx ===
i
? 'text-black'
: 'text-white'}"
>
{item.title}
</span>
</button>
{/each}
</div>
</div>
<div
class="mb-2 flex flex-row items-center w-full justify-end sm:justify-center"
@ -610,7 +606,7 @@
class="table table-sm table-compact rounded-none sm:rounded-md w-full border-bg-[#09090B] m-auto mt-4"
>
<thead>
<tr class="border border-slate-800">
<tr class="border border-gray-600">
<th
class="text-white font-semibold text-start text-sm sm:text-[1rem]"
>{filterRule === "annual"

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

@ -51,7 +51,6 @@
rawAnalystList?.length > 5 ? rawAnalystList?.slice(-6) : rawAnalystList;
const categories = ["Strong Buy", "Buy", "Hold", "Sell", "Strong Sell"];
console.log(rawAnalystList);
function findIndex(data) {
const currentYear = new Date().getFullYear();
@ -718,9 +717,16 @@
<div
class="flex items-baseline text-2xl font-semibold text-white"
>
{abbreviateNumber(
data?.getAnalystEstimate[index - 1]?.estimatedRevenueAvg,
)}
{data?.getAnalystEstimate[index - 1]
?.estimatedRevenueAvg !== null &&
data?.getAnalystEstimate[index - 1]?.estimatedRevenueAvg !==
0
? abbreviateNumber(
data?.getAnalystEstimate[index - 1]
?.estimatedRevenueAvg,
)
: "n/a"}
{#if data?.getAnalystEstimate[index - 1]?.estimatedRevenueAvg !== null && data?.getAnalystEstimate[index - 1]?.estimatedRevenueAvg !== 0}
<div
class="ml-2 block text-sm font-semibold text-white lg:hidden"
>
@ -728,7 +734,9 @@
data?.getAnalystEstimate[index - 2]?.revenue,
)}
</div>
{/if}
</div>
{#if data?.getAnalystEstimate[index - 1]?.estimatedRevenueAvg !== null && data?.getAnalystEstimate[index - 1]?.estimatedRevenueAvg !== 0}
<div
class="inline-flex items-baseline rounded-full px-2.5 py-0.5 text-sm font-semibold md:mt-2 lg:mt-0 {changeRevenue >
0
@ -754,7 +762,9 @@
> <span class="sr-only">Increased by</span>
{abbreviateNumber(changeRevenue?.toFixed(1))}%
</div>
{/if}
</div>
{#if data?.getAnalystEstimate[index - 1]?.estimatedRevenueAvg !== null && data?.getAnalystEstimate[index - 1]?.estimatedRevenueAvg !== 0}
<div
class="ml-0.5 mt-1.5 hidden text-sm font-semibold text-white lg:block"
>
@ -762,6 +772,7 @@
data?.getAnalystEstimate[index - 2]?.revenue,
)}
</div>
{/if}
</div>
<div
class="border-b px-3 py-5 last:border-b-0 xs:px-4 sm:p-6 md:border-b md:border-l lg:border-b-0"
@ -942,7 +953,7 @@
</div>
{:else}
<div
class="text-white p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
class="text-white p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"

73
src/routes/stocks/[tickerID]/forecast/analyst/+page.svelte
View File

@ -52,6 +52,31 @@
: "-";
}
function filterLatestEntries(data) {
const latestEntries = {};
data?.forEach((entry) => {
try {
// Create a unique key by combining 'analyst' and 'name'
const key = `${entry.analyst}-${entry.name}`;
// Convert date and time to a Date object
const dateTimeStr = `${entry.date} ${entry.time}`;
const dateTime = new Date(dateTimeStr);
// Check if this entry is the latest for the given key
if (!latestEntries[key] || dateTime > latestEntries[key].dateTime) {
latestEntries[key] = { dateTime, entry };
}
} catch (e) {
console.error(`Error processing entry: ${e}`);
}
});
// Return only the latest entries
return Object?.values(latestEntries)?.map(({ entry }) => entry);
}
const now = new Date();
const oneYearAgo = new Date(now);
oneYearAgo.setFullYear(now.getFullYear() - 1);
@ -60,6 +85,7 @@
data?.getAnalystTickerHistory?.filter(
(item) => item?.analystScore >= 4,
) ?? [];
rawData = filterLatestEntries(rawData);
if (activeIdx === 1) {
const recentData = rawData
@ -292,7 +318,7 @@
class="mt-1 break-words font-semibold leading-8 text-white tiny:text-lg xs:text-xl sm:text-2xl"
>
{priceTarget !== null && priceTarget !== undefined
? "$" + priceTarget
? priceTarget
: "n/a"}
</div>
</div>
@ -316,6 +342,24 @@
</div>
{#if rawData?.length !== 0}
{#if activeIdx === 1}
<div
class="w-full text-white text-start p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 256 256"
><path
fill="#fff"
d="M128 24a104 104 0 1 0 104 104A104.11 104.11 0 0 0 128 24m-4 48a12 12 0 1 1-12 12a12 12 0 0 1 12-12m12 112a16 16 0 0 1-16-16v-40a8 8 0 0 1 0-16a16 16 0 0 1 16 16v40a8 8 0 0 1 0 16"
/></svg
>
Considering only the latest rating within the past 12 months from each
unique analyst with a 4-star or higher rating.
</div>
{/if}
<div
class="mt-10 mb-5 items-center justify-between py-0 md:mt-8 md:flex md:py-2"
>
@ -422,13 +466,12 @@
</td>
<td
class="text-sm sm:text-[1rem] whitespace-nowrap text-end text-white"
class="text-sm sm:text-[1rem] whitespace-nowrap font-medium text-end text-white"
>
<span
class="text-[1rem] font-medium {[
'Strong Buy',
'Buy',
]?.includes(item?.rating_current)
class=" {['Strong Buy', 'Buy']?.includes(
item?.rating_current,
)
? 'text-[#00FC50]'
: item?.rating_current === 'Hold'
? 'text-[#FF7070]'
@ -452,13 +495,13 @@
</td>
<td
class="text-sm sm:text-[1rem] whitespace-nowrap text-end text-white"
class="text-sm sm:text-[1rem] whitespace-nowrap text-end text-white font-semibold"
>
<div class="flex flex-col items-end">
<div class="flex flex-row items-center">
{#if Math?.ceil(item?.adjusted_pt_prior) !== 0}
<span class="text-gray-100 font-normal"
>${Math?.ceil(item?.adjusted_pt_prior)}</span
>{Math?.ceil(item?.adjusted_pt_prior)}</span
>
<svg
class="w-3 h-3 ml-1 mr-1 inline-block"
@ -469,17 +512,19 @@
stroke="white"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="1.5"
stroke-width="2.5"
d="M4 12h16m0 0l-6-6m6 6l-6 6"
/></svg
>
<span class="text-white font-semibold"
>${Math?.ceil(item?.adjusted_pt_current)}</span
<span class=""
>{Math?.ceil(item?.adjusted_pt_current)}</span
>
{:else if Math?.ceil(item?.adjusted_pt_current) !== 0}
<span class="text-white font-semibold"
>${Math?.ceil(item?.adjusted_pt_current)}</span
<span class=""
>{Math?.ceil(item?.adjusted_pt_current)}</span
>
{:else}
<span class="">n/a</span>
{/if}
</div>
</div>
@ -512,7 +557,7 @@
{:else if activeIdx === 1}
<div class="w-full flex justify-start items-center m-auto mt-10 mb-6">
<div
class="text-center w-fit text-gray-100 text-sm sm:text-[1rem] rounded-md h-auto border border-slate-800 p-4"
class="text-center w-fit text-gray-100 text-sm sm:text-[1rem] rounded-md h-auto border border-gray-600 p-4"
>
<svg
class="w-5 h-5 inline-block sm:mr-1 flex-shrink-0"

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

@ -272,7 +272,7 @@
</h1>
{#if insiderTradingList?.length === 0}
<div
class="w-fit text-white p-3 sm:p-5 mb-5 rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
class="w-fit text-white p-3 sm:p-5 mb-5 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"
@ -680,7 +680,7 @@
{#if rawData?.length > 5 && rawData?.length === insiderTradingList?.length && data?.user?.tier === "Pro"}
<label
on:click={backToTop}
class="w-32 py-1.5 mt-10 hover:bg-white hover:bg-opacity-[0.05] cursor-pointer m-auto flex justify-center items-center border border-slate-800 rounded-full"
class="w-32 py-1.5 mt-10 hover:bg-white hover:bg-opacity-[0.05] cursor-pointer m-auto flex justify-center items-center border border-gray-600 rounded-full"
>
Back to top
</label>

2
src/routes/stocks/[tickerID]/insider/congress-trading/+page.svelte
View File

@ -395,7 +395,7 @@
{#if rawData?.length >= 20}
<label
on:click={backToTop}
class="w-32 py-1.5 mt-10 hover:bg-white hover:bg-opacity-[0.05] cursor-pointer m-auto flex justify-center items-center border border-slate-800 rounded-full"
class="w-32 py-1.5 mt-10 hover:bg-white hover:bg-opacity-[0.05] cursor-pointer m-auto flex justify-center items-center border border-gray-600 rounded-full"
>
Back to top
</label>

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

@ -251,7 +251,7 @@
{/if}
{:else}
<div
class="w-full text-white text-start p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
class="w-full text-white text-start p-3 sm:p-5 mb-10 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"

2
src/routes/stocks/[tickerID]/metrics/[slug]/+page.svelte
View File

@ -181,7 +181,7 @@
class="table table-sm table-compact rounded-none sm:rounded-md w-full border-bg-[#09090B] m-auto mt-4"
>
<thead>
<tr class="border border-slate-800">
<tr class="border border-gray-600">
<th
class="text-white font-semibold text-start text-sm sm:text-[1rem]"
>Quarter</th

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

@ -588,7 +588,7 @@
</div>
<div
class="w-fit text-white p-3 sm:p-5 mb-5 rounded-md sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]"
class="w-fit text-white p-3 sm:p-5 mb-5 rounded-md sm:flex sm:flex-row sm:items-center border border-gray-600 text-sm sm:text-[1rem]"
>
<svg
class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2"
@ -725,7 +725,7 @@
class="text-xl text-white m-auto flex justify-center items-center h-full"
>
<div
class="text-gray-100 text-sm sm:text-[1rem] sm:rounded-md h-auto border border-slate-800 p-4"
class="text-gray-100 text-sm sm:text-[1rem] sm:rounded-md h-auto border border-gray-600 p-4"
>
<svg
class="w-5 h-5 inline-block sm:mr-2 flex-shrink-0"
@ -1130,7 +1130,7 @@
{:else}
<div class="flex justify-center items-center m-auto mt-16 mb-6">
<div
class="text-gray-100 text-sm sm:text-[1rem] rounded-md h-auto border border-slate-800 p-4"
class="text-gray-100 text-sm sm:text-[1rem] rounded-md h-auto border border-gray-600 p-4"
>
<svg
class="w-5 h-5 inline-block sm:mr-2 flex-shrink-0"

2
src/routes/watchlist/stocks/+page.svelte
View File

@ -1191,7 +1191,7 @@
</div>
<div
class="w-full m-auto border-b border-slate-800 mt-16 mb-16"
class="w-full m-auto border-b border-gray-600 mt-16 mb-16"
></div>
<h2