ui fixes
This commit is contained in:
parent
76cfc894dc
commit
8c834fcca7
@ -61,7 +61,7 @@ export const actions = {
|
|||||||
error(err.status, err.message);
|
error(err.status, err.message);
|
||||||
}
|
}
|
||||||
|
|
||||||
redirect(301, "/");
|
redirect(301, "/profile");
|
||||||
},
|
},
|
||||||
|
|
||||||
oauth2: async ({ url, locals, request, cookies }) => {
|
oauth2: async ({ url, locals, request, cookies }) => {
|
||||||
|
|||||||
@ -1,6 +1,5 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { abbreviateNumber } from "$lib/utils";
|
import { abbreviateNumber } from "$lib/utils";
|
||||||
import ArrowLogo from "lucide-svelte/icons/move-up-right";
|
|
||||||
|
|
||||||
export let data;
|
export let data;
|
||||||
const similarStocks = data?.getSimilarStocks;
|
const similarStocks = data?.getSimilarStocks;
|
||||||
@ -96,9 +95,8 @@
|
|||||||
>
|
>
|
||||||
Pro Subscription
|
Pro Subscription
|
||||||
</h2>
|
</h2>
|
||||||
<ArrowLogo class="w-6 h-6 sm:w-8 sm:h-8 mr-3 flex-shrink-0" />
|
|
||||||
</div>
|
</div>
|
||||||
<span class="text-white p-3 sm:ml-3 sm:mr-3">
|
<span class="text-white p-3 sm:ml-3 sm:mr-3 -mt-4">
|
||||||
Upgrade now for unlimited access to all data and tools.
|
Upgrade now for unlimited access to all data and tools.
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
@ -115,7 +113,7 @@
|
|||||||
Market Capitalization
|
Market Capitalization
|
||||||
</h2>
|
</h2>
|
||||||
</div>
|
</div>
|
||||||
<span class="text-white">
|
<div class="text-white mt-3">
|
||||||
Market capitalization, also called net worth, is the total
|
Market capitalization, also called net worth, is the total
|
||||||
value of all of a company's outstanding shares. It is
|
value of all of a company's outstanding shares. It is
|
||||||
calculated by multiplying the stock price by the number of
|
calculated by multiplying the stock price by the number of
|
||||||
@ -123,7 +121,7 @@
|
|||||||
<br />
|
<br />
|
||||||
<br />
|
<br />
|
||||||
Formula: Market Cap = Stock Price * Shares Outstanding
|
Formula: Market Cap = Stock Price * Shares Outstanding
|
||||||
</span>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -431,33 +431,32 @@
|
|||||||
/>
|
/>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
class="mb-4 mt-5 bg-inherit flex flex-col divide-y divide-gray-600 rounded-md border border-gray-600 sm:grid sm:grid-cols-3 sm:divide-x sm:divide-y-0"
|
class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 mb-6"
|
||||||
>
|
>
|
||||||
<div class="px-4 py-3 sm:px-2 sm:py-5 md:px-3 lg:p-6">
|
|
||||||
<div class="flex items-center justify-between sm:block">
|
|
||||||
<div class="text-[1rem] font-semibold text-white">
|
|
||||||
Market Cap
|
|
||||||
</div>
|
|
||||||
<div
|
<div
|
||||||
class="mt-1 break-words font-semibold leading-8 text-white text-xl sm:text-2xl"
|
class="bg-gray-800/30 rounded-lg p-4 sm:hover:bg-gray-800/40 transition-colors"
|
||||||
|
>
|
||||||
|
<div class="text-[#c3c6d0] text-sm mb-2 flex items-center">
|
||||||
|
<span>Market Cap</span>
|
||||||
|
<span class="ml-1 text-violet-400">●</span>
|
||||||
|
</div>
|
||||||
|
<div class="flex items-baseline">
|
||||||
|
<span class="text-2xl font-bold text-white">
|
||||||
|
{abbreviateNumber(data?.getStockQuote?.marketCap)}</span
|
||||||
>
|
>
|
||||||
{@html abbreviateNumber(
|
|
||||||
data?.getStockQuote?.marketCap,
|
|
||||||
false,
|
|
||||||
true,
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
<div class="px-4 py-3 sm:px-2 sm:py-5 md:px-3 lg:p-6">
|
|
||||||
<div class="flex items-center justify-between sm:block">
|
|
||||||
<div class="text-[1rem] font-semibold text-white">
|
|
||||||
Category
|
|
||||||
</div>
|
|
||||||
<div
|
<div
|
||||||
class="mt-1 break-words font-semibold leading-8 text-white text-xl sm:text-2xl"
|
class="bg-gray-800/30 rounded-lg p-4 sm:hover:bg-gray-800/40 transition-colors"
|
||||||
>
|
>
|
||||||
{#if capCategory}
|
<div class="text-[#c3c6d0] text-sm mb-2 flex items-center">
|
||||||
|
<span>Category</span>
|
||||||
|
<span class="ml-1 text-red-400">●</span>
|
||||||
|
</div>
|
||||||
|
<div class="flex items-baseline">
|
||||||
|
<span class="text-2xl font-bold text-white"
|
||||||
|
>{#if capCategory}
|
||||||
<a
|
<a
|
||||||
class="sm:hover:text-white text-blue-400"
|
class="sm:hover:text-white text-blue-400"
|
||||||
href={capCategory.link}
|
href={capCategory.link}
|
||||||
@ -466,29 +465,37 @@
|
|||||||
</a>
|
</a>
|
||||||
{:else}
|
{:else}
|
||||||
n/a
|
n/a
|
||||||
{/if}
|
{/if}</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
<div class="px-4 py-3 sm:px-2 sm:py-5 md:px-3 lg:p-6">
|
|
||||||
<div class="flex items-center justify-between sm:block">
|
|
||||||
<div class="text-[1rem] font-semibold text-white">
|
|
||||||
1-Year Change
|
|
||||||
</div>
|
|
||||||
<div
|
<div
|
||||||
class="mt-1 break-words font-semibold leading-8 text-[1rem] sm:text-lg {changePercentageYearAgo >=
|
class="bg-gray-800/30 rounded-lg p-4 sm:hover:bg-gray-800/40 transition-colors"
|
||||||
0 && changePercentageYearAgo !== null
|
>
|
||||||
|
<div class="text-[#c3c6d0] text-sm mb-2 flex items-center">
|
||||||
|
<span>1-Year Change</span>
|
||||||
|
<span class="ml-1">●</span>
|
||||||
|
</div>
|
||||||
|
<div class="flex items-baseline">
|
||||||
|
<span class="text-2xl font-bold text-white"
|
||||||
|
>{changePercentageYearAgo > 100
|
||||||
|
? "> 100"
|
||||||
|
: changePercentageYearAgo?.toFixed(1)}%</span
|
||||||
|
>
|
||||||
|
<div class="flex flex-col ml-2">
|
||||||
|
<span
|
||||||
|
class="text-sm {changePercentageYearAgo >= 0 &&
|
||||||
|
changePercentageYearAgo !== null
|
||||||
? "before:content-['+'] text-[#00FC50]"
|
? "before:content-['+'] text-[#00FC50]"
|
||||||
: changePercentageYearAgo < 0 &&
|
: changePercentageYearAgo < 0 &&
|
||||||
changePercentageYearAgo !== null
|
changePercentageYearAgo !== null
|
||||||
? 'text-[#FF2F1F]'
|
? 'text-[#FF2F1F]'
|
||||||
: 'text-white'}"
|
: 'text-white'}"
|
||||||
>
|
>
|
||||||
{changePercentageYearAgo !== null
|
{changePercentageYearAgo >= 0 ? "Positive" : "Negative"}
|
||||||
? abbreviateNumber(
|
Trend
|
||||||
changePercentageYearAgo?.toFixed(2),
|
</span>
|
||||||
) + "%"
|
|
||||||
: "n/a"}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user