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 2025-03-10 21:31:48 +01:00
parent 63fbc1bdbe
commit 184ac52059
19 changed files with 240 additions and 198 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/routes/analysts/+page.svelte
View File

@ -455,38 +455,42 @@
</main>
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
<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
href={"/analysts/top-stocks"}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Top Stocks Picks
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Get the latest top Wall Street analyst ratings.
</span>
</a>
</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
href={"/list/most-shorted-stocks"}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Top Shorted Stocks
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Never miss out another short squeeze
</span>
</a>

20
src/routes/corporate-lobbying-tracker/+page.svelte
View File

@ -263,38 +263,42 @@
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
<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
href={"/analysts"}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Top Analyst
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Get the latest top Wall Street analyst ratings
</span>
</a>
</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
href={"/politicians"}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Congress Trading
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Get the latest top Congress trading insights.
</span>
</a>

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

@ -783,17 +783,19 @@
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
<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
href="/earnings-calendar"
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Earnings Calendar
</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>
<span class="text-white p-3 ml-3 mr-3"
>Get the latest Earnings of companies</span
@ -802,17 +804,19 @@
</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
href="/dividends-calendar"
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Dividend Calendar
</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>
<span class="text-white p-3 ml-3 mr-3"
>Get the latest dividend announcement</span

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

@ -958,38 +958,42 @@
</main>
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
<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
href="/economic-calendar"
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Economic Events
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Stay updated on upcoming Economic Events worldwide.
</span>
</a>
</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
href="/earnings-calendar"
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Earnings Calendar
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Get the latest Earnings of companies.
</span>
</a>

10
src/routes/etf/[tickerID]/dark-pool/+layout.svelte
View File

@ -16,19 +16,21 @@
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
<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
href={`/dark-pool-flow?query=${$etfTicker}`}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Dark Pool Flow
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Follow the dark pool feed in realtime
</span>
</a>

22
src/routes/etf/[tickerID]/history/+page.svelte
View File

@ -520,19 +520,21 @@
</main>
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
<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
href="/stock-screener"
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Stock Screener
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Filter, sort and analyze all stocks to find your next
investment.
</span>
@ -540,19 +542,19 @@
</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
href="/watchlist/stocks"
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
Watchlist
</h2>
<ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
<h2 class="text-start text-xl font-semibold ml-3">Watchlist</h2>
<ArrowLogo
class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
/>
</div>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Keep track of your favorite stocks in real-time.
</span>
</a>

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

@ -145,38 +145,42 @@
: 'hidden lg:block'} relative fixed w-1/4 ml-4"
>
<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
href={`/options-flow?query=${$etfTicker}`}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Options Flow
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Get realtime options flow and customize your screener
</span>
</a>
</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
href={"/stock-screener"}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Stock Screener
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Build your Stock Screener to find profitable stocks.
</span>
</a>

36
src/routes/etf/etf-providers/+layout.svelte
View File

@ -1,7 +1,5 @@
<script lang="ts">
import { numberOfUnreadNotification } from "$lib/store";
import { page } from "$app/stores";
import logo from "$lib/images/provider_logo.png";
import { formatETFName } from "$lib/utils";
import ArrowLogo from "lucide-svelte/icons/move-up-right";
@ -26,12 +24,14 @@
>
<div class="text-sm sm:text-[1rem] breadcrumbs">
<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>
<a href="/etf/etf-providers" class="text-gray-300">ETF Providers</a>
<a href="/etf/etf-providers" class="text-muted dark:text-gray-300"
>ETF Providers</a
>
</li>
{#if currentPath?.length !== 0 && typeof currentPath !== undefined}
<li class="text-gray-300">{currentPath}</li>
<li class="text-muted dark:text-gray-300">{currentPath}</li>
{/if}
</ul>
</div>
@ -42,11 +42,9 @@
class="relative flex justify-center items-start overflow-hidden w-full"
>
<main class="w-full lg:w-3/4 lg:pr-5">
<h1 class=" text-white text-2xl sm:text-3xl font-bold">
ETF Providers
</h1>
<h1 class="text-2xl sm:text-3xl font-bold">ETF Providers</h1>
<div class="w-full m-auto mb-10 bg-default overflow-hidden">
<div class="w-full m-auto mb-10 overflow-hidden">
<div class="w-full flex flex-col justify-center items-center">
<slot />
</div>
@ -55,38 +53,42 @@
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
<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
href={"/analysts"}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Top Analyst
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Get the latest top Wall Street analyst ratings
</span>
</a>
</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
href={"/politicians"}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Congress Trading
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Get the latest top Congress trading insights.
</span>
</a>

22
src/routes/etf/etf-providers/+page.svelte
View File

@ -101,7 +101,7 @@
<div class="w-full">
<div class="w-full overflow-x-auto">
<table
class="table rounded-none sm:rounded-md w-full bg-table border border-gray-800 m-auto mt-4"
class="table table-sm table-compact no-scrollbar rounded-none sm:rounded-md w-full bg-white dark:bg-table border border-gray-300 dark:border-gray-800 m-auto mt-4"
>
<thead>
<TableHeader {columns} {sortOrders} {sortData} />
@ -110,7 +110,7 @@
{#each etfProviderList as item, index}
<!-- row -->
<tr
class="sm:hover:bg-[#245073]/10 odd:bg-odd border-b border-gray-800 {index +
class="dark:sm:hover:bg-[#245073]/10 odd:bg-[#F6F7F8] dark:odd:bg-odd {index +
1 ===
etfProviderList?.length &&
!['Pro', 'Plus']?.includes(data?.user?.tier)
@ -120,33 +120,25 @@
<td class="text-sm sm:text-[1rem] whitespace-nowrap">
<a
href={"/etf/etf-providers/" + item?.etfProvider}
class="sm:hover:underline sm:hover:underline-offset-4 text-white"
class="sm:hover:underline sm:hover:underline-offset-4"
>
{formatETFName(item?.etfProvider)}
</a>
</td>
<td
class="text-white text-sm sm:text-[1rem] whitespace-nowrap text-end"
>
<td class=" text-sm sm:text-[1rem] whitespace-nowrap text-end">
{abbreviateNumber(item?.totalAssets)}
</td>
<td
class="text-white text-sm sm:text-[1rem] whitespace-nowrap text-end"
>
<td class=" text-sm sm:text-[1rem] whitespace-nowrap text-end">
{item?.funds}
</td>
<td
class="text-white text-sm sm:text-[1rem] whitespace-nowrap text-end"
>
<td class=" text-sm sm:text-[1rem] whitespace-nowrap text-end">
{item?.avgExpenseRatio}%
</td>
<td
class="text-white text-sm sm:text-[1rem] whitespace-nowrap text-end"
>
<td class=" text-sm sm:text-[1rem] whitespace-nowrap text-end">
{item?.avgHoldings}
</td>
</tr>

34
src/routes/etf/etf-providers/[slug]/+page.svelte
View File

@ -1,6 +1,6 @@
<script lang="ts">
import { abbreviateNumber, formatETFName } from "$lib/utils";
import { screenWidth, numberOfUnreadNotification } from "$lib/store";
import { screenWidth } from "$lib/store";
import { onMount } from "svelte";
import Infobox from "$lib/components/Infobox.svelte";
import TableHeader from "$lib/components/Table/TableHeader.svelte";
@ -147,11 +147,11 @@
{/if}
<div
class="mb-4 flex flex-col divide-y divide-gray-300 dark:divide-gray-600 rounded-md border border-gray-300 dark:border-gray-600 sm:grid sm:grid-cols-3 sm:divide-x sm:divide-y-0"
class="shadow-sm mb-4 flex flex-col divide-y divide-gray-300 dark:divide-gray-600 rounded-md border border-gray-300 dark:border-gray-600 sm:grid sm:grid-cols-3 sm:divide-x sm:divide-y-0"
>
<div class="px-4 py-3 sm:px-2 sm:py-5 md:px-3 lg:p-6">
<div class="flex items-center justify-between sm:block">
<div class="text-[1rem] font-normal text-white">Listed Funds</div>
<div class="text-[1rem] font-normal">Listed Funds</div>
<div
class="mt-1 break-words font-semibold leading-8 text-xl sm:text-2xl"
>
@ -161,7 +161,7 @@
</div>
<div class="px-4 py-3 sm:px-2 sm:py-5 md:px-3 lg:p-6">
<div class="flex items-center justify-between sm:block">
<div class="text-[1rem] font-normal text-white">Total Assets</div>
<div class="text-[1rem] font-normal">Total Assets</div>
<div
class="mt-1 break-words font-semibold leading-8 text-xl sm:text-2xl"
>
@ -171,7 +171,7 @@
</div>
<div class="px-4 py-3 sm:px-2 sm:py-5 md:px-3 lg:p-6">
<div class="flex items-center justify-between sm:block">
<div class="text-[1rem] font-normal text-white">Average Cost</div>
<div class="text-[1rem] font-normal">Average Cost</div>
<div
class="mt-1 break-words font-semibold leading-8 text-xl sm:text-2xl"
>
@ -186,9 +186,9 @@
<div class="flex justify-center w-full m-auto h-full overflow-hidden">
<!-- Content area -->
<div class="w-full">
<div class="w-full overflow-x-auto mt-5">
<div class="w-full overflow-x-auto">
<table
class="table table-sm table-compact rounded-none sm:rounded-md w-full bg-table border border-gray-800"
class="table table-sm table-compact no-scrollbar rounded-none sm:rounded-md w-full bg-white dark:bg-table border border-gray-300 dark:border-gray-800 m-auto"
>
<thead>
<TableHeader {columns} {sortOrders} {sortData} />
@ -197,7 +197,7 @@
{#each etfProviderData as item, index}
<!-- row -->
<tr
class="sm:hover:bg-[#245073]/10 odd:bg-odd border-b border-gray-800 {index +
class="dark:sm:hover:bg-[#245073]/10 odd:bg-[#F6F7F8] dark:odd:bg-odd {index +
1 ===
etfProviderData?.length &&
!['Pro', 'Plus']?.includes(data?.user?.tier)
@ -208,31 +208,29 @@
<HoverStockChart symbol={item?.symbol} assetType={"etf"} />
</td>
<td
class="text-gray-200 text-sm sm:text-[1rem] whitespace-nowrap"
>
<td class="text-sm sm:text-[1rem] whitespace-nowrap">
{item?.name?.length > charNumber
? item?.name?.slice(0, charNumber) + "..."
: item?.name}
</td>
<td
class="text-white text-sm sm:text-[1rem] whitespace-nowrap border-b border-[#09090B] text-end"
class=" text-sm sm:text-[1rem] whitespace-nowrap text-end"
>
{item?.price}
</td>
<td
class="text-white text-sm sm:text-[1rem] whitespace-nowrap border-b border-[#09090B] text-end"
class=" text-sm sm:text-[1rem] whitespace-nowrap text-end"
>
{#if item?.changesPercentage >= 0}
<span class="text-[#00FC50]"
<span class="text-green-600 dark:text-[#00FC50]"
>+{item?.changesPercentage >= 1000
? abbreviateNumber(item?.changesPercentage)
: item?.changesPercentage?.toFixed(2)}%</span
>
{:else if item?.changesPercentage < 0}
<span class="text-[#FF2F1F]"
<span class="text-red-600 dark:text-[#FF2F1F]"
>{item?.changesPercentage <= -1000
? abbreviateNumber(item?.changesPercentage)
: item?.changesPercentage?.toFixed(2)}%
@ -243,19 +241,19 @@
</td>
<td
class="text-white text-end text-sm sm:text-[1rem] whitespace-nowrap"
class=" text-end text-sm sm:text-[1rem] whitespace-nowrap"
>
{abbreviateNumber(item?.totalAssets)}
</td>
<td
class="text-white text-end text-sm sm:text-[1rem] whitespace-nowrap"
class=" text-end text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.numberOfHoldings}
</td>
<td
class="text-white text-end text-sm sm:text-[1rem] whitespace-nowrap"
class=" text-end text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.expenseRatio}%
</td>

54
src/routes/etf/new-launches/+page.svelte
View File

@ -1,5 +1,5 @@
<script lang="ts">
import { numberOfUnreadNotification, screenWidth } from "$lib/store";
import { screenWidth } from "$lib/store";
import { abbreviateNumber } from "$lib/utils";
import ArrowLogo from "lucide-svelte/icons/move-up-right";
import TableHeader from "$lib/components/Table/TableHeader.svelte";
@ -96,8 +96,8 @@
>
<div class="text-sm sm:text-[1rem] breadcrumbs">
<ul>
<li><a href="/" class="text-gray-300">Home</a></li>
<li><a class="text-gray-300">New Launches of ETFs</a></li>
<li><a href="/" class="text-muted dark:text-gray-300">Home</a></li>
<li><a class="text-muted dark:text-gray-300">New Launches of ETFs</a></li>
</ul>
</div>
@ -108,15 +108,15 @@
>
<main class="w-full lg:w-3/4 lg:pr-5">
<div class="mb-6 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">
New Launches of ETFs
</h1>
</div>
<div class="w-full mt-5 m-auto mb-10 bg-default overflow-hidden">
<div class="w-full mt-5 m-auto mb-10 overflow-hidden">
<!--Start Top Winners/Losers-->
<div class="flex flex-col justify-center items-center">
<div class="text-start w-full text-white mb-2">
<div class="text-start w-full mb-2">
<span class="font-bold text-2xl">
{etfData?.length} ETFs
</span>
@ -124,7 +124,7 @@
<div class="w-full overflow-x-auto">
<table
class="mt-5 table table-compact rounded-none sm:rounded-md w-full bg-table border border-gray-800 m-auto overflow-hidden"
class="table table-sm table-compact no-scrollbar rounded-none sm:rounded-md w-full bg-white dark:bg-table border border-gray-300 dark:border-gray-800 m-auto"
>
<thead>
<TableHeader {columns} {sortOrders} {sortData} />
@ -132,11 +132,9 @@
<tbody>
{#each etfData as item}
<tr
class="sm:hover:bg-[#245073]/10 odd:bg-odd border-b-[#09090B]"
class="dark:sm:hover:bg-[#245073]/10 odd:bg-[#F6F7F8] dark:odd:bg-odd"
>
<td
class="text-white text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
>
<td class=" text-sm sm:text-[1rem] whitespace-nowrap">
{new Date(item?.inceptionDate)?.toLocaleString(
"en-US",
{
@ -148,27 +146,23 @@
)}
</td>
<td
class="text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
>
<td class="text-sm sm:text-[1rem] whitespace-nowrap">
<a
href={"/etf/" + item?.symbol}
class="sm:hover:text-white text-blue-400"
class="text-blue-500 sm:hover:text-muted dark:sm:hover:text-white dark:text-blue-400"
>
{item?.symbol}
</a>
</td>
<td
class="text-white text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
>
<td class=" text-sm sm:text-[1rem] whitespace-nowrap">
{item?.name?.length > charNumber
? item?.name?.slice(0, charNumber) + "..."
: item?.name}
</td>
<td
class="text-white text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B] text-end"
class=" text-sm sm:text-[1rem] whitespace-nowrap text-end"
>
{item?.numberOfHoldings !== null &&
item?.numberOfHoldings !== 0
@ -177,7 +171,7 @@
</td>
<td
class="text-white text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B] text-end"
class=" text-sm sm:text-[1rem] whitespace-nowrap text-end"
>
{item?.totalAssets !== 0 && item?.totalAssets !== null
? abbreviateNumber(item?.totalAssets)
@ -194,38 +188,42 @@
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
<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
href={"/analysts"}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Top Analyst
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class=" p-3 ml-3 mr-3">
Get the latest top Wall Street analyst ratings
</span>
</a>
</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
href={"/politicians"}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Congress Trading
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class=" p-3 ml-3 mr-3">
Get the latest top Congress trading insights.
</span>
</a>

22
src/routes/index/[tickerID]/history/+page.svelte
View File

@ -518,19 +518,21 @@
</main>
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
<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
href="/stock-screener"
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Stock Screener
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Filter, sort and analyze all stocks to find your next
investment.
</span>
@ -538,19 +540,19 @@
</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
href="/watchlist/stocks"
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
Watchlist
</h2>
<ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
<h2 class="text-start text-xl font-semibold ml-3">Watchlist</h2>
<ArrowLogo
class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
/>
</div>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Keep track of your favorite stocks in real-time.
</span>
</a>

20
src/routes/index/[tickerID]/options/+layout.svelte
View File

@ -127,38 +127,42 @@
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
<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
href={`/options-flow?query=${$indexTicker}`}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Options Flow
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Get realtime options flow and customize your screener
</span>
</a>
</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
href={"/stock-screener"}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Stock Screener
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Build your Stock Screener to find profitable etf.
</span>
</a>

30
src/routes/politicians/flow-data/+page.svelte
View File

@ -259,19 +259,21 @@
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
{#if !["Pro", "Plus"]?.includes(data?.user?.tier)}
<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
href={"/pricing"}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Pro Subscription
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Upgrade now for unlimited access to all data and tools.
</span>
</a>
@ -279,38 +281,42 @@
{/if}
<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
href={"/analysts"}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Top Analyst
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Get the latest top Wall Street analyst ratings
</span>
</a>
</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
href={"/politicians"}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Congress Trading
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Get the latest top Congress trading insights.
</span>
</a>

20
src/routes/sentiment-tracker/+page.svelte
View File

@ -116,38 +116,42 @@
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
<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
href="/cramer-tracker"
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Cramer Tracker
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Follow Jim Cramer latest stock picks
</span>
</a>
</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
href="/reddit-tracker"
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Reddit Tracker
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Get the latest trends of r/Wallstreetbets
</span>
</a>

10
src/routes/stocks/[tickerID]/dark-pool/+layout.svelte
View File

@ -16,19 +16,21 @@
<aside class="hidden lg:block relative fixed w-1/4 mt-3">
<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
href={`/dark-pool-flow?query=${$stockTicker}`}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Dark Pool Flow
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Follow the dark pool feed in realtime
</span>
</a>

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

@ -502,19 +502,21 @@
</main>
<aside class="hidden lg:block relative fixed w-1/4 mt-3">
<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
href="/stock-screener"
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Stock Screener
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Filter, sort and analyze all stocks to find your next
investment.
</span>
@ -522,19 +524,19 @@
</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
href="/watchlist/stocks"
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
Watchlist
</h2>
<ArrowLogo class="w-8 h-8 mr-3 shrink-0" />
<h2 class="text-start text-xl font-semibold ml-3">Watchlist</h2>
<ArrowLogo
class="w-8 h-8 mr-3 shrink-0 text-gray-400 dark:text-white"
/>
</div>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Keep track of your favorite stocks in real-time.
</span>
</a>

20
src/routes/stocks/[tickerID]/metrics/[slug]/+layout.svelte
View File

@ -16,38 +16,42 @@
<aside class="hidden lg:block relative fixed w-1/4 mt-3">
<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
href={"/price-alert"}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Price Alert
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Customize your alerts to never miss out again
</span>
</a>
</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
href={"/stock-screener"}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Stock Screener
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Build your Stock Screener to find profitable stocks.
</span>
</a>

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

@ -147,38 +147,42 @@
: 'hidden lg:block'} relative fixed w-1/4 ml-4"
>
<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
href={`/options-flow?query=${$stockTicker}`}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Options Flow
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Get realtime options flow and customize your screener
</span>
</a>
</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
href={"/stock-screener"}
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
>
<div class="w-full flex justify-between items-center p-3 mt-3">
<h2 class="text-start text-xl font-semibold text-white ml-3">
<h2 class="text-start text-xl font-semibold ml-3">
Stock Screener
</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>
<span class="text-white p-3 ml-3 mr-3">
<span class="p-3 ml-3 mr-3">
Build your Stock Screener to find profitable stocks.
</span>
</a>