dd posts header

docusaurus.config.js

@@ -56,7 +56,7 @@ module.exports = {
         blogTitle: 'Posts',
         blogDescription: 'Posts by David Windham',
         postsPerPage: 'ALL',
-        blogSidebarTitle: 'Posts',
+        blogSidebarTitle: ' ',
         blogSidebarCount: 'ALL',
         feedOptions: {
           type: null,

src/theme/BlogListPage/index.js

@@ -0,0 +1,52 @@
+import React from 'react';
+import clsx from 'clsx';
+import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
+import {
+  PageMetadata,
+  HtmlClassNameProvider,
+  ThemeClassNames,
+} from '@docusaurus/theme-common';
+import BlogLayout from '@theme/BlogLayout';
+import BlogListPaginator from '@theme/BlogListPaginator';
+import SearchMetadata from '@theme/SearchMetadata';
+import BlogPostItems from '@theme/BlogPostItems';
+function BlogListPageMetadata(props) {
+  const {metadata} = props;
+  const {
+    siteConfig: {title: siteTitle},
+  } = useDocusaurusContext();
+  const {blogDescription, blogTitle, permalink} = metadata;
+  const isBlogOnlyMode = permalink === '/';
+  const title = isBlogOnlyMode ? siteTitle : blogTitle;
+  return (
+    <>
+      <PageMetadata title={title} description={blogDescription} />
+      <SearchMetadata tag="blog_posts_list" />
+    </>
+  );
+}
+function BlogListPageContent(props) {
+  const {metadata, items, sidebar} = props;
+  return (
+    <BlogLayout sidebar={sidebar}>
+      <h1>Posts</h1>
+      <p>( 22/11/28 ) I'm using these posts to make chronological thoughts, ideas, opinions and 'today I learned(s)' for  items that don't necessarily need to reference at a later point like my <a href="https://davidawindham.com/til/docs">docs</a>, <a href="https://davidawindham.com/til/lists">lists</a>, and <a href="https://davidawindham.com/til/notes">notes</a>. And because it's faster than writing posts for my <a href="https://davidawindham.com/desk">desk page</a>, I tend to use it more often for jotting down quick posts or drafting longer posts that'll end up on my <a href="https://davidawindham.com/desk">desk</a>.</p>
+      <hr/>
+      <br/>
+      <BlogPostItems items={items} />
+      <BlogListPaginator metadata={metadata} />
+    </BlogLayout>
+  );
+}
+export default function BlogListPage(props) {
+  return (
+    <HtmlClassNameProvider
+      className={clsx(
+        ThemeClassNames.wrapper.blogPages,
+        ThemeClassNames.page.blogListPage,
+      )}>
+      <BlogListPageMetadata {...props} />
+      <BlogListPageContent {...props} />
+    </HtmlClassNameProvider>
+  );
+}