resize etf page
This commit is contained in:
parent
e014b94b1b
commit
e50dcc7deb
10
src/app.css
10
src/app.css
@ -53,10 +53,14 @@
|
||||
}
|
||||
|
||||
.no-scrollbar {
|
||||
-ms-overflow-style: none; /* IE and Edge */
|
||||
scrollbar-width: none; /* Firefox */
|
||||
-ms-overflow-style: none; /* IE and Edge */
|
||||
scrollbar-width: none; /* Firefox */
|
||||
overflow: -moz-scrollbars-none; /* Legacy support for older Firefox versions */
|
||||
}
|
||||
|
||||
.no-scrollbar::-webkit-scrollbar {
|
||||
display: none; /* Chrome, Safari, and other WebKit-based browsers */
|
||||
}
|
||||
|
||||
|
||||
|
||||
.shake-ticker:hover img {
|
||||
|
||||
@ -74,8 +74,8 @@
|
||||
},
|
||||
animation: $screenWidth < 640 ? false: true,
|
||||
grid: {
|
||||
left: '2%',
|
||||
right: '4%',
|
||||
left: '1%',
|
||||
right: $screenWidth < 640 ? '2%' : '0%',
|
||||
bottom: '0%',
|
||||
top: '10%',
|
||||
containLabel: true
|
||||
|
||||
@ -586,19 +586,20 @@ $: {
|
||||
<!--End Mobile Navbar-->
|
||||
|
||||
|
||||
<div class="w-full xl:w-fit max-w-3xl sm:max-w-6xl m-auto px-3 sm:px-6">
|
||||
|
||||
<div class="md:flex md:justify-between md:divide-x md:divide-slate-800">
|
||||
<!-- Main content -->
|
||||
<div class="pb-12 md:pb-20 w-full max-w-3xl lg:max-w-2xl">
|
||||
<div class="md:pr-6 lg:pr-10">
|
||||
<div class="w-full xl:w-fit max-w-3xl sm:max-w-6xl m-auto px-3">
|
||||
|
||||
<div class="md:flex md:justify-between md:divide-x md:divide-slate-800">
|
||||
<!-- Main content -->
|
||||
<div class="pb-12 md:pb-20 w-full max-w-5xl lg:max-w-3xl">
|
||||
<div class="md:pr-6 lg:pr-10">
|
||||
|
||||
|
||||
|
||||
<!-----Start-Header-CandleChart-Indicators------>
|
||||
|
||||
<div class="m-auto pl-0 sm:pl-4 max-w-3xl overflow-hidden mb-5 md:mt-10">
|
||||
|
||||
|
||||
<div class="hidden sm:flex flex-row w-full justify-between items-center pb-10">
|
||||
|
||||
<Markethour />
|
||||
|
||||
<!--Start Watchlist-->
|
||||
@ -713,7 +714,7 @@ $: {
|
||||
|
||||
<!--<div class="w-full max-w-3xl sm:max-w-2xl m-auto pt-2 pb-5 sm:pl-3 sticky z-20 bg-[#0F0F0F]" style="top: {$screenWidth < 520 && $isScrollingUp ? '4rem' : '0rem'};">-->
|
||||
<div class="sm:ml-4 w-screen sm:w-full {$screenWidth < 640 ? 'overflow-auto scrollbar no-scrollbar' : ''} mb-2" >
|
||||
<ul class="pr-4 sm:pr-0 w-screen font-medium flex flex-row items-center bg-[#0F0F0F] overflow-x-scroll space-x-3 rtl:space-x-reverse py-2">
|
||||
<ul class="pr-4 sm:pr-0 w-screen font-medium flex flex-row items-center bg-[#0F0F0F] space-x-3 rtl:space-x-reverse py-2">
|
||||
<li class="cursor-pointer flex flex-col items-center">
|
||||
<a href={`/etf/${$etfTicker}`} id="item1" on:click={() => (changeSection('overview','item1'))} class="px-2 text-sm sm:text-[0.9rem] font-medium text-gray-400 sm:hover:text-white {displaySection === 'overview' ? 'text-white ' : 'bg-[#0F0F0F]'}" >
|
||||
Overview
|
||||
@ -750,7 +751,7 @@ $: {
|
||||
</a>
|
||||
<div class="{displaySection === 'congress-trading' ? 'bg-[#75D377]' : 'bg-[#0F0F0F]'} mt-1 h-[3px] rounded-full w-[3rem]" />
|
||||
</li>
|
||||
<li class="cursor-pointer flex flex-col items-center">
|
||||
<li class="cursor-pointer flex flex-col items-center pr-6">
|
||||
<a href={`/etf/${$etfTicker}/news`} id="item7" on:click={() => (changeSection('news','item7'))} class="px-2 text-sm sm:text-[0.9rem] font-medium text-gray-400 sm:hover:text-white {displaySection === 'news' ? 'text-white ' : 'bg-[#0F0F0F]'}" >
|
||||
News
|
||||
</a>
|
||||
|
||||
@ -756,7 +756,6 @@ async function initializePrice() {
|
||||
<!-- Other meta tags -->
|
||||
<meta property="og:title" content={`${$displayCompanyName} (${$etfTicker}) Stock Price, Quote & News · stocknear`}/>
|
||||
<meta property="og:description" content={`Get a real-time ${$displayCompanyName} (${$etfTicker}) stock price quote with breaking news, financials, statistics, charts and more.`} />
|
||||
<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 -->
|
||||
|
||||
@ -764,19 +763,20 @@ async function initializePrice() {
|
||||
<meta name="twitter:card" content="summary_large_image"/>
|
||||
<meta name="twitter:title" content={`${$displayCompanyName} (${$etfTicker}) Stock Price, Quote & News · stocknear`}/>
|
||||
<meta name="twitter:description" content={`Get a real-time ${$displayCompanyName} (${$etfTicker}) stock price quote with breaking news, financials, statistics, charts and more.`} />
|
||||
<meta name="twitter:image" content="https://stocknear-pocketbase.s3.amazonaws.com/logo/meta_logo.jpg"/>
|
||||
<!-- Add more Twitter meta tags as needed -->
|
||||
|
||||
</svelte:head>
|
||||
|
||||
|
||||
|
||||
<section class="bg-[#0F0F0F] min-h-screen pb-40">
|
||||
<div class="w-full xl:w-fit max-w-4xl m-auto ">
|
||||
<div class="md:flex md:justify-between md:divide-x md:divide-slate-800">
|
||||
<!-- Main content -->
|
||||
<div class="md:grow pb-12 md:pb-20 w-full max-w-2xl sm:pr-6">
|
||||
<div class="xl:pr-10">
|
||||
<section class="bg-[#0F0F0F] min-h-screen pb-40">
|
||||
|
||||
<div class="w-full max-w-4xl m-auto ">
|
||||
|
||||
|
||||
<div class="md:flex md:justify-between md:divide-x md:divide-slate-800">
|
||||
<!-- Main content -->
|
||||
<div class="pb-12 md:pb-20 w-full max-w-3xl sm:pr-6 xl:pr-0">
|
||||
<div class="xl:pr-10">
|
||||
|
||||
|
||||
<!-- svelte-ignore a11y-click-events-have-key-events -->
|
||||
@ -914,7 +914,7 @@ async function initializePrice() {
|
||||
<!-- Start Graph -->
|
||||
|
||||
{#if output !== null}
|
||||
<div class ="w-full max-w-[540px] md:max-w-[620px] lg:max-w-[570px] xl:max-w-[540px] ml-auto mb-4">
|
||||
<div class ="w-full sm:pl-7 ml-auto max-w-3xl mb-10">
|
||||
{#if displayData === '1D' && oneDayPrice?.length === 0}
|
||||
<h2 class=" mt-20 flex h-[240px] justify-center items-center text-3xl font-bold text-slate-700 mb-20 m-auto">
|
||||
No data available
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user