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

ui fix for tables

Browse Source
This commit is contained in:
MuslemRahimi 2025-03-03 17:21:52 +01:00
parent 23981d7458
commit bed2863560
2 changed files with 32 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/lib/components/Table/DarkPoolTable.svelte
View File

@ -132,13 +132,13 @@
> >
<div <div
on:click={() => sortData("date")} on:click={() => sortData("date")}
class="cursor-pointer p-2 text-center" class="cursor-pointer p-2 text-center select-none whitespace-nowrap"
> >
Date Date
</div> </div>
<div <div
on:click={() => sortData("ticker")} on:click={() => sortData("ticker")}
class="cursor-pointer p-2 text-center select-none" class="cursor-pointer p-2 text-center select-none whitespace-nowrap"
> >
Symbol Symbol
<svg <svg
@ -160,7 +160,7 @@
<div <div
on:click={() => sortData("price")} on:click={() => sortData("price")}
class="cursor-pointer p-2 text-center select-none" class="cursor-pointer p-2 text-center select-none whitespace-nowrap"
> >
Price Price
<svg <svg
@ -181,7 +181,7 @@
</div> </div>
<div <div
on:click={() => sortData("premium")} on:click={() => sortData("premium")}
class="cursor-pointer p-2 text-center select-none" class="cursor-pointer p-2 text-center select-none whitespace-nowrap"
> >
Premium Premium
<svg <svg
@ -202,7 +202,7 @@
</div> </div>
<div <div
on:click={() => sortData("size")} on:click={() => sortData("size")}
class="cursor-pointer p-2 text-center select-none" class="cursor-pointer p-2 text-center select-none whitespace-nowrap"
> >
Size Size
<svg <svg
@ -223,7 +223,7 @@
</div> </div>
<div <div
on:click={() => sortData("volume")} on:click={() => sortData("volume")}
class="cursor-pointer p-2 text-center select-none" class="cursor-pointer p-2 text-center select-none whitespace-nowrap"
> >
Volume Volume
<svg <svg
@ -245,7 +245,7 @@
<div <div
on:click={() => sortData("sizeVolRatio")} on:click={() => sortData("sizeVolRatio")}
class="cursor-pointer p-2 text-center select-none" class="cursor-pointer p-2 text-center select-none whitespace-nowrap"
> >
% Size / Vol % Size / Vol
<svg <svg

50
src/lib/components/Table/OptionsFlowTable.svelte
View File

@ -243,7 +243,7 @@
> >
<div <div
on:click={() => sortData("time")} on:click={() => sortData("time")}
class="cursor-pointer p-2 text-center whitespace-nowrap" class="cursor-pointer p-2 text-center select-none whitespace-nowrap"
> >
Time Time
<svg <svg
@ -264,7 +264,7 @@
</div> </div>
<div <div
on:click={() => sortData("ticker")} on:click={() => sortData("ticker")}
class="cursor-pointer p-2 text-center select-none" class="cursor-pointer p-2 text-center select-none whitespace-nowrap"
> >
Symbol Symbol
<svg <svg
@ -420,7 +420,7 @@
<div <div
on:click={() => sortData("price")} on:click={() => sortData("price")}
class="cursor-pointer p-2 text-center select-none" class="cursor-pointer p-2 text-center select-none whitespace-nowrap"
> >
Price Price
<svg <svg
@ -441,7 +441,7 @@
</div> </div>
<div <div
on:click={() => sortData("premium")} on:click={() => sortData("premium")}
class="cursor-pointer p-2 text-center select-none" class="cursor-pointer p-2 text-center select-none whitespace-nowrap"
> >
Premium Premium
<svg <svg
@ -463,7 +463,7 @@
<div <div
on:click={() => sortData("type")} on:click={() => sortData("type")}
class="cursor-pointer p-2 text-center whitespace-nowrap" class="cursor-pointer p-2 text-center select-none whitespace-nowrap"
> >
Type Type
<svg <svg
@ -485,7 +485,7 @@
<div <div
on:click={() => sortData("exec")} on:click={() => sortData("exec")}
class="cursor-pointer p-2 text-center whitespace-nowrap" class="cursor-pointer p-2 text-center select-none whitespace-nowrap"
> >
Exec. Exec.
<svg <svg
@ -507,7 +507,7 @@
<div <div
on:click={() => sortData("size")} on:click={() => sortData("size")}
class="cursor-pointer p-2 text-center select-none" class="cursor-pointer p-2 text-center select-none whitespace-nowrap"
> >
Size Size
<svg <svg
@ -528,7 +528,7 @@
</div> </div>
<div <div
on:click={() => sortData("vol")} on:click={() => sortData("vol")}
class="cursor-pointer p-2 text-center select-none" class="cursor-pointer p-2 text-center select-none whitespace-nowrap"
> >
Vol Vol
<svg <svg
@ -550,7 +550,7 @@
<div <div
on:click={() => sortData("oi")} on:click={() => sortData("oi")}
class="cursor-pointer p-2 text-center select-none" class="cursor-pointer p-2 text-center select-none whitespace-nowrap"
> >
OI OI
<svg <svg
@ -595,13 +595,13 @@
data?.user?.tier !== "Pro"} data?.user?.tier !== "Pro"}
> >
<div <div
class="p-2 text-center text-white text-xs sm:text-sm whitespace-nowrap" class="p-2 text-center text-white text-sm sm:text-[1rem] whitespace-nowrap"
> >
{formatTime(displayedData[index]?.time)} {formatTime(displayedData[index]?.time)}
</div> </div>
<div <div
on:click|stopPropagation on:click|stopPropagation
class="p-2 text-center text-white text-xs sm:text-sm whitespace-nowrap" class="p-2 text-center text-white text-sm sm:text-[1rem] whitespace-nowrap"
> >
<HoverStockChart <HoverStockChart
symbol={displayedData[index]?.ticker} symbol={displayedData[index]?.ticker}
@ -613,7 +613,7 @@
id={displayedData[index]?.id} id={displayedData[index]?.id}
on:click|stopPropagation={() => on:click|stopPropagation={() =>
addToWatchlist(displayedData[index]?.id)} addToWatchlist(displayedData[index]?.id)}
class="p-2 text-center text-white text-xs sm:text-sm whitespace-nowrap {optionsWatchlist.optionsId?.includes( class="p-2 text-center text-white text-sm sm:text-[1rem] whitespace-nowrap {optionsWatchlist.optionsId?.includes(
displayedData[index]?.id, displayedData[index]?.id,
) )
? 'text-[#FBCE3C]' ? 'text-[#FBCE3C]'
@ -633,13 +633,13 @@
</div> </div>
<div <div
class="p-2 text-center text-white text-xs sm:text-sm whitespace-nowrap" class="p-2 text-center text-white text-sm sm:text-[1rem] whitespace-nowrap"
> >
{reformatDate(displayedData[index]?.date_expiration)} {reformatDate(displayedData[index]?.date_expiration)}
</div> </div>
<div <div
class="p-2 text-center text-white text-xs sm:text-sm whitespace-nowrap" class="p-2 text-center text-white text-sm sm:text-[1rem] whitespace-nowrap"
> >
{displayedData[index]?.dte < 0 {displayedData[index]?.dte < 0
? "expired" ? "expired"
@ -647,13 +647,13 @@
</div> </div>
<div <div
class="p-2 text-center text-white text-xs sm:text-sm whitespace-nowrap" class="p-2 text-center text-white text-sm sm:text-[1rem] whitespace-nowrap"
> >
{displayedData[index]?.strike_price} {displayedData[index]?.strike_price}
</div> </div>
<div <div
class="p-2 text-center text-white text-xs sm:text-sm whitespace-nowrap {displayedData[ class="p-2 text-center text-sm sm:text-[1rem] whitespace-nowrap {displayedData[
index index
]?.put_call === 'Calls' ]?.put_call === 'Calls'
? 'text-[#00FC50]' ? 'text-[#00FC50]'
@ -663,7 +663,7 @@
</div> </div>
<div <div
class="p-2 text-center text-white text-xs sm:text-sm whitespace-nowrap {displayedData[ class="p-2 text-center text-sm sm:text-[1rem] whitespace-nowrap {displayedData[
index index
]?.sentiment === 'Bullish' ]?.sentiment === 'Bullish'
? 'text-[#00FC50]' ? 'text-[#00FC50]'
@ -675,19 +675,19 @@
</div> </div>
<div <div
class="p-2 text-center text-white text-xs sm:text-sm whitespace-nowrap" class="p-2 text-center text-white text-sm sm:text-[1rem] whitespace-nowrap"
> >
{displayedData[index]?.underlying_price} {displayedData[index]?.underlying_price}
</div> </div>
<div <div
class="p-2 text-center text-white text-xs sm:text-sm whitespace-nowrap" class="p-2 text-center text-white text-sm sm:text-[1rem] whitespace-nowrap"
> >
{displayedData[index]?.price} {displayedData[index]?.price}
</div> </div>
<div <div
class="p-2 text-center text-white text-xs sm:text-sm whitespace-nowrap" class="p-2 text-center text-white text-sm sm:text-[1rem] whitespace-nowrap"
> >
{@html abbreviateNumberWithColor( {@html abbreviateNumberWithColor(
displayedData[index]?.cost_basis, displayedData[index]?.cost_basis,
@ -697,7 +697,7 @@
</div> </div>
<div <div
class="p-2 text-center text-white text-xs sm:text-sm whitespace-nowrap uppercase {displayedData[ class="p-2 text-center text-sm sm:text-[1rem] whitespace-nowrap uppercase {displayedData[
index index
]?.option_activity_type === 'Sweep' ]?.option_activity_type === 'Sweep'
? 'text-[#C6A755]' ? 'text-[#C6A755]'
@ -707,7 +707,7 @@
</div> </div>
<div <div
class="p-2 text-center text-white text-xs sm:text-sm whitespace-nowrap uppercase {[ class="p-2 text-center text-sm sm:text-[1rem] whitespace-nowrap uppercase {[
'At Ask', 'At Ask',
'Above Ask', 'Above Ask',
]?.includes(displayedData[index]?.execution_estimate) ]?.includes(displayedData[index]?.execution_estimate)
@ -726,7 +726,7 @@
</div> </div>
<div <div
class="p-2 text-center text-white text-xs sm:text-sm whitespace-nowrap" class="p-2 text-center text-white text-sm sm:text-[1rem] whitespace-nowrap"
> >
{new Intl.NumberFormat("en", { {new Intl.NumberFormat("en", {
minimumFractionDigits: 0, minimumFractionDigits: 0,
@ -735,7 +735,7 @@
</div> </div>
<div <div
class="p-2 text-center text-white text-xs sm:text-sm whitespace-nowrap" class="p-2 text-center text-white text-sm sm:text-[1rem] whitespace-nowrap"
> >
{new Intl.NumberFormat("en", { {new Intl.NumberFormat("en", {
minimumFractionDigits: 0, minimumFractionDigits: 0,
@ -744,7 +744,7 @@
</div> </div>
<div <div
class="p-2 text-center text-white text-xs sm:text-sm whitespace-nowrap" class="p-2 text-center text-white text-sm sm:text-[1rem] whitespace-nowrap"
> >
{new Intl.NumberFormat("en", { {new Intl.NumberFormat("en", {
minimumFractionDigits: 0, minimumFractionDigits: 0,