ui fix
This commit is contained in:
MuslemRahimi
parent
f839a3566c
commit
558e42e499
@ -4,7 +4,6 @@
|
|||||||
export let title;
|
export let title;
|
||||||
export let content;
|
export let content;
|
||||||
export let id;
|
export let id;
|
||||||
export let hide = false;
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -389,85 +389,55 @@ $: {
|
|||||||
|
|
||||||
<div class="mb-4 grid grid-cols-2 grid-rows-2 divide-gray-500 rounded-lg border border-gray-600 bg-[#272727] shadow md:grid-cols-4 md:grid-rows-1 md:divide-x">
|
<div class="mb-4 grid grid-cols-2 grid-rows-2 divide-gray-500 rounded-lg border border-gray-600 bg-[#272727] shadow md:grid-cols-4 md:grid-rows-1 md:divide-x">
|
||||||
<div class="p-4 bp:p-5 sm:p-6">
|
<div class="p-4 bp:p-5 sm:p-6">
|
||||||
<div class="text-sm font-normal text-default xs:text-base">
|
<label for="totaVolume" class="mr-1 cursor-pointer flex flex-row items-center text-white text-[1rem]">
|
||||||
Total Volume
|
Total Volume
|
||||||
<span class="relative" role="tooltip">
|
<InfoModal
|
||||||
<label for="totaVolume" class="absolute -right-[10px] -top-[3px] cursor-pointer p-1 text-gray-300 hover:text-gray-600 dark:text-dark-400 dark:hover:text-dark-300">
|
title={"Total Volume"}
|
||||||
<svg class="h-[9px] w-[9px]" viewBox="0 0 4 16" fill="white" style="max-width:20px">
|
content={"The total volume is the combined number of puts and calls traded over the past three months in options trading."}
|
||||||
<path d="M0 6h4v10h-4v-10zm2-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"></path>
|
id={"totaVolume"}
|
||||||
</svg>
|
/>
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
|
||||||
title={"Total Volume"}
|
|
||||||
content={"The total volume is the combined number of puts and calls traded over the past three months in options trading."}
|
|
||||||
id={"totaVolume"}
|
|
||||||
hide={true}
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="mt-1 break-words font-semibold leading-8 text-light text-lg">
|
<div class="mt-1 break-words font-semibold leading-8 text-light text-lg">
|
||||||
{displayTotalVolume}
|
{displayTotalVolume}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-4 bp:p-5 sm:p-6 border-l border-contrast md:border-0">
|
<div class="p-4 bp:p-5 sm:p-6 border-l border-contrast md:border-0">
|
||||||
<div class="text-sm font-normal text-default xs:text-base">
|
<label for="totalOpenInterest" class="mr-1 cursor-pointer flex flex-row items-center text-white text-[1rem]">
|
||||||
Total OI
|
Total OI
|
||||||
<span class="relative" role="tooltip">
|
<InfoModal
|
||||||
<label for="totalOpenInterest" class="absolute -right-[10px] -top-[3px] cursor-pointer p-1 text-gray-300 hover:text-gray-600 dark:text-dark-400 dark:hover:text-dark-300">
|
title={"Total OI"}
|
||||||
<svg class="h-[9px] w-[9px]" viewBox="0 0 4 16" fill="white" style="max-width:20px">
|
content={"The total open interest reflects the aggregate number of outstanding options contracts in options trading."}
|
||||||
<path d="M0 6h4v10h-4v-10zm2-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"></path>
|
id={"totalOpenInterest"}
|
||||||
</svg>
|
/>
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
|
||||||
title={"Total OI"}
|
|
||||||
content={"The total open interest reflects the aggregate number of outstanding options contracts in options trading."}
|
|
||||||
id={"totalOpenInterest"}
|
|
||||||
hide={true}
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="mt-1 break-words font-semibold leading-8 text-light text-lg">
|
<div class="mt-1 break-words font-semibold leading-8 text-light text-lg">
|
||||||
{displayTotalOpenInterest}
|
{displayTotalOpenInterest}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-4 bp:p-5 sm:p-6 border-t border-contrast md:border-0">
|
<div class="p-4 bp:p-5 sm:p-6 border-t border-contrast md:border-0">
|
||||||
<div class="text-sm font-normal text-default xs:text-base">
|
<label for="putCallRatio" class="mr-1 cursor-pointer flex flex-row items-center text-white text-[1rem]">
|
||||||
P/C Ratio
|
P/C Ratio
|
||||||
<span class="relative" role="tooltip">
|
<InfoModal
|
||||||
<label for="putCallRatio" class="absolute -right-[10px] -top-[3px] cursor-pointer p-1 text-gray-300 hover:text-gray-600 dark:text-dark-400 dark:hover:text-dark-300">
|
title={"P/C Ratio"}
|
||||||
<svg class="h-[9px] w-[9px]" viewBox="0 0 4 16" fill="white" style="max-width:20px">
|
content={"The put-call ratio assesses market sentiment and potential movements by comparing traded put options to call options."}
|
||||||
<path d="M0 6h4v10h-4v-10zm2-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"></path>
|
id={"putCallRatio"}
|
||||||
</svg>
|
/>
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
|
||||||
title={"P/C Ratio"}
|
|
||||||
content={"The put-call ratio assesses market sentiment and potential movements by comparing traded put options to call options."}
|
|
||||||
id={"putCallRatio"}
|
|
||||||
hide={true}
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="mt-1 break-words font-semibold leading-8 text-light text-lg">
|
<div class="mt-1 break-words font-semibold leading-8 text-light text-lg">
|
||||||
{putCallRatio !== 'Infinity' ? putCallRatio : '> 1'}
|
{putCallRatio !== 'Infinity' ? putCallRatio : '> 1'}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-4 bp:p-5 sm:p-6 border-t border-contrast md:border-0 border-l border-contrast md:border-0">
|
<div class="p-4 bp:p-5 sm:p-6 border-t border-contrast md:border-0 border-l border-contrast md:border-0">
|
||||||
<div class="text-sm font-normal text-default xs:text-base">
|
<label for="openInteresteRatio" class="mr-1 cursor-pointer flex flex-row items-center text-white text-[1rem]">
|
||||||
OI P/C Ratio
|
OI P/C Ratio
|
||||||
<span class="relative" role="tooltip">
|
<InfoModal
|
||||||
<label for="openInteresteRatio" class="absolute -right-[10px] -top-[3px] cursor-pointer p-1 text-gray-300 hover:text-gray-600 dark:text-dark-400 dark:hover:text-dark-300">
|
title={"OI P/C Ratio"}
|
||||||
<svg class="h-[9px] w-[9px]" viewBox="0 0 4 16" fill="white" style="max-width:20px">
|
content={"The open interest put-call ratio measures market sentiment in options trading by comparing the total number of outstanding put options contracts to outstanding call options contracts. A higher ratio suggests bearish sentiment, while a lower ratio indicates bullish sentiment."}
|
||||||
<path d="M0 6h4v10h-4v-10zm2-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"></path>
|
id={"openInteresteRatio"}
|
||||||
</svg>
|
/>
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
|
||||||
title={"OI P/C Ratio"}
|
|
||||||
content={"The open interest put-call ratio measures market sentiment in options trading by comparing the total number of outstanding put options contracts to outstanding call options contracts. A higher ratio suggests bearish sentiment, while a lower ratio indicates bullish sentiment."}
|
|
||||||
id={"openInteresteRatio"}
|
|
||||||
hide ={true}
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="mt-1 break-words font-semibold leading-8 text-light text-lg">
|
<div class="mt-1 break-words font-semibold leading-8 text-light text-lg">
|
||||||
{putCallOpenInterestRatio !== 'Infinity' ? putCallOpenInterestRatio : '> 1'}
|
{putCallOpenInterestRatio !== 'Infinity' ? putCallOpenInterestRatio : '> 1'}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -132,85 +132,56 @@ changeTab(0)
|
|||||||
|
|
||||||
<div class="mb-4 grid grid-cols-2 grid-rows-2 divide-gray-500 rounded-lg border border-gray-600 bg-[#272727] shadow md:grid-cols-4 md:grid-rows-1 md:divide-x">
|
<div class="mb-4 grid grid-cols-2 grid-rows-2 divide-gray-500 rounded-lg border border-gray-600 bg-[#272727] shadow md:grid-cols-4 md:grid-rows-1 md:divide-x">
|
||||||
<div class="p-4 bp:p-5 sm:p-6">
|
<div class="p-4 bp:p-5 sm:p-6">
|
||||||
<div class="text-sm font-normal text-default xs:text-base">
|
<label for="totalAnalystInfo" class="mr-1 cursor-pointer flex flex-row items-center text-white text-[1rem]">
|
||||||
Total Analysts
|
Total Analysts
|
||||||
<span class="relative" role="tooltip">
|
<InfoModal
|
||||||
<label for="totalAnalystInfo" class="absolute -right-[10px] -top-[3px] cursor-pointer p-1 text-gray-300 hover:text-gray-600 dark:text-dark-400 dark:hover:text-dark-300">
|
title={"Total Analyst"}
|
||||||
<svg class="h-[9px] w-[9px]" viewBox="0 0 4 16" fill="white" style="max-width:20px">
|
content={"The total number of analyst who provided a rating in the past 12 months."}
|
||||||
<path d="M0 6h4v10h-4v-10zm2-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"></path>
|
id={"totalAnalystInfo"}
|
||||||
</svg>
|
/>
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
|
||||||
title={"Total Analyst"}
|
|
||||||
content={"The total number of analyst who provided a rating in the past 12 months."}
|
|
||||||
id={"totalAnalystInfo"}
|
|
||||||
hide={true}
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="mt-1 break-words font-semibold leading-8 text-light text-xl">
|
<div class="mt-1 break-words font-semibold leading-8 text-light text-xl">
|
||||||
{numOfAnalyst}
|
{numOfAnalyst}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-4 bp:p-5 sm:p-6 border-l border-contrast md:border-0">
|
<div class="p-4 bp:p-5 sm:p-6 border-l border-contrast md:border-0">
|
||||||
<div class="text-sm font-normal text-default xs:text-base">
|
<label for="consensusRatingInfo" class="mr-1 cursor-pointer flex flex-row items-center text-white text-[1rem]">
|
||||||
Consensus Rating
|
Total Rating
|
||||||
<span class="relative" role="tooltip">
|
<InfoModal
|
||||||
<label for="consensusRatingInfo" class="absolute -right-[10px] -top-[3px] cursor-pointer p-1 text-gray-300 hover:text-gray-600 dark:text-dark-400 dark:hover:text-dark-300">
|
title={"Consensus Rating"}
|
||||||
<svg class="h-[9px] w-[9px]" viewBox="0 0 4 16" fill="white" style="max-width:20px">
|
content={`The average analyst rating for ${$stockTicker} is standardized to align with categories: Strong Buy, Buy, Hold, Sell, and Strong Sell.`}
|
||||||
<path d="M0 6h4v10h-4v-10zm2-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"></path>
|
id={"consensusRatingInfo"}
|
||||||
</svg>
|
/>
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
|
||||||
title={"Consensus Rating"}
|
|
||||||
content={`The average analyst rating for ${$stockTicker} is standardized to align with categories: Strong Buy, Buy, Hold, Sell, and Strong Sell.`}
|
|
||||||
id={"consensusRatingInfo"}
|
|
||||||
hide={true}
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="mt-1 break-words font-semibold leading-8 text-light text-xl">
|
<div class="mt-1 break-words font-semibold leading-8 text-light text-xl">
|
||||||
{consensusRating}
|
{consensusRating}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-4 bp:p-5 sm:p-6 border-t border-contrast md:border-0">
|
<div class="p-4 bp:p-5 sm:p-6 border-t border-contrast md:border-0">
|
||||||
<div class="text-sm font-normal text-default xs:text-base">
|
<label for="priceTargetInfo" class="mr-1 cursor-pointer flex flex-row items-center text-white text-[1rem]">
|
||||||
Price Target
|
Price Target
|
||||||
<span class="relative" role="tooltip">
|
<InfoModal
|
||||||
<label for="priceTargetInfo" class="absolute -right-[10px] -top-[3px] cursor-pointer p-1 text-gray-300 hover:text-gray-600 dark:text-dark-400 dark:hover:text-dark-300">
|
title={"Price Target"}
|
||||||
<svg class="h-[9px] w-[9px]" viewBox="0 0 4 16" fill="white" style="max-width:20px">
|
content={"The average 12-month price target"}
|
||||||
<path d="M0 6h4v10h-4v-10zm2-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"></path>
|
id={"priceTargetInfo"}
|
||||||
</svg>
|
/>
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
|
||||||
title={"Price Target"}
|
|
||||||
content={"The average 12-month price target"}
|
|
||||||
id={"priceTargetInfo"}
|
|
||||||
hide={true}
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="mt-1 break-words font-semibold leading-8 text-light text-xl">
|
<div class="mt-1 break-words font-semibold leading-8 text-light text-xl">
|
||||||
${priceTarget}
|
${priceTarget}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-4 bp:p-5 sm:p-6 border-t border-contrast md:border-0 border-l border-contrast md:border-0">
|
<div class="p-4 bp:p-5 sm:p-6 border-t border-contrast md:border-0 border-l border-contrast md:border-0">
|
||||||
<div class="text-sm font-normal text-default xs:text-base">
|
<label for="upsideInfo" class="mr-1 cursor-pointer flex flex-row items-center text-white text-[1rem]">
|
||||||
Upside
|
Upside
|
||||||
<span class="relative" role="tooltip">
|
<InfoModal
|
||||||
<label for="upsideInfo" class="absolute -right-[10px] -top-[3px] cursor-pointer p-1 text-gray-300 hover:text-gray-600 dark:text-dark-400 dark:hover:text-dark-300">
|
title={"Upside"}
|
||||||
<svg class="h-[9px] w-[9px]" viewBox="0 0 4 16" fill="white" style="max-width:20px">
|
content={"The average price target's percentage difference from the current stock price."}
|
||||||
<path d="M0 6h4v10h-4v-10zm2-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"></path>
|
id={"upsideInfo"}
|
||||||
</svg>
|
/>
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
|
||||||
title={"Upside"}
|
|
||||||
content={"The average price target's percentage difference from the current stock price."}
|
|
||||||
id={"upsideInfo"}
|
|
||||||
hide ={true}
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="mt-1 break-words font-semibold leading-8 text-light text-xl">
|
<div class="mt-1 break-words font-semibold leading-8 text-light text-xl">
|
||||||
{#if changesPercentage >=0}
|
{#if changesPercentage >=0}
|
||||||
<span class="text-[#10DB06]">+{changesPercentage}%</span>
|
<span class="text-[#10DB06]">+{changesPercentage}%</span>
|
||||||
|
|||||||
@ -338,6 +338,7 @@ onMount(async() => {
|
|||||||
|
|
||||||
<div class="flex flex-row items-center justify-center">
|
<div class="flex flex-row items-center justify-center">
|
||||||
Buy, Sell,
|
Buy, Sell,
|
||||||
|
|
||||||
<label for="grantInfo" class="ml-1 cursor-pointer font-medium">
|
<label for="grantInfo" class="ml-1 cursor-pointer font-medium">
|
||||||
Grant
|
Grant
|
||||||
</label>
|
</label>
|
||||||
@ -345,8 +346,8 @@ onMount(async() => {
|
|||||||
title={"Stock Grant"}
|
title={"Stock Grant"}
|
||||||
content={"A stock grant occurs when a company compensates an employee by offering them equity, or when an insider gifts shares. In essence, the company grants ownership of shares, or an insider transfers shares. These grants may involve common stock shares, preferred shares, or another class of shares."}
|
content={"A stock grant occurs when a company compensates an employee by offering them equity, or when an insider gifts shares. In essence, the company grants ownership of shares, or an insider transfers shares. These grants may involve common stock shares, preferred shares, or another class of shares."}
|
||||||
id={"grantInfo"}
|
id={"grantInfo"}
|
||||||
/>,
|
/>
|
||||||
<label for="exerciseInfo" class="ml-1 cursor-pointer font-medium">
|
<label for="exerciseInfo" class="ml-6 cursor-pointer font-medium">
|
||||||
Exercise
|
Exercise
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
<InfoModal
|
||||||
|
|||||||
@ -389,85 +389,55 @@ $: {
|
|||||||
|
|
||||||
<div class="mb-4 grid grid-cols-2 grid-rows-2 divide-gray-500 rounded-lg border border-gray-600 bg-[#272727] shadow md:grid-cols-4 md:grid-rows-1 md:divide-x">
|
<div class="mb-4 grid grid-cols-2 grid-rows-2 divide-gray-500 rounded-lg border border-gray-600 bg-[#272727] shadow md:grid-cols-4 md:grid-rows-1 md:divide-x">
|
||||||
<div class="p-4 bp:p-5 sm:p-6">
|
<div class="p-4 bp:p-5 sm:p-6">
|
||||||
<div class="text-sm font-normal text-default xs:text-base">
|
<label for="totaVolume" class="mr-1 cursor-pointer flex flex-row items-center text-white text-[1rem]">
|
||||||
Total Volume
|
Total Volume
|
||||||
<span class="relative" role="tooltip">
|
<InfoModal
|
||||||
<label for="totaVolume" class="absolute -right-[10px] -top-[3px] cursor-pointer p-1 text-gray-300 hover:text-gray-600 dark:text-dark-400 dark:hover:text-dark-300">
|
title={"Total Volume"}
|
||||||
<svg class="h-[9px] w-[9px]" viewBox="0 0 4 16" fill="white" style="max-width:20px">
|
content={"The total volume is the combined number of puts and calls traded over the past three months in options trading."}
|
||||||
<path d="M0 6h4v10h-4v-10zm2-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"></path>
|
id={"totaVolume"}
|
||||||
</svg>
|
/>
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
|
||||||
title={"Total Volume"}
|
|
||||||
content={"The total volume is the combined number of puts and calls traded over the past three months in options trading."}
|
|
||||||
id={"totaVolume"}
|
|
||||||
hide={true}
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="mt-1 break-words font-semibold leading-8 text-light text-lg">
|
<div class="mt-1 break-words font-semibold leading-8 text-light text-lg">
|
||||||
{displayTotalVolume}
|
{displayTotalVolume}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-4 bp:p-5 sm:p-6 border-l border-contrast md:border-0">
|
<div class="p-4 bp:p-5 sm:p-6 border-l border-contrast md:border-0">
|
||||||
<div class="text-sm font-normal text-default xs:text-base">
|
<label for="totalOpenInterest" class="mr-1 cursor-pointer flex flex-row items-center text-white text-[1rem]">
|
||||||
Total OI
|
Total OI
|
||||||
<span class="relative" role="tooltip">
|
<InfoModal
|
||||||
<label for="totalOpenInterest" class="absolute -right-[10px] -top-[3px] cursor-pointer p-1 text-gray-300 hover:text-gray-600 dark:text-dark-400 dark:hover:text-dark-300">
|
title={"Total OI"}
|
||||||
<svg class="h-[9px] w-[9px]" viewBox="0 0 4 16" fill="white" style="max-width:20px">
|
content={"The total open interest reflects the aggregate number of outstanding options contracts in options trading."}
|
||||||
<path d="M0 6h4v10h-4v-10zm2-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"></path>
|
id={"totalOpenInterest"}
|
||||||
</svg>
|
/>
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
|
||||||
title={"Total OI"}
|
|
||||||
content={"The total open interest reflects the aggregate number of outstanding options contracts in options trading."}
|
|
||||||
id={"totalOpenInterest"}
|
|
||||||
hide={true}
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="mt-1 break-words font-semibold leading-8 text-light text-lg">
|
<div class="mt-1 break-words font-semibold leading-8 text-light text-lg">
|
||||||
{displayTotalOpenInterest}
|
{displayTotalOpenInterest}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-4 bp:p-5 sm:p-6 border-t border-contrast md:border-0">
|
<div class="p-4 bp:p-5 sm:p-6 border-t border-contrast md:border-0">
|
||||||
<div class="text-sm font-normal text-default xs:text-base">
|
<label for="putCallRatio" class="mr-1 cursor-pointer flex flex-row items-center text-white text-[1rem]">
|
||||||
P/C Ratio
|
P/C Ratio
|
||||||
<span class="relative" role="tooltip">
|
<InfoModal
|
||||||
<label for="putCallRatio" class="absolute -right-[10px] -top-[3px] cursor-pointer p-1 text-gray-300 hover:text-gray-600 dark:text-dark-400 dark:hover:text-dark-300">
|
title={"P/C Ratio"}
|
||||||
<svg class="h-[9px] w-[9px]" viewBox="0 0 4 16" fill="white" style="max-width:20px">
|
content={"The put-call ratio assesses market sentiment and potential movements by comparing traded put options to call options."}
|
||||||
<path d="M0 6h4v10h-4v-10zm2-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"></path>
|
id={"putCallRatio"}
|
||||||
</svg>
|
/>
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
|
||||||
title={"P/C Ratio"}
|
|
||||||
content={"The put-call ratio assesses market sentiment and potential movements by comparing traded put options to call options."}
|
|
||||||
id={"putCallRatio"}
|
|
||||||
hide={true}
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="mt-1 break-words font-semibold leading-8 text-light text-lg">
|
<div class="mt-1 break-words font-semibold leading-8 text-light text-lg">
|
||||||
{putCallRatio !== 'Infinity' ? putCallRatio : '> 1'}
|
{putCallRatio !== 'Infinity' ? putCallRatio : '> 1'}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-4 bp:p-5 sm:p-6 border-t border-contrast md:border-0 border-l border-contrast md:border-0">
|
<div class="p-4 bp:p-5 sm:p-6 border-t border-contrast md:border-0 border-l border-contrast md:border-0">
|
||||||
<div class="text-sm font-normal text-default xs:text-base">
|
<label for="openInteresteRatio" class="mr-1 cursor-pointer flex flex-row items-center text-white text-[1rem]">
|
||||||
OI P/C Ratio
|
OI P/C Ratio
|
||||||
<span class="relative" role="tooltip">
|
<InfoModal
|
||||||
<label for="openInteresteRatio" class="absolute -right-[10px] -top-[3px] cursor-pointer p-1 text-gray-300 hover:text-gray-600 dark:text-dark-400 dark:hover:text-dark-300">
|
title={"OI P/C Ratio"}
|
||||||
<svg class="h-[9px] w-[9px]" viewBox="0 0 4 16" fill="white" style="max-width:20px">
|
content={"The open interest put-call ratio measures market sentiment in options trading by comparing the total number of outstanding put options contracts to outstanding call options contracts. A higher ratio suggests bearish sentiment, while a lower ratio indicates bullish sentiment."}
|
||||||
<path d="M0 6h4v10h-4v-10zm2-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2z"></path>
|
id={"openInteresteRatio"}
|
||||||
</svg>
|
/>
|
||||||
</label>
|
</label>
|
||||||
<InfoModal
|
|
||||||
title={"OI P/C Ratio"}
|
|
||||||
content={"The open interest put-call ratio measures market sentiment in options trading by comparing the total number of outstanding put options contracts to outstanding call options contracts. A higher ratio suggests bearish sentiment, while a lower ratio indicates bullish sentiment."}
|
|
||||||
id={"openInteresteRatio"}
|
|
||||||
hide ={true}
|
|
||||||
/>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="mt-1 break-words font-semibold leading-8 text-light text-lg">
|
<div class="mt-1 break-words font-semibold leading-8 text-light text-lg">
|
||||||
{putCallOpenInterestRatio !== 'Infinity' ? putCallOpenInterestRatio : '> 1'}
|
{putCallOpenInterestRatio !== 'Infinity' ? putCallOpenInterestRatio : '> 1'}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user