add blog post back to website
This commit is contained in:
MuslemRahimi
parent
84c70cd287
commit
f4f68a2d6c
@ -92,6 +92,42 @@
|
||||
-->
|
||||
</div>
|
||||
|
||||
<div class="flex-1 mb-2 sm:mb-0">
|
||||
<p class="uppercase text-slate-100 md:mb-6">Sections</p>
|
||||
<ul class="list-reset mb-6">
|
||||
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
|
||||
<a
|
||||
href="/stocks"
|
||||
class="no-underline sm:hover:underline text-gray-100 sm:hover:text-blue-400"
|
||||
>Stocks</a
|
||||
>
|
||||
</li>
|
||||
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
|
||||
<a
|
||||
href="/etf"
|
||||
class="no-underline sm:hover:underline text-gray-100 sm:hover:text-blue-400"
|
||||
>ETFs</a
|
||||
>
|
||||
</li>
|
||||
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
|
||||
<a
|
||||
href="/blog"
|
||||
class="no-underline sm:hover:underline text-gray-100 sm:hover:text-blue-400"
|
||||
>Blog</a
|
||||
>
|
||||
</li>
|
||||
<!--
|
||||
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
|
||||
<a
|
||||
href="/donation"
|
||||
class="no-underline sm:hover:underline text-gray-100 sm:hover:text-blue-400"
|
||||
>Learning Center</a
|
||||
>
|
||||
</li>
|
||||
-->
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="flex-1 mb-2 sm:mb-0">
|
||||
<p class="uppercase text-slate-100 md:mb-6">Services</p>
|
||||
<ul class="list-reset mb-6">
|
||||
@ -104,9 +140,9 @@
|
||||
</li>
|
||||
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
|
||||
<a
|
||||
href="/advertise"
|
||||
href="/newsletter"
|
||||
class="no-underline sm:hover:underline text-gray-100 sm:hover:text-blue-400"
|
||||
>Advertise</a
|
||||
>Free Newsletter</a
|
||||
>
|
||||
</li>
|
||||
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
|
||||
@ -120,27 +156,28 @@
|
||||
</div>
|
||||
|
||||
<div class="flex-1 mb-2 sm:mb-0">
|
||||
<p class="uppercase text-slate-100 md:mb-6">Legal</p>
|
||||
<p class="uppercase text-slate-100 md:mb-6">Website</p>
|
||||
<ul class="list-reset mb-6">
|
||||
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
|
||||
<a
|
||||
href="/terms-of-use"
|
||||
href="/login"
|
||||
class="no-underline sm:hover:underline text-gray-100 sm:hover:text-blue-400"
|
||||
>Terms of Use</a
|
||||
>Login</a
|
||||
>
|
||||
</li>
|
||||
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
|
||||
<a
|
||||
href="/privacy-policy"
|
||||
href="/sitemap"
|
||||
class="no-underline sm:hover:underline text-gray-100 sm:hover:text-blue-400"
|
||||
>Privacy Policy</a
|
||||
>
|
||||
Sitemap
|
||||
</a>
|
||||
</li>
|
||||
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
|
||||
<a
|
||||
href="/imprint"
|
||||
href="/advertise"
|
||||
class="no-underline sm:hover:underline text-gray-100 sm:hover:text-blue-400"
|
||||
>Imprint</a
|
||||
>Advertise</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
@ -165,13 +202,27 @@
|
||||
Contact Us
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
|
||||
<a
|
||||
href="/sitemap"
|
||||
href="/terms-of-use"
|
||||
class="no-underline sm:hover:underline text-gray-100 sm:hover:text-blue-400"
|
||||
>Terms of Use</a
|
||||
>
|
||||
</li>
|
||||
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
|
||||
<a
|
||||
href="/privacy-policy"
|
||||
class="no-underline sm:hover:underline text-gray-100 sm:hover:text-blue-400"
|
||||
>Privacy Policy</a
|
||||
>
|
||||
</li>
|
||||
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
|
||||
<a
|
||||
href="/imprint"
|
||||
class="no-underline sm:hover:underline text-gray-100 sm:hover:text-blue-400"
|
||||
>Imprint</a
|
||||
>
|
||||
Sitemap
|
||||
</a>
|
||||
</li>
|
||||
<!--
|
||||
<li class="mt-2 inline-block mr-2 md:block md:mr-0">
|
||||
|
||||
BIN
src/lib/images/newsletter.png
Normal file
BIN
src/lib/images/newsletter.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 242 KiB |
4
src/lib/images/newsletter.png:Zone.Identifier
Normal file
4
src/lib/images/newsletter.png:Zone.Identifier
Normal file
@ -0,0 +1,4 @@
|
||||
[ZoneTransfer]
|
||||
ZoneId=3
|
||||
ReferrerUrl=https://imagecompressor.com/
|
||||
HostUrl=https://imagecompressor.com/download/14lao7515uhpe1k0/file_og81ulb1md5krt1k6agg91hav1/Screenshot%202025-01-16%20112032-min.png
|
||||
BIN
src/lib/images/pwa-192x192.png
Normal file
BIN
src/lib/images/pwa-192x192.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.3 KiB |
0
src/lib/images/pwa-192x192.png:Zone.Identifier
Normal file
0
src/lib/images/pwa-192x192.png:Zone.Identifier
Normal file
@ -2,52 +2,14 @@
|
||||
import { articleId, numberOfUnreadNotification } from "$lib/store";
|
||||
import { goto } from "$app/navigation";
|
||||
import { getImageURL } from "$lib/utils";
|
||||
import ArrowLogo from "lucide-svelte/icons/move-up-right";
|
||||
|
||||
export let data;
|
||||
let cloudFrontUrl = import.meta.env.VITE_IMAGE_URL;
|
||||
|
||||
function blogSelector(state: string) {
|
||||
$articleId = state;
|
||||
goto("/blog/article/" + $articleId);
|
||||
}
|
||||
|
||||
/*
|
||||
let allBlogPosts = [
|
||||
{
|
||||
'title': 'How the Stock Market is Corrupted by Market Makers',
|
||||
'description': `If you've explored the stock market, you've probably heard of "Market Makers." In this article, we'll break down what Market Makers are and discuss why they faced allegations of corruption during the GameStop Rally.`,
|
||||
'created': '2023-11-04',
|
||||
'username': 'mrahimi',
|
||||
'userId': 'db5s41oatgoeh0q',
|
||||
'link': 'how-the-stock-market-is-corrupted-by-market-makers',
|
||||
'readingTime': '4',
|
||||
'image': coverLogo1,
|
||||
},
|
||||
{
|
||||
'title': `Ken Griffin's Vision for Miami: A Financial Hub Rivaling New York`,
|
||||
'description': `Ken Griffin, the founder of Citadel hedge fund, foresees a transformative shift in the financial landscape, with Miami poised to surpass New York as a financial hub. Griffin, who is currently overseeing the construction of Citadel's $1 billion headquarters in Miami's Brickell Bay district, emphasizes the city's potential to outpace its northern counterpart.`,
|
||||
'created': '2023-11-29',
|
||||
'username': 'mrahimi',
|
||||
'userId': 'db5s41oatgoeh0q',
|
||||
'link': 'ken-griffin-vision-for-miami',
|
||||
'readingTime': '2',
|
||||
'image': coverLogo2,
|
||||
},
|
||||
{
|
||||
'title': `Amazon's Expansion in Generative AI: A New Collaboration with Nvidia`,
|
||||
'description': `During the recent AWS re:Invent event, Amazon (NASDAQ: AMZN) made significant strides in amplifying its AI capabilities, unveiling an array of innovative products centered around generative AI. Wedbush's latest report highlights Amazon's triple-layered strategy in the generative AI landscape, spanning infrastructure, foundational models, and applications.`,
|
||||
'created': '2023-12-01',
|
||||
'username': 'mrahimi',
|
||||
'userId': 'db5s41oatgoeh0q',
|
||||
'link': 'amazon-expansion-in-generative-ai',
|
||||
'readingTime': '2',
|
||||
'image': coverLogo3,
|
||||
}
|
||||
|
||||
|
||||
]
|
||||
*/
|
||||
let allBlogPosts = data?.getAllBlogPost;
|
||||
</script>
|
||||
|
||||
@ -85,13 +47,6 @@ let allBlogPosts = [
|
||||
<section
|
||||
class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden min-h-screen pb-20 pt-5 px-4 lg:px-3"
|
||||
>
|
||||
<div class="text-sm sm:text-[1rem] breadcrumbs">
|
||||
<ul>
|
||||
<li><a href="/" class="text-gray-300">Home</a></li>
|
||||
<li class="text-gray-300">Stock Analysis Blog</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="w-full overflow-hidden m-auto mt-5">
|
||||
<div class="sm:p-0 flex justify-center w-full m-auto overflow-hidden">
|
||||
<div
|
||||
@ -111,7 +66,7 @@ let allBlogPosts = [
|
||||
class="flex flex-col overflow-hidden rounded-lg shadow-lg sm:hover:shadow-2xl border border-gray-600"
|
||||
>
|
||||
<div class="flex-shrink-0">
|
||||
<a href="/article/yahoo-finance-alternatives/"
|
||||
<a href={"/blog/article/" + item?.id}
|
||||
><img
|
||||
class="h-48 w-full object-cover"
|
||||
src={getImageURL(
|
||||
@ -119,8 +74,8 @@ let allBlogPosts = [
|
||||
item?.id,
|
||||
item?.cover,
|
||||
)}
|
||||
alt="Stock Research Close up Chart and Coffee"
|
||||
loading="eager"
|
||||
alt="Stock Analysis Blog Post Wallpaper"
|
||||
loading="lazy"
|
||||
/></a
|
||||
>
|
||||
</div>
|
||||
@ -128,9 +83,7 @@ let allBlogPosts = [
|
||||
class="flex flex-1 flex-col justify-between bg-table p-4 xs:p-5 sm:p-6"
|
||||
>
|
||||
<div class="flex-1">
|
||||
<a
|
||||
href="/article/yahoo-finance-alternatives/"
|
||||
class="mt-2 block"
|
||||
<a href={"/blog/article/" + item?.id} class="mt-2 block"
|
||||
><h2 class="text-xl font-semibold text-white">
|
||||
{item?.title}
|
||||
</h2>
|
||||
@ -142,23 +95,15 @@ let allBlogPosts = [
|
||||
>
|
||||
</div>
|
||||
<div class="mt-6 flex items-center">
|
||||
<div class="flex-shrink-0">
|
||||
<img
|
||||
class="h-10 w-10 rounded-full"
|
||||
src="https://img.stockanalysis.com/cd35b0bc-8afb-4475-b42c-c6aebc4cd283/lincoln-olson.jpeg"
|
||||
alt="Lincoln Olson profile image"
|
||||
loading="eager"
|
||||
/>
|
||||
</div>
|
||||
<div class="ml-3">
|
||||
<p class="text-sm font-semibold text-white">
|
||||
<a class="hover:underline">Lincoln Olson</a>
|
||||
</p>
|
||||
<div
|
||||
class="flex space-x-1 text-sm text-gray-500 dark:text-muted"
|
||||
<div class="flex space-x-1 text-sm text-white">
|
||||
Published: <time datetime={item?.created} class="ml-1">
|
||||
{new Date(item?.created)?.toLocaleString("en-US", {
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
daySuffix: "2-digit",
|
||||
})}</time
|
||||
>
|
||||
<time datetime="2025-01-14">Jan 14, 2025</time>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
21
src/routes/blog/article/[slug]/+page.server.ts
Normal file
21
src/routes/blog/article/[slug]/+page.server.ts
Normal file
@ -0,0 +1,21 @@
|
||||
|
||||
export const load = async ({ locals, params }) => {
|
||||
const { pb } = locals;
|
||||
const getArticle = async () => {
|
||||
|
||||
|
||||
const output = await pb
|
||||
?.collection("articles")
|
||||
?.getOne(params?.slug, { expand: "user" });
|
||||
|
||||
|
||||
return output;
|
||||
};
|
||||
|
||||
|
||||
|
||||
// Make sure to return a promise
|
||||
return {
|
||||
getArticle: await getArticle(),
|
||||
};
|
||||
};
|
||||
123
src/routes/blog/article/[slug]/+page.svelte
Normal file
123
src/routes/blog/article/[slug]/+page.svelte
Normal file
@ -0,0 +1,123 @@
|
||||
<script>
|
||||
import { numberOfUnreadNotification } from "$lib/store";
|
||||
import { getImageURL } from "$lib/utils";
|
||||
|
||||
export let data;
|
||||
|
||||
const article = data?.getArticle;
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<title>
|
||||
{$numberOfUnreadNotification > 0 ? `(${$numberOfUnreadNotification})` : ""}
|
||||
{article?.title} · stocknear</title
|
||||
>
|
||||
<meta
|
||||
name="description"
|
||||
content="Latest articles on stocks, finance and investing"
|
||||
/>
|
||||
<!-- Other meta tags -->
|
||||
<meta property="og:title" content={article?.title} />
|
||||
<meta property="og:description" content={article?.abstract} />
|
||||
<meta property="og:type" content="article" />
|
||||
<!-- Add more Open Graph meta tags as needed -->
|
||||
|
||||
<!-- Twitter specific meta tags -->
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
<meta name="twitter:title" content={article?.title} />
|
||||
<meta name="twitter:description" content={article?.abstract} />
|
||||
<!-- Add more Twitter meta tags as needed -->
|
||||
</svelte:head>
|
||||
<div>
|
||||
<main id="main" class="mt-2 text-white min-h-screen pb-40">
|
||||
<div class="mx-auto max-w-screen-xl">
|
||||
<img
|
||||
src={getImageURL(article?.collectionId, article?.id, article?.cover)}
|
||||
class="h-[200px] w-full object-cover lg:h-[350px]"
|
||||
loading="lazy"
|
||||
alt="Wallpaper"
|
||||
/>
|
||||
<div class="lg:flex">
|
||||
<article
|
||||
class="z-5 relative mx-1 -mt-10 rounded-t-md bg-default p-3 xs:p-4 lg:-mt-16 lg:ml-3 lg:p-5 xl:mx-4"
|
||||
>
|
||||
<header class="article-header">
|
||||
<h1 class="mb-3 text-3xl font-bold text-white md:text-4xl">
|
||||
{article?.title}
|
||||
</h1>
|
||||
<div class="text-base text-muted">
|
||||
<div>
|
||||
Published {new Date(article?.created)?.toLocaleString("en-US", {
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
year: "numeric",
|
||||
daySuffix: "2-digit",
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="text-lg mt-4">
|
||||
<div class="content">
|
||||
{@html article?.description}
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<div class="mt-5 lg:w-full">
|
||||
<div
|
||||
class="flex flex-wrap gap-y-5 justify-center px-5 lg:sticky lg:top-20 lg:px-0"
|
||||
>
|
||||
{#if !data?.user}
|
||||
<div
|
||||
class="w-full text-white border border-gray-600 rounded-md h-fit bg-primary sm:hover:bg-secondary transition ease-out duration-100 lg:mx-0 lg:w-[300px] xl:w-[360px]"
|
||||
>
|
||||
<div class="space-y-6 p-6">
|
||||
<h4 class="text-2xl font-bold">
|
||||
Stay informed in just 2 minutes
|
||||
</h4>
|
||||
<p class="text-base text-white lg:text-lg">
|
||||
Get a daily email with the top market-moving news in bullet
|
||||
point format, for free.
|
||||
</p>
|
||||
<div>
|
||||
<a
|
||||
href="/register"
|
||||
class=" btn bg-[#fff] border border-gray-600 sm:hover:bg-gray-300 transition duration-100 btn-md w-full rounded-md m-auto text-black font-semibold text-[1rem]"
|
||||
>
|
||||
<span class="text-[1rem]">Sign Up</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
<a
|
||||
href="/watchlist/stocks"
|
||||
class="w-full text-white border border-gray-600 rounded-md h-fit bg-primary sm:hover:bg-secondary transition ease-out duration-100 lg:mx-0 lg:w-[300px] xl:w-[360px]"
|
||||
>
|
||||
<div class="space-y-3 p-6">
|
||||
<h4 class="text-xl font-semibold">Watchlist</h4>
|
||||
<p class="text-base text-white lg:text-lg">
|
||||
Build your watchlist to keep track of their performance
|
||||
</p>
|
||||
</div>
|
||||
</a>
|
||||
<a
|
||||
href="/analysts/top-stocks"
|
||||
class="w-full text-white border border-gray-600 rounded-md h-fit bg-primary sm:hover:bg-secondary transition ease-out duration-100 lg:mx-0 lg:w-[300px] xl:w-[360px]"
|
||||
>
|
||||
<div class="space-y-3 p-6">
|
||||
<h4 class="text-xl font-semibold">Top Stocks</h4>
|
||||
<p class="text-base text-white lg:text-lg">
|
||||
Get the latest Top Wall Street Analyst Ratings
|
||||
</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
@ -1,13 +1,15 @@
|
||||
export const load = async ({ locals }) => {
|
||||
const getETFList = async () => {
|
||||
const getStockList = async () => {
|
||||
const { apiKey, apiURL } = locals;
|
||||
const postData = {'filterList': 'all-etf-tickers'}
|
||||
// make the POST request to the endpoint
|
||||
const response = await fetch(apiURL + "/all-etf-tickers", {
|
||||
method: "GET",
|
||||
const response = await fetch(apiURL + "/list-category", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
"X-API-KEY": apiKey,
|
||||
},
|
||||
body: JSON.stringify(postData)
|
||||
});
|
||||
|
||||
const output = await response.json();
|
||||
@ -17,6 +19,6 @@ export const load = async ({ locals }) => {
|
||||
|
||||
// Make sure to return a promise
|
||||
return {
|
||||
getETFList: await getETFList(),
|
||||
getStockList: await getStockList(),
|
||||
};
|
||||
};
|
||||
|
||||
@ -1,34 +1,12 @@
|
||||
<script lang="ts">
|
||||
import { goto } from "$app/navigation";
|
||||
import { numberOfUnreadNotification, screenWidth } from "$lib/store";
|
||||
import { abbreviateNumber } from "$lib/utils";
|
||||
import logo from "$lib/images/box_logo.png";
|
||||
import { numberOfUnreadNotification } from "$lib/store";
|
||||
|
||||
import ArrowLogo from "lucide-svelte/icons/move-up-right";
|
||||
import { onMount } from "svelte";
|
||||
import Table from "$lib/components/Table/Table.svelte";
|
||||
|
||||
export let data;
|
||||
|
||||
let rawData = data?.getETFList;
|
||||
let stockList = rawData?.slice(0, 50);
|
||||
|
||||
async function handleScroll() {
|
||||
const scrollThreshold = document.body.offsetHeight * 0.8; // 80% of the website height
|
||||
const isBottom = window.innerHeight + window.scrollY >= scrollThreshold;
|
||||
if (isBottom && stockList?.length !== rawData?.length) {
|
||||
const nextIndex = stockList?.length;
|
||||
const filteredNewResults = rawData?.slice(nextIndex, nextIndex + 25);
|
||||
stockList = [...stockList, ...filteredNewResults];
|
||||
}
|
||||
}
|
||||
|
||||
onMount(() => {
|
||||
window.addEventListener("scroll", handleScroll);
|
||||
return () => {
|
||||
window.removeEventListener("scroll", handleScroll);
|
||||
};
|
||||
});
|
||||
|
||||
$: charNumber = $screenWidth < 640 ? 15 : 40;
|
||||
let rawData = data?.getStockList;
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
@ -36,11 +14,11 @@
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<title>
|
||||
{$numberOfUnreadNotification > 0 ? `(${$numberOfUnreadNotification})` : ""} List
|
||||
of All ETF Ticker Symbols · Stocknear
|
||||
of All Stock ETF Symbols · Stocknear
|
||||
</title>
|
||||
<meta
|
||||
name="description"
|
||||
content={`An overview of all the ETF symbols listed. Explore the ETF pages to learn about the fund’s price history, holdings, dividends and more.`}
|
||||
content={`An overview of all the etf ticker symbols listed. Explore the stock pages to learn about the company's price history, financials, key stats, and more.`}
|
||||
/>
|
||||
|
||||
<!-- Other meta tags -->
|
||||
@ -50,7 +28,7 @@
|
||||
/>
|
||||
<meta
|
||||
property="og:description"
|
||||
content={`An overview of all the ETF symbols listed. Explore the ETF pages to learn about the fund’s price history, holdings, dividends and more.`}
|
||||
content={`An overview of all the etf ticker symbols listed. Explore the stock pages to learn about the company's price history, financials, key stats, and more.`}
|
||||
/>
|
||||
<meta property="og:type" content="website" />
|
||||
<!-- Add more Open Graph meta tags as needed -->
|
||||
@ -63,15 +41,15 @@
|
||||
/>
|
||||
<meta
|
||||
name="twitter:description"
|
||||
content={`An overview of all the ETF symbols listed. Explore the ETF pages to learn about the fund’s price history, holdings, dividends and more.`}
|
||||
content={`An overview of all the etf ticker symbols listed. Explore the stock pages to learn about the company's price history, financials, key stats, and more.`}
|
||||
/>
|
||||
<!-- Add more Twitter meta tags as needed -->
|
||||
</svelte:head>
|
||||
|
||||
<section
|
||||
class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden min-h-screen pt-5 pb-40 lg:px-3"
|
||||
class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden min-h-screen pb-20 pt-5 px-4 lg:px-3"
|
||||
>
|
||||
<div class="text-sm sm:text-[1rem] breadcrumbs ml-4">
|
||||
<div class="text-sm sm:text-[1rem] breadcrumbs">
|
||||
<ul>
|
||||
<li><a href="/" class="text-gray-300">Home</a></li>
|
||||
<li class="text-gray-300">All ETFs</li>
|
||||
@ -84,205 +62,80 @@
|
||||
class="relative flex justify-center items-start overflow-hidden w-full"
|
||||
>
|
||||
<main class="w-full lg:w-3/4 lg:pr-5">
|
||||
<div
|
||||
class="w-full m-auto sm:bg-primary sm:rounded-xl h-auto pl-10 pr-10 pt-5 sm:pb-10 sm:pt-10 mt-3 mb-8"
|
||||
>
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 gap-10">
|
||||
<!-- Start Column -->
|
||||
<div>
|
||||
<div class="flex flex-row justify-center items-center">
|
||||
<h1
|
||||
class="text-3xl sm:text-4xl text-white text-center font-bold mb-5"
|
||||
>
|
||||
ETF Symbols
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<span
|
||||
class="text-white text-md font-medium text-center flex justify-center items-center"
|
||||
>
|
||||
Collection of all ETF Symbols available
|
||||
</span>
|
||||
<!--
|
||||
<label for="marketMoverInfo" class="cursor-pointer flex justify-center items-center mt-2">
|
||||
<span class="text-white text-md font-medium">
|
||||
Learn more
|
||||
</span>
|
||||
<svg class="w-6 h-6 inline-block ml-2" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="#000000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <title></title> <g id="Complete"> <g id="info-circle"> <g> <circle cx="12" cy="12" data-name="--Circle" fill="none" id="_--Circle" r="10" stroke="#B46266" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></circle> <line fill="none" stroke="#B46266" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" x2="12" y1="12" y2="16"></line> <line fill="none" stroke="#B46266" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" x2="12" y1="8" y2="8"></line> </g> </g> </g> </g></svg>
|
||||
</label>
|
||||
-->
|
||||
</div>
|
||||
<!-- End Column -->
|
||||
|
||||
<!-- Start Column -->
|
||||
<div
|
||||
class="hidden sm:block relative m-auto mb-5 mt-5 sm:mb-0 sm:mt-0"
|
||||
>
|
||||
<svg
|
||||
class="w-40 -my-5"
|
||||
viewBox="0 0 200 200"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<defs>
|
||||
<filter id="glow">
|
||||
<feGaussianBlur stdDeviation="5" result="glow" />
|
||||
<feMerge>
|
||||
<feMergeNode in="glow" />
|
||||
<feMergeNode in="SourceGraphic" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<path
|
||||
fill="#1E40AF"
|
||||
d="M57.6,-58.7C72.7,-42.6,81.5,-21.3,82,0.5C82.5,22.3,74.7,44.6,59.7,60.1C44.6,75.6,22.3,84.3,0,84.3C-22.3,84.2,-44.6,75.5,-61.1,60.1C-77.6,44.6,-88.3,22.3,-87.6,0.7C-86.9,-20.8,-74.7,-41.6,-58.2,-57.7C-41.6,-73.8,-20.8,-85.2,0.2,-85.4C21.3,-85.6,42.6,-74.7,57.6,-58.7Z"
|
||||
transform="translate(100 100)"
|
||||
filter="url(#glow)"
|
||||
/>
|
||||
</svg>
|
||||
|
||||
<div class="z-1 absolute top-0">
|
||||
<img class="w-24 ml-9" src={logo} alt="logo" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
<!-- End Column -->
|
||||
</div>
|
||||
<div class="mb-6 border-b-[2px]">
|
||||
<h1 class="mb-1 text-white text-2xl sm:text-3xl font-bold">
|
||||
All ETF Symbols
|
||||
</h1>
|
||||
<p class="mb-3 px-1 text-base font-semibold text-muted sm:px-0">
|
||||
List of all {rawData?.length} ETF symbols we support
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="w-full mt-10 m-auto mb-10 bg-default pl-3 pr-3">
|
||||
<div class="w-full m-auto mb-10 bg-default">
|
||||
<!--Start Top Winners/Losers-->
|
||||
<div class="flex flex-col justify-center items-center">
|
||||
<div class="ml-4 text-start w-full text-white mb-2">
|
||||
<span class="font-bold text-2xl">
|
||||
{rawData?.length} ETFs
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="border-b mt-2 border-blue-400 w-full mb-4" />
|
||||
|
||||
<div class="w-full overflow-x-scroll">
|
||||
<table
|
||||
class="mt-5 table table-sm table-compact rounded-none sm:rounded-md w-full bg-table border border-gray-800 m-auto"
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
<th
|
||||
class="text-white font-medium text-sm sm:text-[1rem] text-start"
|
||||
>Symbol</th
|
||||
>
|
||||
<th class="text-white font-medium text-sm sm:text-[1rem]"
|
||||
>Fund Name</th
|
||||
>
|
||||
<th
|
||||
class="text-white font-medium text-end text-sm sm:text-[1rem]"
|
||||
>Holdings</th
|
||||
>
|
||||
<th
|
||||
class="text-white font-medium text-end text-sm sm:text-[1rem]"
|
||||
>Total Assets</th
|
||||
>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{#each stockList as item, index}
|
||||
<tr
|
||||
class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b-[#09090B]"
|
||||
>
|
||||
<td
|
||||
class="font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
|
||||
>
|
||||
<a
|
||||
href={"/etf/" + item?.symbol}
|
||||
class="sm:hover:text-white text-blue-400"
|
||||
>
|
||||
{item?.symbol}
|
||||
</a>
|
||||
</td>
|
||||
|
||||
<td
|
||||
class="text-white whitespace-nowrap text-sm sm:text-[1rem] border-b-[#09090B]"
|
||||
>
|
||||
{item?.name?.length > charNumber
|
||||
? item?.name?.slice(0, charNumber) + "..."
|
||||
: item?.name}
|
||||
</td>
|
||||
|
||||
<td
|
||||
class="text-white text-end text-sm sm:text-[1rem] border-b-[#09090B]"
|
||||
>
|
||||
{item?.numberOfHoldings !== null
|
||||
? abbreviateNumber(item?.numberOfHoldings)
|
||||
: "-"}
|
||||
</td>
|
||||
|
||||
<td
|
||||
class="text-white whitespace-nowrap text-sm sm:text-[1rem] border-b-[#09090B] text-end"
|
||||
>
|
||||
{item?.totalAssets !== null
|
||||
? abbreviateNumber(item?.totalAssets, true)
|
||||
: "-"}
|
||||
</td>
|
||||
</tr>
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<Table {data} {rawData} />
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<aside class="hidden lg:block relative fixed w-1/4 ml-4">
|
||||
{#if data?.user?.tier !== "Pro" || data?.user?.freeTrial}
|
||||
<div
|
||||
on:click={() => goto("/pricing")}
|
||||
class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-primary sm:hover:bg-secondary transition ease-out duration-100"
|
||||
>
|
||||
<div
|
||||
<a
|
||||
href="/pricing"
|
||||
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
|
||||
>
|
||||
<div class="w-full flex justify-between items-center p-3 mt-3">
|
||||
<h2 class="text-start text-xl font-semibold text-white ml-3">
|
||||
Pro Subscription 🔥
|
||||
Pro Subscription
|
||||
</h2>
|
||||
<ArrowLogo class="w-8 h-8 mr-3 flex-shrink-0" />
|
||||
</div>
|
||||
<span class="text-white p-3 ml-3 mr-3">
|
||||
Upgrade now for unlimited access to all data and tools
|
||||
</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div
|
||||
on:click={() => goto("/analysts")}
|
||||
class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-primary sm:hover:bg-secondary transition ease-out duration-100"
|
||||
>
|
||||
<div class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0">
|
||||
<a
|
||||
href="/analysts"
|
||||
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
|
||||
>
|
||||
<div class="w-full flex justify-between items-center p-3 mt-3">
|
||||
<h2 class="text-start text-xl font-semibold text-white ml-3">
|
||||
Top Analyst 📊
|
||||
Top Analyst
|
||||
</h2>
|
||||
<ArrowLogo class="w-8 h-8 mr-3 flex-shrink-0" />
|
||||
</div>
|
||||
<span class="text-white p-3 ml-3 mr-3">
|
||||
Get the latest top Wall Street analyst ratings
|
||||
</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div
|
||||
on:click={() => goto("/analysts/top-stocks")}
|
||||
class="w-full text-white border border-gray-600 rounded-md h-fit pb-4 mt-4 cursor-pointer bg-primary sm:hover:bg-secondary transition ease-out duration-100"
|
||||
>
|
||||
<div class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0">
|
||||
<a
|
||||
href="/analysts/top-stocks"
|
||||
class="w-auto lg:w-full p-1 flex flex-col m-auto px-2 sm:px-0"
|
||||
>
|
||||
<div class="w-full flex justify-between items-center p-3 mt-3">
|
||||
<h2 class="text-start text-xl font-semibold text-white ml-3">
|
||||
Top Stocks Picks ⭐
|
||||
Top Stocks Picks
|
||||
</h2>
|
||||
<ArrowLogo class="w-8 h-8 mr-3 flex-shrink-0" />
|
||||
</div>
|
||||
<span class="text-white p-3 ml-3 mr-3">
|
||||
Get the latest top Wall Street analyst ratings.
|
||||
</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
|
||||
@ -1,9 +1,7 @@
|
||||
<script lang="ts">
|
||||
import { numberOfUnreadNotification } from "$lib/store";
|
||||
|
||||
import logo from "$lib/images/newsletter.png";
|
||||
export let data;
|
||||
|
||||
let cloudFrontUrl = import.meta.env.VITE_IMAGE_URL;
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
@ -27,10 +25,6 @@
|
||||
property="og:description"
|
||||
content={`Get our free newsletter to be up to date with the current market.`}
|
||||
/>
|
||||
<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 -->
|
||||
|
||||
@ -44,167 +38,67 @@
|
||||
name="twitter:description"
|
||||
content={`Get our free newsletter to be up to date with the current market.`}
|
||||
/>
|
||||
<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="w-full max-w-4xl overflow-hidden m-auto min-h-screen pt-5 pb-40"
|
||||
>
|
||||
<!--
|
||||
<div class="text-sm breadcrumbs ml-4">
|
||||
<ul>
|
||||
<li><a href="/" class="text-gray-300">Home</a></li>
|
||||
<li class="text-gray-300">Newsletter</li>
|
||||
</ul>
|
||||
</div>
|
||||
-->
|
||||
|
||||
<div
|
||||
class="w-full max-w-4xl m-auto sm:bg-default sm:rounded-xl h-auto p-10 mt-3"
|
||||
<div class="w-full max-w-7xl min-h-screen text-white m-auto mt-5">
|
||||
<main
|
||||
id="main"
|
||||
class="mx-auto max-w-screen-lg space-x-20 p-6 md:flex md:p-10"
|
||||
>
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 gap-10">
|
||||
<!-- Start Column -->
|
||||
<div>
|
||||
<div class="flex flex-row justify-center items-center">
|
||||
<h1
|
||||
class="text-3xl sm:text-4xl text-white text-center font-bold mb-4"
|
||||
>
|
||||
Market Newsletter
|
||||
</h1>
|
||||
</div>
|
||||
<div class="md:text-lg [&_li]:mb-5 [&_p]:mb-5">
|
||||
<h1 class="mb-5 text-center text-3xl md:text-4xl font-bold">
|
||||
Stay informed in just 2 minutes per day
|
||||
</h1>
|
||||
<p>
|
||||
Market Bullets is a free newsletter that makes it super easy to keep up
|
||||
with financial markets.
|
||||
</p>
|
||||
<p class="mt-4">
|
||||
Our summaries are presented in short, bullet-point format, so reading
|
||||
this newsletter will never feel like a chore.
|
||||
</p>
|
||||
|
||||
<span
|
||||
class="w-3/4 m-auto text-white text-md font-medium text-center flex justify-center items-center"
|
||||
<p class="mt-4">
|
||||
Let us read the news for you and filter out the noise, then we'll send
|
||||
you the bullet points. Here's what you'll get:
|
||||
</p>
|
||||
<ul class="ml-8 list-disc mt-2">
|
||||
<li>
|
||||
Access the latest analyst reports, with key insights extracted using
|
||||
AI.
|
||||
</li>
|
||||
<li>Get a quick snapshot of recent and upcoming earnings releases.</li>
|
||||
<li>
|
||||
Stay updated on major economic events with the potential to
|
||||
significantly impact the market.
|
||||
</li>
|
||||
|
||||
<li>
|
||||
Benefit from accurate, up-to-date information sourced exclusively from
|
||||
top-tier outlets.
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<p class="mt-4">
|
||||
The newsletter is completely free, delivered to your inbox every morning
|
||||
before the market opens, Monday to Friday.
|
||||
</p>
|
||||
{#if !data?.user}
|
||||
<a
|
||||
href="/register"
|
||||
class="mt-10 btn bg-[#fff] border border-gray-600 sm:hover:bg-gray-300 transition duration-100 btn-md w-full rounded-md m-auto text-black font-semibold text-[1rem]"
|
||||
>
|
||||
Stay informed everyday to trade smarter
|
||||
</span>
|
||||
</div>
|
||||
<!-- End Column -->
|
||||
|
||||
<!-- Start Column -->
|
||||
<div class="relative m-auto mb-5 mt-5 sm:mb-0 sm:mt-0">
|
||||
<svg
|
||||
class="w-40 -my-5"
|
||||
viewBox="0 0 200 200"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<defs>
|
||||
<filter id="glow">
|
||||
<feGaussianBlur stdDeviation="5" result="glow" />
|
||||
<feMerge>
|
||||
<feMergeNode in="glow" />
|
||||
<feMergeNode in="SourceGraphic" />
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<path
|
||||
fill="#1E40AF"
|
||||
d="M57.6,-58.7C72.7,-42.6,81.5,-21.3,82,0.5C82.5,22.3,74.7,44.6,59.7,60.1C44.6,75.6,22.3,84.3,0,84.3C-22.3,84.2,-44.6,75.5,-61.1,60.1C-77.6,44.6,-88.3,22.3,-87.6,0.7C-86.9,-20.8,-74.7,-41.6,-58.2,-57.7C-41.6,-73.8,-20.8,-85.2,0.2,-85.4C21.3,-85.6,42.6,-74.7,57.6,-58.7Z"
|
||||
transform="translate(100 100)"
|
||||
filter="url(#glow)"
|
||||
/>
|
||||
</svg>
|
||||
|
||||
<div class="z-1 absolute top-0 left-8">
|
||||
<img
|
||||
class="w-32"
|
||||
src={cloudFrontUrl + "/assets/newsletter_logo.png"}
|
||||
alt="logo"
|
||||
loading="lazy"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<!-- End Column -->
|
||||
<span class="text-[1rem] sm:text-lg">Sign Up</span>
|
||||
</a>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="bg-default sm:mt-10 sm:rounded-xl border-t sm:border hover:border-slate-700 border-gray-600 pb-10"
|
||||
>
|
||||
<div
|
||||
class="text-white w-5/6 sm:w-full m-auto sm:m-0 text-center sm:text-start font-bold text-2xl flex justify-center sm:justify-start items-center pt-10 sm:ml-10"
|
||||
>
|
||||
Stay informed in just 2 minutes per day
|
||||
<div class="hidden md:block">
|
||||
<img
|
||||
src={logo}
|
||||
class="w-auto max-w-[300px] h-fit"
|
||||
alt="Morning bullets preview"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<span
|
||||
class="text-white w-5/6 sm:w-full m-auto sm:m-0 text-center sm:text-start font-medium text-[1rem] sm:text-lg flex justify-center sm:justify-start items-center pt-7 sm:pt-4 pb-10 sm:pb-5 sm:ml-10"
|
||||
>
|
||||
Get super simple bullet-point summaries keep up with the market.
|
||||
</span>
|
||||
|
||||
<ol
|
||||
class="list-disc pl-7 text-white text-[1rem] sm:text-lg pb-5 ml-3 sm:ml-10"
|
||||
>
|
||||
<li class="w-11/12">
|
||||
A quick overview of the most active stocks the past 24h.
|
||||
</li>
|
||||
<li class="pt-3 w-11/12">
|
||||
Concise, easy-to-read bullet points highlighting key market
|
||||
developments, significant earnings and other important news.
|
||||
</li>
|
||||
<li class="pt-3 w-11/12">
|
||||
We rely exclusively on reliable, current information from top-tier
|
||||
sources.
|
||||
</li>
|
||||
</ol>
|
||||
|
||||
<span
|
||||
class="text-white w-96 sm:w-11/12 m-auto sm:m-0 text-center sm:text-start text-[1rem] sm:text-lg flex justify-center sm:justify-start items-center pt-7 sm:pt-4 pb-5 sm:pb-5 sm:ml-10"
|
||||
>
|
||||
Receive our free newsletter in your inbox every weekday morning, before
|
||||
the market opens, from Monday to Friday.
|
||||
</span>
|
||||
|
||||
{#if !data?.user}
|
||||
<a
|
||||
class="w-96 mt-6 m-auto flex m-auto justify-center items-center m-auto btn text-white bg-[#fff] sm:hover:bg-gray-300 transition duration-150 ease-in-out group"
|
||||
href="/register"
|
||||
>
|
||||
Get Newsletter
|
||||
<span
|
||||
class="tracking-normal group-hover:translate-x-0.5 transition-transform duration-150 ease-in-out"
|
||||
>
|
||||
<svg
|
||||
class="w-4 h-4"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
><g transform="rotate(90 12 12)"
|
||||
><g fill="none"
|
||||
><path
|
||||
d="M24 0v24H0V0h24ZM12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035c-.01-.004-.019-.001-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427c-.002-.01-.009-.017-.017-.018Zm.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093c.012.004.023 0 .029-.008l.004-.014l-.034-.614c-.003-.012-.01-.02-.02-.022Zm-.715.002a.023.023 0 0 0-.027.006l-.006.014l-.034.614c0 .012.007.02.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01l-.184-.092Z"
|
||||
/><path
|
||||
fill="white"
|
||||
d="M13.06 3.283a1.5 1.5 0 0 0-2.12 0L5.281 8.939a1.5 1.5 0 0 0 2.122 2.122L10.5 7.965V19.5a1.5 1.5 0 0 0 3 0V7.965l3.096 3.096a1.5 1.5 0 1 0 2.122-2.122L13.06 3.283Z"
|
||||
/></g
|
||||
></g
|
||||
></svg
|
||||
>
|
||||
</span>
|
||||
</a>
|
||||
{/if}
|
||||
|
||||
<!--
|
||||
<form method="POST" class="flex flex-col items-center space-y-2 w-5/6 sm:pt-8 ml-auto mr-auto">
|
||||
<Input
|
||||
type="email"
|
||||
id="email"
|
||||
label=""
|
||||
placeholder="Enter your email address"
|
||||
value={form?.data?.email ?? ''}
|
||||
required={true}
|
||||
errors=''
|
||||
/>
|
||||
<div class="w-full sm:w-5/6 max-w-lg m-auto pb-5">
|
||||
<button type="submit" class="py-3 bg-[#fff] text-white sm:hover:bg-gray-300 w-full rounded-md m-auto font-bold text-md">
|
||||
Subscribe
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
-->
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user