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

ui fix

Browse Source
This commit is contained in:
MuslemRahimi 2024-10-12 16:42:25 +02:00
parent 1304059f11
commit 95a7c8939e
12 changed files with 31 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -106,7 +106,7 @@ $: {
<div class="flex flex-col items-start">
<span class="font-medium text-gray-200 text-sm">Quarter Sentiment</span>
{#if !deactivateContent}
<span class="text-start text-[1rem] sm:text-lg font-semibold {flowSentiment === 'Bullish' ? 'text-[#37C97D]' : 'text-[#FC2120]'}">{flowSentiment}</span>
<span class="text-start text-[1rem] sm:text-lg font-semibold {flowSentiment === 'Bullish' ? 'text-[#37C97D]' : 'text-[#FF2F1F]'}">{flowSentiment}</span>
{:else}
<a href="/pricing" class="text-blue-400 mt-1 hover:text-white font-medium text-sm flex justify-center items-center">
Unlock with Pro
@ -182,7 +182,7 @@ $: {
<div class="text-white text-[1rem] mt-4 sm:mt-7 ml-1">
Over the next quarter the model forecasts a
{#if !deactivateContent}
<span class="font-semibold {flowSentiment === 'Bullish' ? 'text-[#37C97D]' : 'text-[#FC2120]'}">{flowSentiment}</span> price movement.
<span class="font-semibold {flowSentiment === 'Bullish' ? 'text-[#37C97D]' : 'text-[#FF2F1F]'}">{flowSentiment}</span> price movement.
{:else}
<a href="/pricing" class="text-blue-400 mt-1 hover:text-white font-medium text-sm">
Unlock Prediction with Pro

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

@ -184,7 +184,7 @@ onMount(async () => {
<div class="flex flex-row items-center flex-wrap w-full px-3 sm:px-5 bg-[#27272A] shadow-lg rounded-lg h-20">
<div class="flex flex-col items-start">
<span class="font-medium text-gray-200 text-sm">Price Sentiment</span>
<span class="text-start text-[1rem] sm:text-lg font-semibold {priceSentiment === 'Bullish' ? 'text-[#37C97D]' : 'text-[#FC2120]'}">{priceSentiment}</span>
<span class="text-start text-[1rem] sm:text-lg font-semibold {priceSentiment === 'Bullish' ? 'text-[#37C97D]' : 'text-[#FF2F1F]'}">{priceSentiment}</span>
</div>
</div>
@ -258,7 +258,7 @@ onMount(async () => {
<div class="text-white text-[1rem] mt-4 sm:mt-7 ml-1">
Over the next 12 months, the model predicts a
<span class="font-semibold {priceSentiment === 'Bullish' ? 'text-[#37C97D]' : 'text-[#FC2120]'}">{priceSentiment}</span>
<span class="font-semibold {priceSentiment === 'Bullish' ? 'text-[#37C97D]' : 'text-[#FF2F1F]'}">{priceSentiment}</span>
trend, suggesting that the future price is expected to {priceSentiment === 'Bullish' ? 'surpass' : 'to be less than'} the previous price of
<span class="font-semibold">${lastPrice?.toFixed(2) ?? 'n/a'}</span>, with a mean value of <span class="font-semibold">${oneYearPricePrediction}</span>.
</div>

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

@ -117,7 +117,7 @@ $: {
<div class="flex flex-row items-center flex-wrap w-full px-3 sm:px-5 bg-[#27272A] shadow-lg rounded-lg h-20">
<div class="flex flex-col items-start">
<span class="font-medium text-gray-200 text-sm">Trend Sentiment</span>
<span class="text-start text-[1rem] sm:text-lg font-semibold {flowSentiment === 'Bullish' ? 'text-[#37C97D]' : 'text-[#FC2120]'}">{flowSentiment}</span>
<span class="text-start text-[1rem] sm:text-lg font-semibold {flowSentiment === 'Bullish' ? 'text-[#37C97D]' : 'text-[#FF2F1F]'}">{flowSentiment}</span>
</div>
</div>
@ -198,7 +198,7 @@ $: {
<div class="text-white text-[1rem] mt-4 sm:mt-7 ml-1">
Over the next {displayData === 'threeMonth' ? '3 months' : displayData === 'oneMonth' ? '1 month' : '1 week'}, the model forecasts a
<span class="font-semibold {flowSentiment === 'Bullish' ? 'text-[#37C97D]' : 'text-[#FC2120]'}">{flowSentiment}</span>
<span class="font-semibold {flowSentiment === 'Bullish' ? 'text-[#37C97D]' : 'text-[#FF2F1F]'}">{flowSentiment}</span>
trend, indicating that the future price is expected to {flowSentiment === 'Bullish' ? 'exceed' : 'to be less than'} the previous price of
<span class="font-medium">${lastPrice ?? 'n/a'}</span>.
</div>

4
src/routes/+page.svelte
View File

@ -329,7 +329,7 @@ onMount( async() => {
<Table.Cell>
<a href={item?.underlying_type === 'stock' ? `/stocks/${item?.ticker}` : `/etf/${item?.ticker}`} class="text-sm sm:text-[1rem] font-medium text-blue-400 sm:hover:text-white transition duration-100">{item?.ticker}</a>
</Table.Cell>
<Table.Cell class="text-right xl:table.-column text-sm sm:text-[1rem] {item?.put_call === 'Calls' ? 'text-[#00FC50]' : 'text-[#FC2120]'}">
<Table.Cell class="text-right xl:table.-column text-sm sm:text-[1rem] {item?.put_call === 'Calls' ? 'text-[#00FC50]' : 'text-[#FF2F1F]'}">
{abbreviateNumber(item?.cost_basis,true)}
</Table.Cell>
<Table.Cell class="text-right xl:table.-column text-sm sm:text-[1rem]">
@ -338,7 +338,7 @@ onMount( async() => {
<Table.Cell class="text-right md:table.-cell xl:table.-column text-sm sm:text-[1rem] text-white">
{abbreviateNumber(optionsMode === 'openInterest' ? item?.open_interest : item?.volume)}
</Table.Cell>
<Table.Cell class="text-right md:table.-cell xl:table.-column text-sm sm:text-[1rem] {item?.put_call === 'Calls' ? 'text-[#00FC50]' : 'text-[#FC2120]'}">
<Table.Cell class="text-right md:table.-cell xl:table.-column text-sm sm:text-[1rem] {item?.put_call === 'Calls' ? 'text-[#00FC50]' : 'text-[#FF2F1F]'}">
{item?.put_call}
</Table.Cell>

6
src/routes/cramer-tracker/+page.svelte
View File

@ -383,7 +383,7 @@ rawData?.forEach(item => {
<Card.Header class="flex flex-col items-start space-y-0 pb-2">
<Card.Title class="text-start text-xl sm:text-2xl font-semibold pb-2">Cumulative Return</Card.Title>
<Card.Description class="text-white text-sm pb-2">
Following Jim Cramer's stock picks since {rawData?.slice(0)?.at(0)?.date}, would have yielded a <strong class="{cumulativeList?.slice(-1) > 0 ? 'text-[#00FC50]' : 'text-[#FC2120]'}">{cumulativeList?.slice(-1) > 0 ? '+' : ''}{cumulativeList?.slice(-1)}%</strong> cumulative return.
Following Jim Cramer's stock picks since {rawData?.slice(0)?.at(0)?.date}, would have yielded a <strong class="{cumulativeList?.slice(-1) > 0 ? 'text-[#00FC50]' : 'text-[#FF2F1F]'}">{cumulativeList?.slice(-1) > 0 ? '+' : ''}{cumulativeList?.slice(-1)}%</strong> cumulative return.
</Card.Description>
</Card.Header>
<Card.Content class="w-full h-fit">
@ -492,11 +492,11 @@ rawData?.forEach(item => {
</td>
<td class="text-sm sm:text-[1rem] whitespace-nowrap {(['Bullish', 'Buy'].includes(item?.sentiment) || item?.sentiment?.includes('Buy')) ? 'text-[#30B170]' : (['Bearish', 'Sell','Trim'].includes(item?.sentiment) || item?.sentiment?.includes('Sell') === 'Bearish') ? 'text-[#FC2120]' : 'text-[#C6A755]'} text-center">
<td class="text-sm sm:text-[1rem] whitespace-nowrap {(['Bullish', 'Buy'].includes(item?.sentiment) || item?.sentiment?.includes('Buy')) ? 'text-[#37C97D]' : (['Bearish', 'Sell','Trim'].includes(item?.sentiment) || item?.sentiment?.includes('Sell') === 'Bearish') ? 'text-[#FF2F1F]' : 'text-[#C6A755]'} text-center">
{item?.sentiment}
</td>
<td class="text-sm sm:text-[1rem] {item?.returnSince >= 0 ? 'text-[#30B170]' : 'text-[#FC2120]'} text-end">
<td class="text-sm sm:text-[1rem] {item?.returnSince >= 0 ? 'text-[#37C97D]' : 'text-[#FF2F1F]'} text-end">
{item?.returnSince > 0 ? '+' : ''}{item?.returnSince}%
</td>

6
src/routes/etf/[tickerID]/options/+page.svelte
View File

@ -877,7 +877,7 @@ $: {
{abbreviateNumber(item?.total_volume_call)}
</td>
<td class="whitespace-nowrap text-sm sm:text-[1rem] {item?.put_call === 'Calls' ? 'text-[#00FC50]' : 'text-[#FC2120]'} text-end">
<td class="whitespace-nowrap text-sm sm:text-[1rem] {item?.put_call === 'Calls' ? 'text-[#00FC50]' : 'text-[#FF2F1F]'} text-end">
<div class="rounded-lg w-fit px-2 text-center font-semibold badge gap-2 bg-[#FBCE3C] text-black m-auto flex justify-center items-center">
{item?.strike_price}
</div>
@ -1005,11 +1005,11 @@ $: {
{item?.strike_price}
</td>
<td class="text-sm sm:text-[1rem] {item?.put_call === 'Calls' ? 'text-[#00FC50]' : 'text-[#FC2120]'} text-start">
<td class="text-sm sm:text-[1rem] {item?.put_call === 'Calls' ? 'text-[#00FC50]' : 'text-[#FF2F1F]'} text-start">
{item?.put_call}
</td>
<td class="text-sm sm:text-[1rem] {item?.sentiment === 'Bullish' ? 'text-[#00FC50]' : item?.sentiment === 'Bearish' ? 'text-[#FC2120]' : 'text-[#C6A755]'} text-start">
<td class="text-sm sm:text-[1rem] {item?.sentiment === 'Bullish' ? 'text-[#00FC50]' : item?.sentiment === 'Bearish' ? 'text-[#FF2F1F]' : 'text-[#C6A755]'} text-start">
{item?.sentiment}
</td>
<td class="text-sm sm:text-[1rem] text-white text-start whitespace-nowrap">

8
src/routes/hedge-funds/[slug]/+page.svelte
View File

@ -926,7 +926,7 @@ onMount(async () => {
</td>
{#if changeAssetType === 'Stocks'}
<td class="text-center text-sm sm:text-[1rem] whitespace-nowrap border-b border-b-[#27272A] {item?.changeInSharesNumberPercentage > 0 ? 'text-[#00FC50]' : item?.changeInSharesNumberPercentage < 0 ? 'text-[#FC2120]' : 'text-white'}">
<td class="text-center text-sm sm:text-[1rem] whitespace-nowrap border-b border-b-[#27272A] {item?.changeInSharesNumberPercentage > 0 ? 'text-[#00FC50]' : item?.changeInSharesNumberPercentage < 0 ? 'text-[#FF2F1F]' : 'text-white'}">
{item?.changeInSharesNumberPercentage !== 0 ? abbreviateNumber(item?.changeInSharesNumberPercentage?.toFixed(2))+'%' : '-'}
</td>
@ -944,7 +944,7 @@ onMount(async () => {
${item?.avgPricePaid}
</td>
{#if changeAssetType === 'Options'}
<td class="text-end text-sm sm:text-[1rem] whitespace-nowrap border-b border-b-[#27272A] {item?.putCallShare === 'CALL' ? 'text-[#00FC50]' : 'text-[#FC2120]'}">
<td class="text-end text-sm sm:text-[1rem] whitespace-nowrap border-b border-b-[#27272A] {item?.putCallShare === 'CALL' ? 'text-[#00FC50]' : 'text-[#FF2F1F]'}">
{formatString(item?.putCallShare)}
</td>
{/if}
@ -1034,7 +1034,7 @@ onMount(async () => {
</td>
{#if changeAssetType === 'Stocks'}
<td class="text-end text-sm font-semibold border-b border-b-[#09090B] {item?.changeInSharesNumberPercentage > 0 ? 'text-[#00FC50]' : item?.changeInSharesNumberPercentage < 0 ? 'text-[#FC2120]' : 'text-white'}">
<td class="text-end text-sm font-semibold border-b border-b-[#09090B] {item?.changeInSharesNumberPercentage > 0 ? 'text-[#00FC50]' : item?.changeInSharesNumberPercentage < 0 ? 'text-[#FF2F1F]' : 'text-white'}">
{item?.changeInSharesNumberPercentage !== 0 ? abbreviateNumber(item?.changeInSharesNumberPercentage?.toFixed(2))+'%' : '-'}
</td>
<td class="text-end text-sm font-semibold border-b border-b-[#09090B] text-white">
@ -1050,7 +1050,7 @@ onMount(async () => {
${item?.avgPricePaid}
</td>
{#if changeAssetType === 'Options'}
<td class="text-end text-sm font-semibold border-b border-b-[#09090B] {item?.putCallShare === 'CALL' ? 'text-[#00FC50]' : 'text-[#FC2120]'}">
<td class="text-end text-sm font-semibold border-b border-b-[#09090B] {item?.putCallShare === 'CALL' ? 'text-[#00FC50]' : 'text-[#FF2F1F]'}">
{formatString(item?.putCallShare)}
</td>
{/if}

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

@ -1206,7 +1206,7 @@ function sortData(key) {
<div class="flex flex-row items-center flex-wrap w-full px-5 bg-[#262626] shadow-lg rounded-md h-20">
<div class="flex flex-col items-start">
<span class="font-semibold text-gray-200 text-sm sm:text-[1rem] ">Flow Sentiment</span>
<span class="text-start text-[1rem] font-semibold {flowSentiment === 'Bullish' ? 'text-[#00FC50]' : flowSentiment === 'Bearish' ? 'text-[#FC2120]' : flowSentiment === 'Neutral' ? 'text-[#FBCE3C]' : 'text-white'}">{flowSentiment}</span>
<span class="text-start text-[1rem] font-semibold {flowSentiment === 'Bullish' ? 'text-[#00FC50]' : flowSentiment === 'Bearish' ? 'text-[#FF2F1F]' : flowSentiment === 'Neutral' ? 'text-[#FBCE3C]' : 'text-white'}">{flowSentiment}</span>
</div>
</div>
@ -1485,11 +1485,11 @@ function sortData(key) {
{displayedData[index]?.strike_price}
</div>
<div style="justify-content: center;" class="td text-sm sm:text-[1rem] {displayedData[index]?.put_call === 'Calls' ? 'text-[#00FC50]' : 'text-[#FC2120]'} text-start">
<div style="justify-content: center;" class="td text-sm sm:text-[1rem] {displayedData[index]?.put_call === 'Calls' ? 'text-[#00FC50]' : 'text-[#FF2F1F]'} text-start">
{displayedData[index]?.put_call}
</div>
<div style="justify-content: center;" class="td text-sm sm:text-[1rem] {displayedData[index]?.sentiment === 'Bullish' ? 'text-[#00FC50]' : displayedData[index]?.sentiment === 'Bearish' ? 'text-[#FC2120]' : 'text-[#C6A755]'} text-start">
<div style="justify-content: center;" class="td text-sm sm:text-[1rem] {displayedData[index]?.sentiment === 'Bullish' ? 'text-[#00FC50]' : displayedData[index]?.sentiment === 'Bearish' ? 'text-[#FF2F1F]' : 'text-[#C6A755]'} text-start">
{displayedData[index]?.sentiment}
</div>

6
src/routes/reddit-tracker/+page.svelte
View File

@ -493,14 +493,14 @@ const optionCompanySpread = {
</Table.Cell>
<Table.Cell class="text-right text-[1rem]">{item?.count}</Table.Cell>
<Table.Cell class="text-right text-[1rem] text-[#00FC50]">{item?.call}</Table.Cell>
<Table.Cell class="text-right text-[1rem] text-[#FC2120]">{item?.put}</Table.Cell>
<Table.Cell class="text-right text-[1rem] {item?.avgSentiment > 0.4 ? 'text-[#00FC50]' : item?.avgSentiment <-0.1 ? 'text-[#FC2120]' : 'text-[#C6A755]'} ">{item?.avgSentiment > 0.4 ? 'Bullish' : item?.avgSentiment <= -0.1 ? 'Bearish' : 'Neutral'}</Table.Cell>
<Table.Cell class="text-right text-[1rem] text-[#FF2F1F]">{item?.put}</Table.Cell>
<Table.Cell class="text-right text-[1rem] {item?.avgSentiment > 0.4 ? 'text-[#00FC50]' : item?.avgSentiment <-0.1 ? 'text-[#FF2F1F]' : 'text-[#C6A755]'} ">{item?.avgSentiment > 0.4 ? 'Bullish' : item?.avgSentiment <= -0.1 ? 'Bearish' : 'Neutral'}</Table.Cell>
<Table.Cell>
<div class="flex flex-row justify-end items-center text-[1rem]">
<div class="flex flex-col mt-3">
<span class="text-white ml-auto">${item.price?.toFixed(2)}</span>
<span class="{item?.changesPercentage > 0 ? 'text-[#00FC50]' : 'text-[#FC2120]'} font-semibold text-end">
<span class="{item?.changesPercentage > 0 ? 'text-[#00FC50]' : 'text-[#FF2F1F]'} font-semibold text-end">
{#if item?.changesPercentage > 0 }
+{item?.changesPercentage?.toFixed(2)}%
{:else}

4
src/routes/sentiment-tracker/+page.svelte
View File

@ -253,11 +253,11 @@ async function handleScroll() {
{item?.price}
</td>
<td class="text-sm sm:text-[1rem] whitespace-nowrap {item?.changesPercentage >= 0 ? 'text-[#30B170]' : 'text-[#FC2120]'} text-end">
<td class="text-sm sm:text-[1rem] whitespace-nowrap {item?.changesPercentage >= 0 ? 'text-[#37C97D]' : 'text-[#FF2F1F]'} text-end">
{item?.changesPercentage > 0 ? '+' : ''}{item?.changesPercentage}%
</td>
<td class="text-end text-sm sm:text-[1rem] font-medium whitespace-nowrap {item?.sentiment >= 55 ? 'text-[#37C97D]' : item?.sentiment >= 50 ? 'text-[#E57C34]' : 'text-[#FC2120]'}">
<td class="text-end text-sm sm:text-[1rem] font-medium whitespace-nowrap {item?.sentiment >= 55 ? 'text-[#37C97D]' : item?.sentiment >= 50 ? 'text-[#E57C34]' : 'text-[#FF2F1F]'}">
<div class="flex flex-row items-center justify-end">
<div class="">{item?.sentiment >= 80 ? 'Very Bullish' : item?.sentiment >= 55 ? 'Bullish' : item?.sentiment > 50 ? 'Mixed' : 'Bearish'}</div>

6
src/routes/stocks/[tickerID]/options/+page.svelte
View File

@ -877,7 +877,7 @@ $: {
{abbreviateNumber(item?.total_volume_call)}
</td>
<td class="whitespace-nowrap text-sm sm:text-[1rem] {item?.put_call === 'Calls' ? 'text-[#00FC50]' : 'text-[#FC2120]'} text-end">
<td class="whitespace-nowrap text-sm sm:text-[1rem] {item?.put_call === 'Calls' ? 'text-[#00FC50]' : 'text-[#FF2F1F]'} text-end">
<div class="rounded-lg w-fit px-2 text-center font-semibold badge gap-2 bg-[#FBCE3C] text-black m-auto flex justify-center items-center">
{item?.strike_price}
</div>
@ -1005,11 +1005,11 @@ $: {
{item?.strike_price}
</td>
<td class="text-sm sm:text-[1rem] {item?.put_call === 'Calls' ? 'text-[#00FC50]' : 'text-[#FC2120]'} text-start">
<td class="text-sm sm:text-[1rem] {item?.put_call === 'Calls' ? 'text-[#00FC50]' : 'text-[#FF2F1F]'} text-start">
{item?.put_call}
</td>
<td class="text-sm sm:text-[1rem] {item?.sentiment === 'Bullish' ? 'text-[#00FC50]' : item?.sentiment === 'Bearish' ? 'text-[#FC2120]' : 'text-[#C6A755]'} text-start">
<td class="text-sm sm:text-[1rem] {item?.sentiment === 'Bullish' ? 'text-[#00FC50]' : item?.sentiment === 'Bearish' ? 'text-[#FF2F1F]' : 'text-[#C6A755]'} text-start">
{item?.sentiment}
</td>
<td class="text-sm sm:text-[1rem] text-white text-start whitespace-nowrap">

4
src/routes/watchlist/options/+page.svelte
View File

@ -262,11 +262,11 @@ onMount(async () => {
{item?.strike_price}
</td>
<td class="text-sm sm:text-[1rem] {item?.put_call === 'Calls' ? 'text-[#00FC50]' : 'text-[#FC2120]'} text-start">
<td class="text-sm sm:text-[1rem] {item?.put_call === 'Calls' ? 'text-[#00FC50]' : 'text-[#FF2F1F]'} text-start">
{item?.put_call}
</td>
<td class="text-sm sm:text-[1rem] {item?.sentiment === 'Bullish' ? 'text-[#00FC50]' : item?.sentiment === 'Bearish' ? 'text-[#FC2120]' : 'text-[#C6A755]'} text-start">
<td class="text-sm sm:text-[1rem] {item?.sentiment === 'Bullish' ? 'text-[#00FC50]' : item?.sentiment === 'Bearish' ? 'text-[#FF2F1F]' : 'text-[#C6A755]'} text-start">
{item?.sentiment}
</td>
<td class="text-sm sm:text-[1rem] text-white text-start whitespace-nowrap">