Merge branch 'main' into 1950-Search-bar-UI

Author: gurjeetsinghvirdee

pnpm-lock.yaml

@@ -7,7 +7,7 @@
 </script>
 
 <div
-    class="bg relative mt-12 -mb-16 flex min-h-[12rem] items-center justify-center overflow-hidden border-t border-[hsl(var(--web-color-subtle))] py-12"
+    class="bg relative mt-12 -mb-6 flex min-h-[12rem] items-center justify-center overflow-hidden border-t border-[hsl(var(--web-color-subtle))] py-12"
 >
     <div class="flex max-w-3xs flex-col items-center justify-center gap-5 text-center">
         <h2 class="text-label text-primary font-aeonik-pro">{heading}</h2>

src/lib/components/BlogCta.svelte

@@ -9,7 +9,7 @@
     class="web-side-nav-button flex size-10 w-full items-center rounded-lg p-2 whitespace-nowrap"
     class:is-selected={page.url?.pathname === groupItem.href}
     href={groupItem.href}
-    target={groupItem.openInNewTab ? '_blank' : '_self'}
+    target={groupItem.openInNewTab ? '_blank' : undefined}
 >
     {#if groupItem.icon}
         <span class="icon {groupItem.icon}" aria-hidden="true"></span>

src/lib/layouts/SidebarNavButton.svelte

@@ -1,7 +1,15 @@
 <script lang="ts">
+    import { page } from '$app/state';
     import { Media } from '$lib/UI';
     import { FooterNav, MainFooter } from '$lib/components';
+    import CTA from '$lib/components/BlogCta.svelte';
+    import Article from '$lib/components/blog/article.svelte';
+    import Breadcrumbs from '$lib/components/blog/breadcrumbs.svelte';
+    import Newsletter from '$lib/components/blog/newsletter.svelte';
+    import PostMeta from '$lib/components/blog/post-meta.svelte';
+    import TableOfContents from '$lib/components/blog/table-of-contents.svelte';
     import { Main } from '$lib/layouts';
+    import type { TocItem } from '$lib/layouts/DocsArticle.svelte';
     import { formatDate } from '$lib/utils/date';
     import {
         createBreadcrumbsSchema,
@@ -12,14 +20,6 @@
     import type { AuthorData, PostsData } from '$routes/blog/content';
     import { TITLE_SUFFIX } from '$routes/titles';
     import { getContext, setContext } from 'svelte';
-    import { page } from '$app/state';
-    import CTA from '$lib/components/BlogCta.svelte';
-    import PostMeta from '$lib/components/blog/post-meta.svelte';
-    import Breadcrumbs from '$lib/components/blog/breadcrumbs.svelte';
-    import Newsletter from '$lib/components/blog/newsletter.svelte';
-    import TableOfContents from '$lib/components/blog/table-of-contents.svelte';
-    import Article from '$lib/components/blog/article.svelte';
-    import type { TocItem } from '$lib/layouts/DocsArticle.svelte';
     import { writable } from 'svelte/store';
     import type { LayoutContext } from './Article.svelte';
 
@@ -39,7 +39,9 @@
         | boolean;
     export let lastUpdated: string;
 
-    const posts = getContext<PostsData[]>('posts');
+    const posts = getContext<PostsData[]>('posts')?.filter(
+        (post) => !(post.unlisted ?? false) && !(post.draft ?? false)
+    );
     const authors = getContext<AuthorData[]>('authors');
     const authorData = authors.find((a) => a.slug === author);