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-06-20 09:55:55 +02:00
parent 6506a730e8
commit cccdcd7cd3
6 changed files with 41 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -208,7 +208,7 @@ $: {
</div>
</div>
<div class="pb-2 sm:pb-2 rounded-lg bg-[#0F0F0F]">
<div class="pb-2 rounded-lg bg-[#0F0F0F]">
<Lazy height={300} fadeOption={{delay: 100, duration: 500}} keep={true}>

7
src/lib/components/Enterprise.svelte
View File

@ -71,8 +71,9 @@ function getPlotOptions() {
animation: $screenWidth < 640 ? false: true,
grid: {
left: $screenWidth < 640 ? '0%' : '2%',
right: $screenWidth < 640 ? '5%' : '2%',
right: $screenWidth < 640 ? '2%' : '2%',
bottom: $screenWidth < 640 ? '0%' : '2%',
top: '5%',
containLabel: true
},
xAxis: {
@ -195,7 +196,7 @@ $: {
{#if data?.user?.tier === 'Pro'}
{#if isLoaded}
{#if rawData?.length !== 0}
<div class="p-3 sm:p-0 mt-2 pb-8 sm:pb-2 rounded-lg bg-[#202020] sm:bg-[#0F0F0F]">
<div class="mt-2 pb-4">
<div class="w-full flex flex-col items-start">
<div class="text-white text-sm sm:text-[1rem] mt-1 sm:mt-3 mb-1 w-full">
@ -208,7 +209,7 @@ $: {
</a>
<Lazy height={300} fadeOption={{delay: 100, duration: 500}} keep={true}>
<div class="app w-full h-[300px] ">
<div class="app w-full h-[300px] mt-5">
<Chart options={optionsData} class="chart" />
</div>
</Lazy>

13
src/lib/components/RetailVolume.svelte
View File

@ -72,9 +72,10 @@ function getPlotOptions() {
silent: true,
animation: $screenWidth < 640 ? false: true,
grid: {
left: '2%',
right: '2%',
left: '0%',
right: '0%',
bottom: '0%',
top: '5%',
containLabel: true
},
xAxis: {
@ -234,7 +235,7 @@ $: {
<div class="w-full flex flex-col items-start">
<div class="text-white text-sm sm:text-[1rem] mt-2 mb-2 w-full">
In the past six months, the {$displayCompanyName} had an average retail investor volume of <span class="font-semibold">{abbreviateNumber(avgVolume,true)}</span>, with a prevailing
In the past six months, the {$displayCompanyName} had an average retail investor volume of <span class="font-semibold">{avgVolume > 100e3 ? abbreviateNumber(avgVolume,true) : '< $100K'}</span>, with a prevailing
{#if avgSentiment === 'Bullish' }
<span class="text-[#10DB06]">
<svg class="w-6 h-6 sm:w-7 sm:h-7 inline-block" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g fill="none" stroke="#10db06" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5"><path d="m3 17l6-6l4 4l8-8"/><path d="M17 7h4v4"/></g></svg>
@ -259,7 +260,7 @@ $: {
<Lazy height={300} fadeOption={{delay: 100, duration: 500}} keep={true}>
<div class="app w-full h-[300px] ">
<div class="app w-full h-[300px] mt-5">
<Chart options={optionsData} class="chart" />
</div>
</Lazy>
@ -271,7 +272,7 @@ $: {
Latest Information
</h2>
<span class="text-white">
On {new Date(rawData?.lastDate)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })}, retail traders accounted for <span class="font-semibold">{rawData?.retailStrength}%</span> of the trading volume.
On {new Date(rawData?.lastDate)?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })}, retail traders accounted for <span class="font-semibold">{rawData?.retailStrength > 0.01 ? rawData?.retailStrength : '< 0.01'}%</span> of the trading volume.
</span>
<div class="flex justify-start items-center w-full m-auto mt-6 ">
<table class="w-full" data-test="statistics-table">
@ -289,7 +290,7 @@ $: {
<span>Volume</span>
</td>
<td class="px-[5px] py-1.5 text-right font-medium xs:px-2.5 xs:py-2">
{abbreviateNumber(rawData?.lastTrade,true)}
{rawData?.lastTrade > 100e3 ? abbreviateNumber(rawData?.lastTrade,true) : '< $100K'}
</td>
</tr>
<tr class="border-y border-gray-800 odd:bg-[#202020]">

2
src/lib/components/RevenueSegmentation.svelte
View File

@ -235,7 +235,7 @@ $: {
{#if isLoaded}
{#if Object?.keys(data)?.length !== 0 && totalProductRevenue !== 0}
<div class="p-3 sm:p-0 mt-2 pb-8 sm:pb-2 rounded-lg bg-[#202020] sm:bg-[#0F0F0F]">
<div class="mt-2 pb-4">
<div class="text-white text-md mt-3 w-full mb-5">
Based on the latest earnings report
the main contributors of revenue are:

9
src/lib/components/ShareStatistics.svelte
View File

@ -64,9 +64,10 @@ function getPlotOptions() {
silent: true,
animation: $screenWidth < 640 ? false: true,
grid: {
left: $screenWidth < 640 ? '0%' : '2%',
right: $screenWidth < 640 ? '5%' : '2%',
left: $screenWidth < 640 ? '1%' : '2%',
right: $screenWidth < 640 ? '0%' : '2%',
bottom: $screenWidth < 640 ? '0%' : '2%',
top: '5%',
containLabel: true
},
xAxis: {
@ -175,7 +176,7 @@ $: {
{#if isLoaded}
{#if Object?.keys(rawData)?.length !== 0}
<div class="p-3 sm:p-0 mt-2 pb-8 sm:pb-2 rounded-lg bg-[#202020] sm:bg-[#0F0F0F]">
<div class="mt-2 pb-4 bg-[#0F0F0F]">
<div class="w-full flex flex-col items-start">
<div class="text-white text-sm sm:text-[1rem] mt-1 sm:mt-3 mb-1 w-full">
@ -185,7 +186,7 @@ $: {
<Lazy height={300} fadeOption={{delay: 100, duration: 500}} keep={true}>
<div class="app w-full h-[300px] ">
<div class="app w-full h-[300px] mt-6">
<Chart options={optionsData} class="chart" />
</div>
</Lazy>

29
src/routes/community/profile/+page.svelte
View File

@ -7,7 +7,7 @@
import { onMount, onDestroy } from 'svelte';
import {getImageURL } from '$lib/utils';
import {screenWidth, userRegion, setCache, getCache, newAvatar, clientSideCache, numberOfUnreadNotification, postIdDeleted } from '$lib/store';
import {userRegion, setCache, getCache, newAvatar, numberOfUnreadNotification, postIdDeleted } from '$lib/store';
import toast from 'svelte-french-toast';
import InfiniteLoading from '$lib/components/InfiniteLoading.svelte';
@ -499,6 +499,18 @@ const changeTab = (state) => {
}
};
// Function to add days to a given date
function addDays(days) {
// Original date from the data object
const createdDate = new Date(data?.user?.created);
const result = new Date(createdDate);
result.setDate(result.getDate() + days);
return result;
}
const trialEndDate = addDays(7);
onMount(async () => {
@ -548,7 +560,6 @@ onDestroy(async () => {
<!-- Other meta tags -->
<meta property="og:title" content="{data?.user?.username} · stocknear"/>
<meta property="og:description" content="Explore {data?.user?.username}'s latest posts, comments, and notebooks on stocknear. Discover new insights and connect with other users in the stocknear community.">
<meta property="og:image" content="https://stocknear-pocketbase.s3.amazonaws.com/logo/meta_logo.jpg"/>
<meta property="og:type" content="website"/>
<!-- Add more Open Graph meta tags as needed -->
@ -556,7 +567,6 @@ onDestroy(async () => {
<meta name="twitter:card" content="summary_large_image"/>
<meta name="twitter:title" content="{data?.user?.username} · stocknear"/>
<meta name="twitter:description" content="Explore {data?.user?.username}'s latest posts, comments, and notebooks on stocknear. Discover new insights and connect with other users in the stocknear community.">
<meta name="twitter:image" content="https://stocknear-pocketbase.s3.amazonaws.com/logo/meta_logo.jpg"/>
<!-- Add more Twitter meta tags as needed -->
</svelte:head>
@ -887,12 +897,16 @@ onDestroy(async () => {
<div class="ml-2 flex flex-row items-center">
<span class="relative flex h-2 w-2 ">
<span class="animate-ping absolute inline-flex h-full w-full rounded-full {subscriptionData?.status_formatted === 'Active' || subscriptionData?.status_formatted === 'Paid' || subscriptionData?.status_formatted === 'On Trial' ? 'bg-[#10DB06]' : 'bg-[#FF3131]'} opacity-75"></span>
<span class="relative inline-flex rounded-full h-2 w-2 {subscriptionData?.status_formatted === 'Active' || subscriptionData?.status_formatted === 'Paid' || subscriptionData?.status_formatted === 'On Trial' ? 'bg-[#10DB06]' : 'bg-[#FF3131]'}"></span>
<span class="animate-ping absolute inline-flex h-full w-full rounded-full {subscriptionData?.status_formatted === 'Active' || subscriptionData?.status_formatted === 'Paid' || subscriptionData?.status_formatted === 'On Trial' || data?.user?.freeTrial === true ? 'bg-[#10DB06]' : 'bg-[#FF3131]'} opacity-75"></span>
<span class="relative inline-flex rounded-full h-2 w-2 {subscriptionData?.status_formatted === 'Active' || subscriptionData?.status_formatted === 'Paid' || subscriptionData?.status_formatted === 'On Trial' || data?.user?.freeTrial === true ? 'bg-[#10DB06]' : 'bg-[#FF3131]'}"></span>
</span>
<span class="ml-2 text-[1rem] text-slate-200 font-medium">
{#if data?.user?.freeTrial === true}
Active
{:else}
{subscriptionData?.status_formatted ?? 'Inactive'}
{/if}
</span>
</div>
@ -905,6 +919,8 @@ onDestroy(async () => {
<span class="text-white text-sm font-medium pr-5">
Your trial will end on {new Date(subscriptionData?.trial_ends_at)?.toLocaleDateString('en-GB', { day: 'numeric', month: 'long', year: 'numeric' })}.
</span>
{:else if data?.user?.freeTrial === true}
Your trial will end on {trialEndDate?.toLocaleDateString('en-GB', { day: 'numeric', month: 'long', year: 'numeric' })}.
{:else if subscriptionData?.status_formatted === 'Cancelled'}
<span class="text-white text-sm font-medium">
Your subscription will remain active until {new Date(subscriptionData?.ends_at)?.toLocaleDateString('en-GB', { day: 'numeric', month: 'long', year: 'numeric' })}
@ -917,7 +933,7 @@ onDestroy(async () => {
Current Plan:
</span>
<span class="text-[1rem]">
{['Active', 'Paid', 'On Trial', 'Cancelled']?.includes(subscriptionData?.status_formatted) ? subscriptionData?.product_name : 'Free Subscription'}
{['Active', 'Paid', 'On Trial', 'Cancelled']?.includes(subscriptionData?.status_formatted) ? subscriptionData?.product_name : data?.user?.freeTrial === true ? 'Free Trial Subscription' : 'Free Subscription'}
</span>
<span class="text-sm text-white {subscriptionData?.status_formatted !== 'Active' ? 'hidden' : ''}">
{subscriptionData?.product_name?.includes('Monthly') ? '$9.99 billed every month' : '$90 billed every year'}
@ -945,6 +961,7 @@ onDestroy(async () => {
<span class="text-white mt-5">
Please wait a moment; you will be updated to Pro in a second.
</span>
{:else if data?.user?.freeTrial}
{:else}
<a href="/pricing" class="text-blue-400 mt-5">
Get Full Access with Pro Subscription.