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

ui fix

Browse Source
This commit is contained in:
MuslemRahimi 2024-08-11 12:28:33 +02:00
parent 5bedb41e9b
commit ac23d85a42
9 changed files with 86 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -42,7 +42,7 @@
onMount(() => {
rawData = data?.getCramerTracker ?? [];
rawData = data?.getCorporateLobbyingTracker ?? [];
displayList = rawData?.slice(0,50) ?? []
isLoaded = true;
})

8
src/routes/corporate-lobbying-tracker/+page.ts
View File

@ -4,10 +4,10 @@ import {getCache, setCache } from '$lib/store';
export const load = async ({parent}) => {
const getCramerTracker = async () => {
const getCorporateLobbyingTracker = async () => {
let output;
const cachedData = getCache('', 'getCramerTracker');
const cachedData = getCache('', 'getCorporateLobbyingTracker');
if (cachedData) {
output = cachedData;
} else {
@ -23,7 +23,7 @@ export const load = async ({parent}) => {
output = await response.json();
setCache('', output, 'getCramerTracker');
setCache('', output, 'getCorporateLobbyingTracker');
}
@ -34,6 +34,6 @@ export const load = async ({parent}) => {
// Make sure to return a promise
return {
getCramerTracker: await getCramerTracker()
getCorporateLobbyingTracker: await getCorporateLobbyingTracker()
};
};

24
src/routes/cramer-tracker/+page.svelte
View File

@ -30,7 +30,7 @@
onMount(() => {
rawData = data?.getCramerTracker ?? [];
displayList = rawData?.slice(0,20) ?? []
displayList = rawData?.slice(0,50) ?? []
isLoaded = true;
})
@ -73,22 +73,22 @@
<section class="w-full max-w-4xl overflow-hidden m-auto min-h-screen pt-5 pb-40">
<section class="w-full max-w-3xl sm:max-w-screen-xl overflow-hidden min-h-screen pt-5 pb-40">
<div class="text-sm breadcrumbs ml-4">
<div class="text-sm sm:text-[1rem] breadcrumbs ml-4">
<ul>
<li><a href="/" class="text-gray-300">Home</a></li>
<li class="text-gray-300">Jim Cramer Tracker</li>
</ul>
</div>
<div class="w-full max-w-4xl overflow-hidden m-auto mt-5">
<div class="w-full overflow-hidden m-auto mt-5">
<div class="sm:p-0 flex justify-center w-full m-auto overflow-hidden max-w-4xl">
<div class="sm:p-0 flex justify-center w-full m-auto overflow-hidden ">
<div class="relative flex justify-center items-center overflow-hidden w-full">
<main class="w-full">
<div class="w-full max-w-4xl m-auto sm:bg-[#27272A] sm:rounded-xl h-auto pl-10 pr-10 pt-5 sm:pb-10 sm:pt-10 mt-3 mb-8">
<div class="w-full m-auto sm:bg-[#27272A] sm:rounded-xl h-auto pl-10 pr-10 pt-5 sm:pb-10 sm:pt-10 mt-3 mb-8">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-10">
<!-- Start Column -->
@ -146,22 +146,22 @@
<table class="table table-sm table-compact no-scrollbar rounded-none sm:rounded-md w-full bg-[#09090B] border-bg-[#09090B] m-auto">
<thead>
<tr class="bg-[#09090B]">
<th class="text-start bg-[#09090B] text-white text-sm font-semibold">
<th class="text-start bg-[#09090B] text-white text-[1rem] font-semibold">
Symbol
</th>
<th class="hidden sm:table-cell text-start bg-[#09090B] text-white text-sm font-semibold">
<th class="hidden sm:table-cell text-start bg-[#09090B] text-white text-[1rem] font-semibold">
Name
</th>
<th class="text-start bg-[#09090B] text-white text-sm font-semibold">
<th class="text-start bg-[#09090B] text-white text-[1rem] font-semibold">
Date
</th>
<th class="text-center bg-[#09090B] text-white text-sm font-semibold">
<th class="text-center bg-[#09090B] text-white text-[1rem] font-semibold">
Sentiment
</th>
<th class="text-end bg-[#09090B] text-white text-sm font-semibold">
<th class="text-end bg-[#09090B] text-white text-[1rem] font-semibold">
Return Since
</th>
<th class="text-end bg-[#09090B] text-white text-sm font-semibold">
<th class="text-end bg-[#09090B] text-white text-[1rem] font-semibold">
Sector
</th>
</tr>

5
src/routes/hedge-funds/+page.svelte
View File

@ -131,7 +131,8 @@ async function handleInput(event) {
<section class="w-full max-w-6xl overflow-hidden m-auto min-h-screen pt-5 pb-60">
<section class="w-full max-w-3xl sm:max-w-screen-xl overflow-hidden min-h-screen pt-5 pb-40">
<body class="w-full max-w-6xl overflow-hidden m-auto">
@ -147,7 +148,7 @@ async function handleInput(event) {
{#if isLoaded}
<section class="w-full max-w-6xl overflow-hidden m-auto sm:mt-10 px-0 sm:px-3 mt-10">
<section class="w-full overflow-hidden m-auto sm:mt-10 px-0 sm:px-3 mt-10">
<div class="p-3 sm:p-0 flex justify-center w-full m-auto overflow-hidden">
<div class="relative flex justify-center items-center overflow-hidden w-full">

76
src/routes/hedge-funds/[slug]/+page.svelte
View File

@ -3,7 +3,6 @@
import { screenWidth, numberOfUnreadNotification, displayCompanyName } from '$lib/store';
import cardBackground from "$lib/images/bg-hedge-funds.png";
import defaultAvatar from "$lib/images/hedge_funds/default-avatar.png";
import UpgradeToPro from '$lib/components/UpgradeToPro.svelte';
import { Motion, AnimateSharedLayout } from "svelte-motion";
@ -30,7 +29,6 @@ use([LineChart, GridComponent, CanvasRenderer])
const itemsPerPage = 50;
let images = {};
let deactivateContent = data?.user?.tier === 'Pro' ? false : true;
let numOfAssets;
let changeAssetType = 'Stocks'
@ -203,7 +201,7 @@ function getYearFromDate(dateString) {
silent: true,
grid: {
left: $screenWidth < 640 ? '0.5%' : '0.5%',
right: $screenWidth < 640 ? '1%' : '0.5%',
right: $screenWidth < 640 ? '1%' : '5%',
bottom: '0%',
containLabel: true
},
@ -332,19 +330,21 @@ function tabFunction(state) {
<section class="w-full max-w-6xl overflow-hidden m-auto min-h-screen pt-5 pb-60">
<section class="w-full max-w-3xl sm:max-w-screen-xl overflow-hidden min-h-screen pt-5 pb-40">
<div class="text-sm breadcrumbs ml-4 sm:ml-1 pb-10">
<ul>
<li><a href="/" class="text-gray-300">Home</a></li>
<li><a href="/hedge-funds" class="text-gray-300">Hedge Funds</a></li>
<li class="text-gray-300">Company Data</li>
</ul>
</div>
<div class="w-full overflow-hidden m-auto px-3 sm:px-0">
<div class="sm:ml-10 w-full overflow-hidden m-auto px-3 sm:px-0">
<div class="text-sm sm:text-[1rem] breadcrumbs pb-10">
<ul>
<li><a href="/" class="text-gray-300">Home</a></li>
<li><a href="/hedge-funds" class="text-gray-300">Hedge Funds</a></li>
<li class="text-gray-300">Company Data</li>
</ul>
</div>
<div class="flex justify-center w-full m-auto overflow-hidden">
<div class="relative flex flex-col sm:flex-row justify-between items-start overflow-hidden w-full">
@ -352,8 +352,8 @@ function tabFunction(state) {
<!--Start Card-->
<div class="w-full bg-[#141417] border border-gray-800 rounded-lg h-auto pb-4">
<div class="flex flex-col relative ">
<img class="absolute w-full m-auto rounded-lg " src={cardBackground} />
<div class="flex flex-col justify-center items-center rounded-2xl ">
<img class="absolute w-full m-auto rounded-lg" src={cardBackground} />
<div class="flex flex-col justify-center items-center rounded-lg ">
<div class="mt-10 rounded-full border border-slate-600 w-24 h-24 relative hedge-fund-striped bg-[#20202E] flex items-center justify-center">
<img style="clip-path: circle(50%);" class="rounded-full w-20" src={images[rawData?.cik] ?? defaultAvatar} loading="lazy"/>
@ -409,7 +409,7 @@ function tabFunction(state) {
<div class="w-full mt-5 mb-10 m-auto flex justify-center items-center ">
<div class="sm:hidden w-full grid grid-cols-2 gap-y-3 lg:gap-y-3 gap-x-3 ">
<!--Start Total Amount Traded-->
<div class="flex flex-row items-center flex-wrap w-full px-3 sm:px-5 bg-[#262626] rounded-2xl h-20">
<div class="flex flex-row items-center flex-wrap w-full px-3 sm:px-5 bg-[#262626] rounded-lg h-20">
<div class="flex flex-col items-start">
<span class="font-medium text-gray-200 text-sm ">AUM</span>
<span class="text-start text-[1rem] font-medium text-white mt-0.5">
@ -421,7 +421,7 @@ function tabFunction(state) {
<!--End Total Amount Traded-->
<!--Start-->
<div class="sm:hidden flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] rounded-2xl h-20">
<div class="sm:hidden flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] rounded-lg h-20">
<div class="flex flex-col items-start">
<span class="font-medium text-gray-200 text-sm sm:text-[0.85rem]">3 Year Perf.</span>
<span class="text-start text-[1rem] sm:text-sm font-semibold text-white mt-0.5">
@ -456,7 +456,7 @@ function tabFunction(state) {
<!--End-->
<!--Start-->
<div class="sm:hidden flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] rounded-2xl h-20">
<div class="sm:hidden flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] rounded-lg h-20">
<div class="flex flex-col items-start">
<span class="font-medium text-gray-200 text-sm sm:text-[0.85rem]">5 Year Perf.</span>
<span class="text-start text-[1rem] sm:text-sm font-semibold text-white mt-0.5">
@ -491,7 +491,7 @@ function tabFunction(state) {
<!--Start-->
<div class="sm:hidden flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] rounded-2xl h-20">
<div class="sm:hidden flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] rounded-lg h-20">
<div class="flex flex-col items-start">
<span class="font-medium text-gray-200 text-sm sm:text-[0.85rem]">Incept. Perf.</span>
<span class="text-start text-[1rem] sm:text-sm font-semibold text-white mt-0.5">
@ -530,7 +530,7 @@ function tabFunction(state) {
</aside>
<main class="w-full mt-10 sm:mt-0 sm:w-3/4 sm:ml-5">
<main class="w-full mt-10 sm:mt-0 sm:ml-5">
{#if isLoaded && Object?.keys(optionsData)?.length !== 0}
<div class="p-0 sm:p-10 bg-[#09090B] sm:bg-[#09090B] rounded-lg sm:min-h-[330px] mb-10 sm:mb-6">
@ -570,10 +570,10 @@ function tabFunction(state) {
<!--Start Widget-->
<div class="hidden sm:flex justify-center items-center w-full mt-5 mb-10 m-auto">
<div class="w-full grid grid-cols-4 gap-y-3 lg:gap-y-3 gap-x-3 ">
<div class="hidden sm:flex justify-center items-center w-full sm:w-11/12 mt-5 mb-10">
<div class="w-full grid grid-cols-4 gap-y-3 lg:gap-y-3 gap-x-3">
<!--Start Total Amount Traded-->
<div class="flex flex-row items-center flex-wrap w-full px-3 sm:px-5 bg-[#262626] rounded-2xl h-20">
<div class="flex flex-row items-center flex-wrap w-full px-3 sm:px-5 bg-[#262626] rounded-lg h-20">
<div class="flex flex-col items-start">
<span class="font-medium text-gray-200 text-[1rem]">AUM</span>
<span class="text-start text-[1rem] font-medium text-white mt-0.5">
@ -585,7 +585,7 @@ function tabFunction(state) {
<!--End Total Amount Traded-->
<!--Start-->
<div class="flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] rounded-2xl h-20">
<div class="flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] rounded-lg h-20">
<div class="flex flex-col items-start">
<span class="font-medium text-gray-200 text-[1rem]">3 Year Perf.</span>
<span class="text-start text-[1rem] font-semibold text-white mt-0.5">
@ -611,7 +611,7 @@ function tabFunction(state) {
<!--End-->
<!--Start-->
<div class="flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] rounded-2xl h-20">
<div class="flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] rounded-lg h-20">
<div class="flex flex-col items-start">
<span class="font-medium text-gray-200 text-[1rem]">5 Year Perf.</span>
<span class="text-start text-[1rem] font-semibold text-white mt-0.5">
@ -638,7 +638,7 @@ function tabFunction(state) {
<!--Start-->
<div class="flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] rounded-2xl h-20">
<div class="flex flex-row items-center flex-wrap w-full px-3 sm:px-4 bg-[#262626] rounded-lg h-20">
<div class="flex flex-col items-start">
<span class="font-medium text-gray-200 text-[1rem]">Incept. Perf.</span>
<span class="text-start text-[1rem] font-semibold text-white mt-0.5">
@ -667,8 +667,8 @@ function tabFunction(state) {
</div>
</div>
<div class="p-3 sm:p-5 bg-[#09090B] sm:bg-[#09090B] border border-gray-800 rounded-lg sm:min-h-[430px] pt-6">
<div class="h-auto w-full ">
<div class="sm:p-3 bg-[#09090B] sm:bg-[#09090B] sm:min-h-[430px] pt-6">
<div class="h-auto w-full sm:w-11/12 ">
<span class="text-[#F5F5F5] font-bold text-2xl">
@ -755,7 +755,7 @@ function tabFunction(state) {
</tr>
</thead>
<tbody class="p-0">
{#each deactivateContent ? displayList?.slice(0,5) : displayList as item}
{#each displayList as item}
<tr on:click={() => goto(`/${item?.type}/${item?.symbol}`)} class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-[#27272A] border-b-[#27272A] cursor-pointer">
<td class="text-gray-200 pb-3 border-b border-b-[#27272A]">
@ -801,11 +801,7 @@ function tabFunction(state) {
</table>
</div>
<div class="hidden sm:block">
<UpgradeToPro data={data} color={'#313131'} title="Get the recent transactions from Hedge Funds to never miss out"/>
</div>
{#if !deactivateContent}
<div class="hidden sm:flex flex-col items-center mt-10">
<!-- Help text -->
<span class="text-sm text-gray-200">
@ -821,7 +817,6 @@ function tabFunction(state) {
</button>
</div>
</div>
{/if}
@ -866,15 +861,15 @@ function tabFunction(state) {
</tr>
</thead>
<tbody>
{#each deactivateContent ? displayList?.slice(0,5) : displayList as item,index}
{#each displayList as item,index}
<!-- row -->
<tr on:click={() => goto(`/${item?.type}/${item?.ticker}`)} class="bg-[#09090B] cursor-pointer">
<tr on:click={() => goto(`/${item?.type}/${item?.ticker}`)} class="odd:bg-[#27272A] cursor-pointer">
<td class="text-gray-200 border-b border-b-[#09090B]">
<td class="text-gray-200 border-b border-b-[#09090B] whitespace-nowrap">
<div class="flex flex-row items-center">
<div class="flex flex-col">
<span class="text-blue-400 font-medium">{item?.symbol?.replace('_',' ')}</span>
<span class="text-white text-opacity-60 text-xs">{item?.securityName?.length > charNumber ? formatString(item?.securityName?.slice(0,charNumber)) + '...' : formatString(item?.securityName)}</span>
<span class="text-white text-xs">{item?.securityName?.length > charNumber ? formatString(item?.securityName?.slice(0,charNumber)) + '...' : formatString(item?.securityName)}</span>
</div>
</div>
<!--{item?.firstName} {item?.lastName}-->
@ -917,9 +912,7 @@ function tabFunction(state) {
</table>
</div>
<UpgradeToPro data={data} title="Get the recent transactions from Hedge Funds to never miss out"/>
{#if !deactivateContent}
<div class="sm:hidden flex flex-col items-center mt-10">
<!-- Help text -->
<span class="text-[1rem] text-gray-200">
@ -935,11 +928,10 @@ function tabFunction(state) {
</button>
</div>
</div>
{/if}
</div>
</div>

36
src/routes/most-retail-volume/+page.svelte
View File

@ -73,22 +73,22 @@
<section class="w-full max-w-4xl overflow-hidden m-auto min-h-screen pt-5 pb-40">
<section class="w-full max-w-3xl sm:max-w-screen-xl overflow-hidden min-h-screen pt-5 pb-40">
<div class="text-sm breadcrumbs ml-4">
<div class="text-sm sm:text-[1rem] breadcrumbs ml-4">
<ul>
<li><a href="/" class="text-gray-300">Home</a></li>
<li class="text-gray-300">Retail Trader Volume</li>
</ul>
</div>
<div class="w-full max-w-4xl overflow-hidden m-auto mt-5">
<div class="w-full overflow-hidden m-auto mt-5">
<div class="sm:p-0 flex justify-center w-full m-auto overflow-hidden max-w-4xl">
<div class="sm:p-0 flex justify-center w-full m-auto overflow-hidden ">
<div class="relative flex justify-center items-center overflow-hidden w-full">
<main class="w-full">
<div class="w-full max-w-4xl m-auto sm:bg-[#27272A] sm:rounded-xl h-auto pl-10 pr-10 pt-5 sm:pb-10 sm:pt-10 mt-3 mb-8">
<div class="w-full m-auto sm:bg-[#27272A] sm:rounded-xl h-auto pl-10 pr-10 pt-5 sm:pb-10 sm:pt-10 mt-3 mb-8">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-10">
<!-- Start Column -->
@ -137,7 +137,7 @@
{#if isLoaded}
<div class="w-full max-w-4xl text-center sm:text-start sm:flex sm:flex-row sm:items-center m-auto text-gray-100 border border-gray-800 sm:rounded-lg h-auto p-5 ">
<div class="w-full text-center sm:text-start sm:flex sm:flex-row sm:items-center m-auto text-gray-100 border border-gray-800 sm:rounded-lg h-auto p-5 ">
<svg class="w-5 h-5 inline-block sm:mr-2 flex-shrink-0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><path fill="#a474f6" 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>
We update on a daily basis where retail investor are trading the most to never miss out the next hype.
Daily sentiments can either be bullish (strong buying of retail investors) or bearish (more selling) for each stock.
@ -150,24 +150,24 @@
<table class="table table-sm table-compact rounded-none sm:rounded-md w-full bg-[#09090B] border-bg-[#09090B] m-auto">
<thead>
<tr class="bg-[#09090B]">
<th class="text-end bg-[#09090B] text-white text-sm font-semibold">
<th class="text-end bg-[#09090B] text-white text-[1rem] font-semibold">
#
</th>
<th class="text-start bg-[#09090B] text-white text-sm font-semibold">
<th class="text-start bg-[#09090B] text-white text-[1rem] font-semibold">
Symbol
</th>
<th class="hidden sm:table-cell text-start bg-[#09090B] text-white text-sm font-semibold">
<th class="hidden sm:table-cell text-start bg-[#09090B] text-white text-[1rem] font-semibold">
Name
</th>
<th class="text-center bg-[#09090B] text-white text-sm font-semibold">
<th class="text-center bg-[#09090B] text-white text-[1rem] font-semibold">
Daily Traded
</th>
<th class="text-end bg-[#09090B] text-white text-sm font-semibold">
<th class="text-end bg-[#09090B] text-white text-[1rem] font-semibold">
Volume in %
</th>
<th class="text-end bg-[#09090B] text-white text-sm font-semibold">
<th class="text-end bg-[#09090B] text-white text-[1rem] font-semibold">
Sentiment
</th>
</tr>
@ -176,11 +176,11 @@
{#each stockList as item, index}
<tr on:click={() => goto(`/${item?.assetType}/${item?.symbol}`)} class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-[#27272A] {index+1 === stockList?.length && data?.user?.tier !== 'Pro' ? 'opacity-[0.1]' : ''} cursor-pointer">
<td class="text-white text-sm font-medium text-white text-end">
<td class="text-white text-sm sm:text-[1rem] font-medium text-white text-end">
{index+1}
</td>
<td class="text-sm text-start">
<td class="text-sm sm:text-[1rem] text-start">
<div class="flex flex-col items-start w-32 sm:w-fit">
<span class="text-blue-400">{item?.symbol}</span>
<span class="text-white sm:hidden">
@ -189,20 +189,20 @@
</div>
</td>
<td class="hidden sm:table-cell text-white text-sm text-white text-start">
<td class="hidden sm:table-cell text-white text-sm sm:text-[1rem] text-white text-start">
{item?.name?.length > charNumber ? item?.name?.slice(0,charNumber) + "..." : item?.name}
</td>
<td class="text-center text-sm font-medium text-white">
<td class="text-center text-sm sm:text-[1rem] font-medium text-white">
{abbreviateNumber(item?.traded,true)}
</td>
<td class="text-end text-sm font-medium text-white">
<td class="text-end text-sm sm:text-[1rem] font-medium text-white">
{item?.retailStrength}%
</td>
<td class="text-end text-sm font-medium {item?.sentiment > 0 ? 'text-[#10DB06]' : item?.sentiment < 0 ? 'text-[#E57C34]' : 'text-[#C6A755]'}">
<td class="text-end text-sm sm:text-[1rem] font-medium {item?.sentiment > 0 ? 'text-[#10DB06]' : item?.sentiment < 0 ? 'text-[#E57C34]' : 'text-[#C6A755]'}">
{item?.sentiment > 0 ? 'Bullish' : item?.sentiment < 0 ? 'Bearish' : 'Mixed'}
</td>

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

@ -488,16 +488,16 @@ $: {
</svelte:head>
<body class="sm:fixed h-screen m-auto w-full max-w-screen">
<body class="sm:fixed h-screen w-full max-w-screen-xl">
<section class="w-full max-w-screen sm:max-w-6xl flex justify-center items-center m-auto pt-5 bg-[#09090B] ">
<section class="w-full max-w-screen sm:max-w-6xl xl:max-w-7xl flex justify-center items-center pt-5 bg-[#09090B] ">
<div class="w-full m-auto mb-10 pl-3 pr-3">
<div class="text-sm sm:text-lg breadcrumbs mb-5">
<div class="text-sm sm:text-[1rem] breadcrumbs mb-5">
<ul>
<li><a href="/" class="text-gray-300">Home</a></li>
<li class="text-gray-300">Options Flow</li>
@ -505,7 +505,7 @@ $: {
</div>
{#if !$isOpen}
<div class="text-white text-sm sm:text-lg sm:text-md italic text-center sm:text-start w-full ml-2 mb-3">
<div class="text-white text-sm sm:text-[1rem] italic text-center sm:text-start w-full ml-2 mb-3">
Live flow of {new Date(rawData?.at(0)?.date ?? null)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })} (NYSE Time)
</div>
{/if}
@ -784,7 +784,7 @@ $: {
<!-- Content area -->
<div class="mt-4 w-full overflow-x-auto overflow-y-auto h-[850px] rounded-lg">
<div class="mt-4 w-full overflow-x-auto overflow-y-auto h-[850px] ">
<div class="table-container">
<div class="table">
<VirtualList

11
src/routes/options-zero-dte/+page.svelte
View File

@ -451,13 +451,14 @@ $: {
</svelte:head>
<body class="sm:fixed h-screen m-auto w-full max-w-screen">
<section class="w-full max-w-screen sm:max-w-6xl flex justify-center items-center m-auto pt-5 bg-[#09090B] ">
<body class="sm:fixed h-screen w-full max-w-screen-xl">
<section class="w-full max-w-screen sm:max-w-6xl xl:max-w-7xl flex justify-center items-center pt-5 bg-[#09090B] ">
<div class="w-full m-auto mb-10 pl-3 pr-3">
<div class="text-sm breadcrumbs mb-5">
<div class="text-sm sm:text-[1rem] breadcrumbs mb-5">
<ul>
<li><a href="/" class="text-gray-300">Home</a></li>
<li class="text-gray-300">Options 0DTE Flow</li>
@ -465,7 +466,7 @@ $: {
</div>
{#if !$isOpen}
<div class="text-white text-sm sm:text-md italic text-center sm:text-start w-full ml-2 mb-3">
<div class="text-white text-sm sm:text-[1rem] italic text-center sm:text-start w-full ml-2 mb-3">
Live flow of {new Date(rawData?.at(0)?.date ?? null)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })} (NYSE Time)
</div>
{/if}
@ -737,7 +738,7 @@ $: {
<!-- Page wrapper -->
<div class="flex justify-center w-full m-auto h-full overflow-hidden">
<!-- Content area -->
<div class="mt-4 w-full overflow-x-auto overflow-y-auto h-[850px] rounded-lg">
<div class="mt-4 w-full overflow-x-auto overflow-y-auto h-[850px]">
<div class="table-container">
<div class="table">
<VirtualList

6
src/routes/reddit-tracker/+page.svelte
View File

@ -299,9 +299,9 @@ const optionCompanySpread = {
<svelte:options immutable = {true} />
<section class="w-full max-w-screen overflow-hidden m-auto min-h-screen bg-[#09090B] pb-40">
<section class="w-full max-w-3xl sm:max-w-screen-xl overflow-hidden min-h-screenpb-40">
<div class="flex flex-col w-full max-w-6xl 3xl:max-w-7xl m-auto justify-center items-center">
<div class="flex flex-col w-full m-auto justify-center items-center">
<div class="text-center mb-10 w-full px-4 3xl:px-10 mt-10 3xl:ml-20">
<div class="flex flex-col items-start mb-10">
@ -454,7 +454,7 @@ const optionCompanySpread = {
</Card.Content>
</Card.Root>
</Lazy>
<Card.Root class="order-0 overflow-x-scroll no-scrollbar h-[500px]">
<Card.Root class="order-0 overflow-x-scroll no-scrollbar sm:h-[500px]">
<Card.Header>
<Card.Title class="text-start text-xl w-full flex flex-row items-center">
<span>