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

update layout of stock page

Browse Source
This commit is contained in:
MuslemRahimi 2024-12-25 17:12:30 +01:00
parent fd286269a1
commit f9662226be
3 changed files with 34 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/routes/+layout.svelte
View File

@ -824,7 +824,7 @@
<a href="/" class="-ml-2 flex flex-shrink-0"> <a href="/" class="-ml-2 flex flex-shrink-0">
<img <img
class="avatar w-9 xl:w-10 rounded-full" class="avatar w-9 3xl:w-10 rounded-full"
src={stocknear_logo} src={stocknear_logo}
alt="Stocknear Logo" alt="Stocknear Logo"
/> />
@ -834,7 +834,7 @@
<div <div
class="relative w-full flex flex-row justify-end sm:justify-between items-center" class="relative w-full flex flex-row justify-end sm:justify-between items-center"
> >
<div class="sm:w-full sm:ml-2 xl:ml-[75px]"> <div class="sm:w-full sm:ml-2 3xl:ml-[75px]">
<Searchbar /> <Searchbar />
</div> </div>
<NotificationBell {data} {hasUnreadElement} /> <NotificationBell {data} {hasUnreadElement} />
@ -912,19 +912,19 @@
</div> </div>
<div> <div>
<div class="flex w-full"> <div class="flex w-full">
<div class="hidden xl:block xl:w-[300px]"> <div class="hidden 3xl:block 3xl:w-[300px]">
<aside <aside
class="fixed overflow-y-auto scroller overflow-hidden inset-y-0 left-0 z-50 xl:flex w-64 flex-col xl:border-r xl:border-gray-800 bg-[#141417]" class="fixed overflow-y-auto scroller overflow-hidden inset-y-0 left-0 z-50 3xl:flex w-64 flex-col 3xl:border-r 3xl:border-gray-800 bg-[#141417]"
> >
<nav <nav
class="flex flex-col items-center mr-auto gap-y-4 xl:py-5 w-full" class="flex flex-col items-center mr-auto gap-y-4 3xl:py-5 w-full"
> >
<a <a
href="/" href="/"
class="ml-3 mb-5 flex justify-end items-center h-9 w-9 shrink-0 gap-2 rounded-full text-lg font-semibold text-primary-foreground md:h-10 md:w-10 md:text-base" class="ml-3 mb-5 flex justify-end items-center h-9 w-9 shrink-0 gap-2 rounded-full text-lg font-semibold text-primary-foreground md:h-10 md:w-10 md:text-base"
> >
<img <img
class="avatar w-9 xl:w-12 rounded-full" class="avatar w-9 3xl:w-12 rounded-full"
src={stocknear_logo} src={stocknear_logo}
alt="Stocknear Logo" alt="Stocknear Logo"
/> />

30
src/routes/stocks/[tickerID]/+layout.svelte
View File

@ -579,12 +579,10 @@
> >
<!-- Main content --> <!-- Main content -->
<div class="pb-12 md:pb-20 w-full"> <div class="pb-12 md:pb-20 w-full">
<div class="md:pr-6 lg:pr-10"> <div class="">
<!-----Start-Header-CandleChart-Indicators------> <!-----Start-Header-CandleChart-Indicators------>
<div <div class="m-auto pl-0 sm:pl-4 overflow-hidden mb-3">
class="m-auto pl-0 sm:pl-4 overflow-hidden mb-3 xl:pr-7"
>
<div <div
class="hidden sm:flex flex-row w-full justify-between items-center" class="hidden sm:flex flex-row w-full justify-between items-center"
> >
@ -709,20 +707,30 @@
</label> </label>
</div> </div>
<!--End Price Alert --> <!--End Price Alert -->
<div
class="hidden sm:flex items-end justify-end absolute right-0 top-12 {$scoreComponent ===
false
? 'invisible'
: ''}"
>
<AIScore
score={data?.getStockDeck?.score}
tier={data?.user?.tier}
/>
</div>
</div> </div>
<!-- svelte-ignore a11y-click-events-have-key-events --> <!-- svelte-ignore a11y-click-events-have-key-events -->
<!-- svelte-ignore a11y-label-has-associated-control --> <!-- svelte-ignore a11y-label-has-associated-control -->
<div class="flex items-center w-full mt-3"> <div class="flex items-center w-full mt-5">
<div <div
class="flex flex-row justify-start w-full items-center" class="flex flex-row justify-start w-full items-center"
> >
<div <div class="flex flex-col items-start w-full">
class="flex flex-col items-start ml-2 sm:ml-3 w-full"
>
<div <div
class="flex flex-row justify-between items-center w-full" class="flex flex-row justify-between items-center w-full sm:-mt-[50px] mb-5 sm:mb-10"
> >
<span <span
class="text-2xl lg:text-3xl font-bold text-white" class="text-2xl lg:text-3xl font-bold text-white"
@ -734,9 +742,9 @@
({$stockTicker?.toUpperCase()}) ({$stockTicker?.toUpperCase()})
</span> </span>
<div <div
class="items-end justify-end {$scoreComponent === class="sm:hidden items-end justify-end absolute right-3 top-14 {$scoreComponent ===
false false
? '-mt-8 invisible' ? 'invisible'
: ''}" : ''}"
> >
<AIScore <AIScore

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

@ -491,7 +491,6 @@
} }
} }
$: options = { $: options = {
width: width, width: width,
height: height, height: height,
@ -769,7 +768,7 @@
> >
<!-- Main content --> <!-- Main content -->
<div class="pb-12 md:pb-20 w-full sm:pr-6 xl:pr-0"> <div class="pb-12 md:pb-20 w-full sm:pr-6 xl:pr-0">
<div class="xl:pr-10"> <div class="">
<div <div
class="hidden sm:flex flex-row items-center pl-1 sm:pl-6 w-full mt-4" class="hidden sm:flex flex-row items-center pl-1 sm:pl-6 w-full mt-4"
> >
@ -1115,7 +1114,7 @@
class="mt-10 lg:mt-0 order-5 lg:order-1 flex flex-row space-x-2 sm:space-x-3 xs:space-x-4" class="mt-10 lg:mt-0 order-5 lg:order-1 flex flex-row space-x-2 sm:space-x-3 xs:space-x-4"
> >
<table <table
class="w-[50%] text-sm text-white sm:text-[1rem] lg:w-full lg:min-w-[210px]" class="w-[50%] text-sm text-white sm:text-[1rem] xl:min-w-[300px]"
> >
<tbody <tbody
><tr ><tr
@ -1137,7 +1136,11 @@
class="flex flex-col border-b border-gray-600 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-600 py-1 sm:table-row sm:py-0"
><td ><td
class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-2 text-[1rem]" class="whitespace-nowrap px-0.5 py-[1px] xs:px-1 sm:py-2 text-[1rem]"
><a href={`/stocks/${$stockTicker}/statistics/market-cap`} class="sm:hover:text-blue-400 text-white underline underline-offset-4">Market Cap</a></td ><a
href={`/stocks/${$stockTicker}/statistics/market-cap`}
class="sm:hover:text-blue-400 text-white underline underline-offset-4"
>Market Cap</a
></td
> >
<td <td
class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-2 sm:text-right sm:text-[1rem]" class="whitespace-nowrap px-0.5 py-[1px] text-left text-sm font-semibold xs:px-1 sm:py-2 sm:text-right sm:text-[1rem]"
@ -1235,9 +1238,7 @@
> >
</tbody> </tbody>
</table> </table>
<table <table class="w-[50%] text-sm text-white xl:min-w-[300px]">
class="w-[50%] text-sm text-white lg:w-auto lg:min-w-[210px]"
>
<tbody <tbody
><tr ><tr
class="flex flex-col border-b border-gray-600 py-1 sm:table-row sm:py-0" class="flex flex-col border-b border-gray-600 py-1 sm:table-row sm:py-0"
@ -1381,7 +1382,7 @@
</div> </div>
<div <div
class="w-full mt-10 sm:mt-0 m-auto sm:pl-6 sm:pb-6 {Object?.keys( class="w-full m-auto sm:pl-6 sm:pb-6 {Object?.keys(
data?.getNextEarnings || {}, data?.getNextEarnings || {},
)?.length !== 0 )?.length !== 0
? '' ? ''