This commit is contained in:
MuslemRahimi 2024-12-25 20:04:44 +01:00
parent 9654c9aa58
commit 3d8c3d43be
5 changed files with 43 additions and 38 deletions

View File

@ -159,9 +159,7 @@
type: "line", type: "line",
smooth: true, smooth: true,
showSymbol: false, showSymbol: false,
areaStyle: {
color: "rgba(255, 255, 255, 0.08)",
},
lineStyle: { lineStyle: {
color: "#fff", color: "#fff",
width: 1, width: 1,

View File

@ -241,11 +241,14 @@
itemCount={displayedData.length} itemCount={displayedData.length}
itemSize={40} itemSize={40}
> >
<div slot="header" class="tr th sticky z-40 top-0"> <div
slot="header"
class="tr th sticky z-40 top-0 border-b border-gray-800 shadow-xl"
>
<!-- Table headers --> <!-- Table headers -->
<div <div
on:click={() => sortData("time")} on:click={() => sortData("time")}
class="td cursor-pointer select-none bg-[#1E222D] text-slate-300 font-bold text-xs text-start uppercase" class="td cursor-pointer select-none bg-[#17171D] text-slate-300 font-bold text-xs text-start uppercase"
> >
Time Time
<svg <svg
@ -265,7 +268,7 @@
</div> </div>
<div <div
on:click={() => sortData("ticker")} on:click={() => sortData("ticker")}
class="td cursor-pointer select-none bg-[#1E222D] font-bold text-slate-300 text-xs text-start uppercase" class="td cursor-pointer select-none bg-[#17171D] font-bold text-slate-300 text-xs text-start uppercase"
> >
Symbol Symbol
<svg <svg
@ -286,13 +289,13 @@
> >
</div> </div>
<div <div
class="td select-none bg-[#1E222D] text-slate-300 font-bold text-xs text-start uppercase" class="td select-none bg-[#17171D] text-slate-300 font-bold text-xs text-start uppercase"
> >
Save Save
</div> </div>
<div <div
on:click={() => sortData("expiry")} on:click={() => sortData("expiry")}
class="td cursor-pointer select-none bg-[#1E222D] text-slate-300 font-bold text-xs text-start uppercase" class="td cursor-pointer select-none bg-[#17171D] text-slate-300 font-bold text-xs text-start uppercase"
> >
Expiry Expiry
<svg <svg
@ -314,7 +317,7 @@
</div> </div>
<div <div
on:click={() => sortData("dte")} on:click={() => sortData("dte")}
class="td cursor-pointer select-none bg-[#1E222D] text-slate-300 font-bold text-xs text-start uppercase" class="td cursor-pointer select-none bg-[#17171D] text-slate-300 font-bold text-xs text-start uppercase"
> >
DTE DTE
<svg <svg
@ -336,7 +339,7 @@
</div> </div>
<div <div
on:click={() => sortData("strike")} on:click={() => sortData("strike")}
class="td cursor-pointer select-none bg-[#1E222D] text-slate-300 font-bold text-xs text-start uppercase" class="td cursor-pointer select-none bg-[#17171D] text-slate-300 font-bold text-xs text-start uppercase"
> >
Strike Strike
<svg <svg
@ -358,7 +361,7 @@
</div> </div>
<div <div
on:click={() => sortData("callPut")} on:click={() => sortData("callPut")}
class="td cursor-pointer select-none bg-[#1E222D] text-slate-300 font-bold text-xs text-start uppercase" class="td cursor-pointer select-none bg-[#17171D] text-slate-300 font-bold text-xs text-start uppercase"
> >
C/P C/P
<svg <svg
@ -380,7 +383,7 @@
</div> </div>
<div <div
on:click={() => sortData("sentiment")} on:click={() => sortData("sentiment")}
class="td cursor-pointer select-none bg-[#1E222D] text-slate-300 font-bold text-xs text-start uppercase" class="td cursor-pointer select-none bg-[#17171D] text-slate-300 font-bold text-xs text-start uppercase"
> >
Sent. Sent.
<svg <svg
@ -403,7 +406,7 @@
</div> </div>
<div <div
on:click={() => sortData("spot")} on:click={() => sortData("spot")}
class="td cursor-pointer select-none bg-[#1E222D] text-slate-300 font-bold text-xs text-start uppercase" class="td cursor-pointer select-none bg-[#17171D] text-slate-300 font-bold text-xs text-start uppercase"
> >
Spot Spot
<svg <svg
@ -425,7 +428,7 @@
</div> </div>
<div <div
on:click={() => sortData("price")} on:click={() => sortData("price")}
class="td cursor-pointer select-none bg-[#1E222D] text-slate-300 font-bold text-xs text-start uppercase" class="td cursor-pointer select-none bg-[#17171D] text-slate-300 font-bold text-xs text-start uppercase"
> >
Price Price
<svg <svg
@ -447,7 +450,7 @@
</div> </div>
<div <div
on:click={() => sortData("premium")} on:click={() => sortData("premium")}
class="td cursor-pointer select-none bg-[#1E222D] text-slate-300 font-bold text-xs text-start uppercase" class="td cursor-pointer select-none bg-[#17171D] text-slate-300 font-bold text-xs text-start uppercase"
> >
Prem Prem
<svg <svg
@ -469,7 +472,7 @@
</div> </div>
<div <div
on:click={() => sortData("type")} on:click={() => sortData("type")}
class="td cursor-pointer select-none bg-[#1E222D] text-slate-300 font-bold text-xs text-start uppercase" class="td cursor-pointer select-none bg-[#17171D] text-slate-300 font-bold text-xs text-start uppercase"
> >
Type Type
<svg <svg
@ -491,7 +494,7 @@
</div> </div>
<div <div
on:click={() => sortData("exec")} on:click={() => sortData("exec")}
class="td cursor-pointer select-none bg-[#1E222D] text-slate-300 font-bold text-xs text-start uppercase" class="td cursor-pointer select-none bg-[#17171D] text-slate-300 font-bold text-xs text-start uppercase"
> >
Exec Exec
<svg <svg
@ -513,7 +516,7 @@
</div> </div>
<div <div
on:click={() => sortData("size")} on:click={() => sortData("size")}
class="td cursor-pointer select-none bg-[#1E222D] text-slate-300 font-bold text-xs text-start uppercase" class="td cursor-pointer select-none bg-[#17171D] text-slate-300 font-bold text-xs text-start uppercase"
> >
Size Size
<svg <svg
@ -535,7 +538,7 @@
</div> </div>
<div <div
on:click={() => sortData("vol")} on:click={() => sortData("vol")}
class="td cursor-pointer select-none bg-[#1E222D] text-slate-300 font-bold text-xs text-start uppercase" class="td cursor-pointer select-none bg-[#17171D] text-slate-300 font-bold text-xs text-start uppercase"
> >
Vol Vol
<svg <svg
@ -557,7 +560,7 @@
</div> </div>
<div <div
on:click={() => sortData("oi")} on:click={() => sortData("oi")}
class="td cursor-pointer select-none bg-[#1E222D] text-slate-300 font-bold text-xs text-start uppercase" class="td cursor-pointer select-none bg-[#17171D] text-slate-300 font-bold text-xs text-start uppercase"
> >
OI OI
<svg <svg
@ -584,7 +587,7 @@
let:index let:index
let:style let:style
{style} {style}
class="tr {index % 2 === 0 ? 'bg-secondary' : 'bg-[#09090B]'}" class="tr {index % 2 === 0 ? 'bg-odd' : 'bg-[#17171D]'}"
> >
<!-- Row data --> <!-- Row data -->
@ -690,13 +693,13 @@
<div <div
style="justify-content: center;" style="justify-content: center;"
class="td text-sm sm:text-[1rem] text-start font-semibold {displayedData[ class="td text-sm sm:text-[1rem] text-start text-white"
index
]?.put_call === 'Puts'
? 'text-[#CB281C]'
: 'text-[#0FB307]'}"
> >
{abbreviateNumber(displayedData[index]?.cost_basis)} {@html abbreviateNumber(
displayedData[index]?.cost_basis,
false,
true,
)}
</div> </div>
<div <div

View File

@ -885,7 +885,7 @@
</div> </div>
{/if} {/if}
<div class="rounded-md border border-gray-700 bg-[#1E222D] p-2"> <div class="rounded-md border border-gray-700 bg-odd p-2">
<div <div
class="flex flex-col sm:flex-row items-center pt-3 sm:pt-1 pb-3 sm:border-b sm:border-gray-600" class="flex flex-col sm:flex-row items-center pt-3 sm:pt-1 pb-3 sm:border-b sm:border-gray-600"
> >
@ -963,13 +963,13 @@
<div class="sm:ml-auto w-full sm:w-fit pt-5"> <div class="sm:ml-auto w-full sm:w-fit pt-5">
<div class="relative flex flex-col sm:flex-row items-center"> <div class="relative flex flex-col sm:flex-row items-center">
<div <div
class="relative w-full sm:w-fit pl-3 sm:mr-5 mb-4 sm:mb-0 flex-auto text-center bg-[#2A2E39] rounded-md border border-gray-600" class="relative w-full sm:w-fit pl-3 sm:mr-5 mb-4 sm:mb-0 flex-auto text-center bg-[#19191F] rounded-md border border-gray-600"
> >
<label class="flex flex-row items-center"> <label class="flex flex-row items-center">
<input <input
id="modal-search" id="modal-search"
type="search" type="search"
class="text-white sm:ml-2 text-[1rem] placeholder-gray-300 border-transparent focus:border-transparent focus:ring-0 flex items-center justify-center w-full px-0 py-1.5 bg-inherit" class="text-white sm:ml-2 text-[1rem] placeholder-gray-300 border-transparent focus:border-transparent focus:ring-0 flex items-center justify-center w-full px-0 py-1.5 bg-[inherit]"
placeholder="Stock or ETF symbol..." placeholder="Stock or ETF symbol..."
bind:value={filterQuery} bind:value={filterQuery}
on:input={debouncedHandleInput} on:input={debouncedHandleInput}
@ -1466,7 +1466,7 @@
<div class="w-full grid grid-cols-1 lg:grid-cols-4 gap-y-3 gap-x-3"> <div class="w-full grid grid-cols-1 lg:grid-cols-4 gap-y-3 gap-x-3">
<!--Start Flow Sentiment--> <!--Start Flow Sentiment-->
<div <div
class="flex flex-row items-center flex-wrap w-full px-5 bg-[#1E222D] shadow-lg rounded-md h-20" class="flex flex-row items-center flex-wrap w-full px-5 bg-odd border border-gray-600 rounded-md h-20"
> >
<div class="flex flex-col items-start"> <div class="flex flex-col items-start">
<span class="font-semibold text-gray-200 text-sm sm:text-[1rem]" <span class="font-semibold text-gray-200 text-sm sm:text-[1rem]"
@ -1487,7 +1487,7 @@
<!--End Flow Sentiment--> <!--End Flow Sentiment-->
<!--Start Put/Call--> <!--Start Put/Call-->
<div <div
class="flex flex-row items-center flex-wrap w-full px-5 bg-[#1E222D] shadow-lg rounded-md h-20" class="flex flex-row items-center flex-wrap w-full px-5 bg-odd border border-gray-600 rounded-md h-20"
> >
<div class="flex flex-col items-start"> <div class="flex flex-col items-start">
<span class="font-semibold text-gray-200 text-sm sm:text-[1rem]" <span class="font-semibold text-gray-200 text-sm sm:text-[1rem]"
@ -1543,7 +1543,7 @@
<!--End Put/Call--> <!--End Put/Call-->
<!--Start Call Flow--> <!--Start Call Flow-->
<div <div
class="flex flex-row items-center flex-wrap w-full px-5 bg-[#1E222D] shadow-lg rounded-md h-20" class="flex flex-row items-center flex-wrap w-full px-5 bg-odd border border-gray-600 rounded-md h-20"
> >
<div class="flex flex-col items-start"> <div class="flex flex-col items-start">
<span class="font-semibold text-gray-200 text-sm sm:text-[1rem]" <span class="font-semibold text-gray-200 text-sm sm:text-[1rem]"
@ -1600,7 +1600,7 @@
<!--End Call Flow--> <!--End Call Flow-->
<!--Start Put Flow--> <!--Start Put Flow-->
<div <div
class="flex flex-row items-center flex-wrap w-full px-5 bg-[#1E222D] shadow-lg rounded-md h-20" class="flex flex-row items-center flex-wrap w-full px-5 bg-odd border border-gray-600 rounded-md h-20"
> >
<div class="flex flex-col items-start"> <div class="flex flex-col items-start">
<span class="font-semibold text-gray-200 text-sm sm:text-[1rem]" <span class="font-semibold text-gray-200 text-sm sm:text-[1rem]"

View File

@ -136,7 +136,7 @@
<thead> <thead>
<tr class="bg-[#09090B] border-b border-[#27272A]"> <tr class="bg-[#09090B] border-b border-[#27272A]">
<th <th
class="bg-[#09090B] text-start bg-[#09090B] text-white text-sm font-medium sm:font-semibold" class=" text-start bg-[#09090B] text-white text-sm font-medium sm:font-semibold"
> >
Person Person
</th> </th>
@ -165,7 +165,7 @@
<tbody> <tbody>
{#each displayList as item, index} {#each displayList as item, index}
<tr <tr
class="odd:bg-odd border-b-[#09090B] {index + class="odd:bg-odd border-b border-gray-800 {index +
1 === 1 ===
rawData?.length && data?.user?.tier !== 'Pro' rawData?.length && data?.user?.tier !== 'Pro'
? 'opacity-[0.1]' ? 'opacity-[0.1]'
@ -174,7 +174,7 @@
<th <th
class="{index % 2 class="{index % 2
? 'bg-[#09090B]' ? 'bg-[#09090B]'
: 'bg-secondary'} text-white text-sm sm:text-[1rem] whitespace-nowrap" : 'bg-odd'} text-white text-sm sm:text-[1rem] whitespace-nowrap"
> >
<div class="flex flex-row items-center"> <div class="flex flex-row items-center">
<div <div

View File

@ -1545,7 +1545,11 @@
> >
{#if item?.[row?.rule] !== undefined && item?.[row?.rule] !== null} {#if item?.[row?.rule] !== undefined && item?.[row?.rule] !== null}
{#if row?.type === "int"} {#if row?.type === "int"}
{abbreviateNumber(item[row?.rule])} {@html abbreviateNumber(
item[row?.rule],
false,
true,
)}
{:else if row?.type === "str"} {:else if row?.type === "str"}
{item[row?.rule] !== null {item[row?.rule] !== null
? item[row?.rule] ? item[row?.rule]