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-09-12 12:53:46 +02:00
parent a1862b8e37
commit a2fab526b9
2 changed files with 18 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -285,7 +285,7 @@ $: {
{ formatDateRange(rawData?.slice(-1)?.at(0)?.date)} { formatDateRange(rawData?.slice(-1)?.at(0)?.date)}
</td> </td>
</tr> </tr>
<tr class="border-y border-gray-800 odd:bg-[#27272A]"> <tr class="border-y border-gray-800 whitespace-nowrap odd:bg-[#27272A]">
<td class="px-[5px] py-1.5 xs:px-2.5 xs:py-2"> <td class="px-[5px] py-1.5 xs:px-2.5 xs:py-2">
<span>Total Volume</span> <span>Total Volume</span>
</td> </td>
@ -293,7 +293,7 @@ $: {
{monthlyVolume} {monthlyVolume}
</td> </td>
</tr> </tr>
<tr class="border-y border-gray-800 odd:bg-[#27272A]"> <tr class="border-y border-gray-800 whitespace-nowrap odd:bg-[#27272A]">
<td class="px-[5px] py-1.5 xs:px-2.5 xs:py-2"> <td class="px-[5px] py-1.5 xs:px-2.5 xs:py-2">
<span>Avg. Short % of Volume</span> <span>Avg. Short % of Volume</span>
</td> </td>

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

@ -609,8 +609,8 @@ $: {
<!--Start Flow Sentiment--> <!--Start Flow Sentiment-->
<div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-lg h-20"> <div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-lg 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-lg ">Flow Sentiment</span> <span class="font-semibold text-gray-200 text-sm sm:text-[1rem] ">Flow Sentiment</span>
<span class="text-start text-xl font-semibold {flowSentiment === 'Bullish' ? 'text-[#00FC50]' : 'text-[#FC2120]'}">{flowSentiment}</span> <span class="text-start text-[1rem] font-semibold {flowSentiment === 'Bullish' ? 'text-[#00FC50]' : 'text-[#FC2120]'}">{flowSentiment}</span>
</div> </div>
</div> </div>
@ -618,8 +618,8 @@ $: {
<!--Start Put/Call--> <!--Start Put/Call-->
<div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-lg h-20"> <div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-lg 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-lg ">Put/Call</span> <span class="font-semibold text-gray-200 text-sm sm:text-[1rem] ">Put/Call</span>
<span class="text-start text-lg font-semibold text-white"> <span class="text-start text-[1rem] font-semibold text-white">
{putCallRatio?.toFixed(3)} {putCallRatio?.toFixed(3)}
</span> </span>
</div> </div>
@ -645,8 +645,8 @@ $: {
<!--Start Call Flow--> <!--Start Call Flow-->
<div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-lg h-20"> <div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-lg 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-lg ">Call Flow</span> <span class="font-semibold text-gray-200 text-sm sm:text-[1rem] ">Call Flow</span>
<span class="text-start text-lg font-semibold text-white"> <span class="text-start text-[1rem] font-semibold text-white">
{new Intl.NumberFormat("en", { {new Intl.NumberFormat("en", {
minimumFractionDigits: 0, minimumFractionDigits: 0,
maximumFractionDigits: 0 maximumFractionDigits: 0
@ -674,8 +674,8 @@ $: {
<!--Start Put Flow--> <!--Start Put Flow-->
<div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-lg h-20"> <div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-lg 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-lg ">Put Flow</span> <span class="font-semibold text-gray-200 text-sm sm:text-[1rem] ">Put Flow</span>
<span class="text-start text-lg font-semibold text-white"> <span class="text-start text-[1rem] font-semibold text-white">
{new Intl.NumberFormat("en", { {new Intl.NumberFormat("en", {
minimumFractionDigits: 0, minimumFractionDigits: 0,
maximumFractionDigits: 0 maximumFractionDigits: 0
@ -705,8 +705,8 @@ $: {
<!--Start Most Traded--> <!--Start Most Traded-->
<div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-lg h-20"> <div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-lg 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-lg ">Most Traded Option</span> <span class="font-semibold text-gray-200 text-sm sm:text-[1rem] ">Most Traded Option</span>
<span class="text-start text-lg font-semibold text-white mt-0.5"> <span class="text-start text-[1rem] font-semibold text-white mt-0.5">
<span class="text-blue-400 "> <span class="text-blue-400 ">
{mostFrequentTicker?.ticker} {mostFrequentTicker?.ticker}
</span> </span>
@ -722,8 +722,8 @@ $: {
<!--Start Highest Premium--> <!--Start Highest Premium-->
<div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-lg h-20"> <div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-lg 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-lg ">Highest Premium</span> <span class="font-semibold text-gray-200 text-sm sm:text-[1rem] ">Highest Premium</span>
<span class="text-start text-lg font-semibold text-white mt-0.5"> <span class="text-start text-[1rem] font-semibold text-white mt-0.5">
<span class="text-blue-400 "> <span class="text-blue-400 ">
{highestPremiumTicker?.ticker} {highestPremiumTicker?.ticker}
</span> </span>
@ -739,8 +739,8 @@ $: {
<!--Start Highest Volume--> <!--Start Highest Volume-->
<div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-lg h-20"> <div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-lg 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-lg ">Highest Volume</span> <span class="font-semibold text-gray-200 text-sm sm:text-[1rem] ">Highest Volume</span>
<span class="text-start text-lg font-semibold text-white mt-0.5"> <span class="text-start text-[1rem] font-semibold text-white mt-0.5">
<span class="text-blue-400 "> <span class="text-blue-400 ">
{highestVolumeTicker?.ticker} {highestVolumeTicker?.ticker}
</span> </span>
@ -756,8 +756,8 @@ $: {
<!--Start Highest Open Interest--> <!--Start Highest Open Interest-->
<div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-lg h-20"> <div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-lg 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-lg ">Highest Open Interest</span> <span class="font-semibold text-gray-200 text-sm sm:text-[1rem] ">Highest Open Interest</span>
<span class="text-start text-lg font-semibold text-white mt-0.5"> <span class="text-start text-[1rem] font-semibold text-white mt-0.5">
<span class="text-blue-400 "> <span class="text-blue-400 ">
{highestOpenInterestTicker?.ticker} {highestOpenInterestTicker?.ticker}
</span> </span>