This commit is contained in:
MuslemRahimi 2024-06-02 20:37:29 +02:00
parent fe874f954a
commit a8e1c7730a

View File

@ -198,16 +198,16 @@ onMount(async() => {
{#if stockDividends?.length !== 0} {#if stockDividends?.length !== 0}
<div class="grid grid-cols-2 sm:grid-cols-3 gap-10 sm:gap-5 bg-[#0F0F0F] shadow-md rounded-xl p-2 flex justify-center items-center mb-2"> <div class="grid grid-cols-2 sm:grid-cols-3 gap-10 sm:gap-5 bg-[#202020] shadow-md rounded-xl p-5 flex justify-center items-center mb-2">
<!--Start Column Title--> <!--Start Column Title-->
<div class="flex flex-col"> <div class="flex flex-col">
<div class="flex flex-row items-center"> <div class="flex flex-row items-center">
<span class="text-white font-medium text-md sm:text-lg"> <span class="text-gray-300 font-medium text-[1rem]">
Dividend Yield Dividend Yield
</span> </span>
</div> </div>
<span class="text-white text-[1rem]"> <span class="text-white text-[1rem] font-semibold">
{dividendYield !== '0.00' ? dividendYield : '0'}% {dividendYield !== '0.00' ? dividendYield : '0'}%
</span> </span>
</div> </div>
@ -216,11 +216,11 @@ onMount(async() => {
<!--Start Column Win Rate--> <!--Start Column Win Rate-->
<div class="flex flex-col"> <div class="flex flex-col">
<div class="flex flex-row items-center"> <div class="flex flex-row items-center">
<span class="text-white font-medium text-md sm:text-lg"> <span class="text-gray-300 font-medium text-[1rem] ">
Annual Dividend Annual Dividend
</span> </span>
</div> </div>
<span class="text-white text-[1rem]"> <span class="text-white text-[1rem] font-semibold">
${annualDividend !== '0.00' ? annualDividend : '0'} ${annualDividend !== '0.00' ? annualDividend : '0'}
</span> </span>
</div> </div>
@ -229,11 +229,11 @@ onMount(async() => {
<!--Start Column Performance--> <!--Start Column Performance-->
<div class="flex flex-col"> <div class="flex flex-col">
<div class="flex flex-row items-center"> <div class="flex flex-row items-center">
<span class="text-white font-medium text-md sm:text-lg"> <span class="text-gray-300 font-medium text-[1rem]">
Ex-Dividend Date Ex-Dividend Date
</span> </span>
</div> </div>
<span class="text-white text-[1rem]"> <span class="text-white text-[1rem] font-semibold">
{new Date(exDividendDate)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })} {new Date(exDividendDate)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })}
</span> </span>
</div> </div>
@ -242,11 +242,11 @@ onMount(async() => {
<!--Start Column--> <!--Start Column-->
<div class="flex flex-col sm:mt-5"> <div class="flex flex-col sm:mt-5">
<div class="flex flex-row items-center"> <div class="flex flex-row items-center">
<span class="text-white font-medium text-md sm:text-lg"> <span class="text-gray-300 font-medium text-[1rem]">
Payout Frequency Payout Frequency
</span> </span>
</div> </div>
<span class="text-white text-[1rem]"> <span class="text-white text-[1rem] font-semibold">
{payoutFrequency === 4 ? 'Quartely' : payoutFrequency === 2 ? 'Half-Yearly' : payoutFrequency === 1 ? 'Annually' : 'n/a'} {payoutFrequency === 4 ? 'Quartely' : payoutFrequency === 2 ? 'Half-Yearly' : payoutFrequency === 1 ? 'Annually' : 'n/a'}
</span> </span>
</div> </div>
@ -255,11 +255,11 @@ onMount(async() => {
<!--Start Column--> <!--Start Column-->
<div class="flex flex-col sm:mt-5"> <div class="flex flex-col sm:mt-5">
<div class="flex flex-row items-center"> <div class="flex flex-row items-center">
<span class="text-white font-medium text-md sm:text-lg"> <span class="text-gray-300 font-medium text-[1rem]">
Payout Ratio Payout Ratio
</span> </span>
</div> </div>
<span class="text-white text-[1rem]"> <span class="text-white text-[1rem] font-semibold">
{payoutRatio !== '0.00' ? payoutRatio : '0'}% {payoutRatio !== '0.00' ? payoutRatio : '0'}%
</span> </span>
</div> </div>
@ -268,11 +268,11 @@ onMount(async() => {
<!--Start Column--> <!--Start Column-->
<div class="flex flex-col sm:mt-5"> <div class="flex flex-col sm:mt-5">
<div class="flex flex-row items-center"> <div class="flex flex-row items-center">
<span class="text-white font-medium text-md sm:text-lg"> <span class="text-gray-300 font-medium text-[1rem]">
Dividend Growth Dividend Growth
</span> </span>
</div> </div>
<span class="text-white text-[1rem]"> <span class="text-white text-[1rem] font-semibold">
{dividendGrowth !== 'NaN' ? dividendGrowth+'%' : '-'} {dividendGrowth !== 'NaN' ? dividendGrowth+'%' : '-'}
</span> </span>
</div> </div>