update config

config/footer.ts

@@ -0,0 +1,35 @@
+import type { FooterLinkItem } from "@docusaurus/theme-common";
+
+export const socialLinks: FooterLinkItem = {
+  title: "Social",
+  items: [
+    {
+      label: "GitHub",
+      href: "https://github.com/stavros-k/docs",
+    },
+    {
+      label: "Twitter",
+      href: "https://twitter.com/stavroskois",
+    },
+  ],
+};
+
+export const docsLinks: FooterLinkItem = {
+  title: "Docs",
+  items: [
+    {
+      label: "Documentation",
+      to: "/",
+    },
+  ],
+};
+
+export const moreLinks: FooterLinkItem = {
+  title: "More",
+  items: [
+    {
+      label: "Blog",
+      to: "/blog",
+    },
+  ],
+};

config/navbar.ts

@@ -0,0 +1,22 @@
+import type { NavbarItem } from "@docusaurus/theme-common";
+
+export const sideLinks: NavbarItem[] = [
+  {
+    type: "doc",
+    docId: "index",
+    position: "left",
+    label: "Documentation",
+    to: "/",
+  },
+  {
+    docId: "blog",
+    label: "Blog",
+    position: "left",
+    to: "/blog",
+  },
+  {
+    href: "https://github.com/stavros-k/docs",
+    label: "GitHub",
+    position: "right",
+  },
+];

config/presetOptions.ts

@@ -1,26 +1,33 @@
 import type { Options } from "@docusaurus/preset-classic";
-
-import type {PluginOptions } from "@docusaurus/plugin-sitemap";
+import type { Options as ThemeOptions } from "@docusaurus/theme-classic";
+import type { Options as DocsPluginOptions } from "@docusaurus/plugin-content-docs";
+import type { Options as BlogPluginOptions } from "@docusaurus/plugin-content-blog";
+import type { PluginOptions as SiteMapPluginOptions } from "@docusaurus/plugin-sitemap";
 
 export const classicPresetOptions: Options = {
   pages: false,
-  docs: {
+  theme: <ThemeOptions>{
+    customCss: "./src/css/custom.css",
+  },
+  // https://docusaurus.io/docs/next/api/plugins/@docusaurus/plugin-content-docs#configuration
+  docs: <DocsPluginOptions>{
     routeBasePath: "/",
     sidebarPath: "./sidebars.ts",
     showLastUpdateTime: true,
     editUrl: "https://github.com/stavros-k/docs/tree/master/",
   },
-  blog: {
+  // https://docusaurus.io/docs/next/api/plugins/@docusaurus/plugin-content-blog#configuration
+  blog: <BlogPluginOptions>{
+    blogTitle: "Stavros' Blog",
+    blogSidebarCount: "ALL",
     showReadingTime: true,
     routeBasePath: "/blog",
-    editUrl: "https://github.com/stavros-k/docs/tree/master/"
-  },
-  theme: {
-    customCss: "./src/css/custom.css",
+    editUrl: "https://github.com/stavros-k/docs/tree/master/",
   },
-  sitemap: <PluginOptions> {
+  // https://docusaurus.io/docs/next/api/plugins/@docusaurus/plugin-sitemap#configuration
+  sitemap: <SiteMapPluginOptions>{
     priority: 1,
     filename: "sitemap.xml",
-    changefreq: 'weekly',
-  }
-}
+    changefreq: "weekly",
+  },
+};

config/themesConfig.ts

@@ -1,82 +1,36 @@
 import type { ThemeConfig } from "@docusaurus/preset-classic";
+import { docsLinks, moreLinks, socialLinks } from "./footer";
 import { themes } from "prism-react-renderer";
 import { zoomConfig } from "./zoomPlugin";
+import { sideLinks } from "./navbar";
 
 export const themesConfig: ThemeConfig = {
   copyright: `Copyright © ${new Date().getFullYear()} Stavros' Docs, Built with Docusaurus.`,
+  zoom: zoomConfig,
+  prism: {
+    theme: themes.github,
+    darkTheme: themes.dracula,
+  },
   docs: {
     sidebar: {
       autoCollapseCategories: true,
       hideable: true,
     },
   },
-  ...zoomConfig,
-  prism: {
-    theme: themes.github,
-    darkTheme: themes.dracula,
-  },
   navbar: {
     title: "Stavros' Docs",
     logo: {
       alt: "Dinosaur Logo",
       src: "./img/logo.svg",
     },
-    items: [
-      {
-        type: "doc",
-        docId: "index",
-        position: "left",
-        label: "Documentation",
-        to: "/",
-      },
-      {
-        docId: "blog",
-        label: "Blog",
-        position: "left",
-        to: "/blog",
-      },
-      {
-        href: "https://github.com/stavros-k/docs",
-        label: "GitHub",
-        position: "right",
-      },
-    ],
+    items: sideLinks,
   },
   footer: {
     style: "dark",
     links: [
-      {
-        title: "Docs",
-        items: [
-          {
-            label: "Documentation",
-            to: "/",
-          },
-        ],
-      },
-      {
-        title: "Social",
-        items: [
-          {
-            label: "GitHub",
-            href: "https://github.com/stavros-k/docs",
-          },
-          {
-          label: "Twitter",
-            href: "https://twitter.com/stavroskois",
-          },
-        ],
-      },
-      {
-        title: "More",
-        items: [
-          {
-            label: "Blog",
-            to: "/blog",
-          },
-        ],
-      },
+      docsLinks,
+      socialLinks,
+      moreLinks,
     ],
   },
-
 };

config/zoomPlugin.ts

@@ -7,15 +7,13 @@ export const imageZoom: PluginConfig = [
 
 // https://github.com/francoischalifour/medium-zoom?tab=readme-ov-file#options
 export const zoomConfig = {
-  zoom: {
-    selector: ".markdown :not(em) > img",
-    config: {
-      margin: 100,
-      scrollOffset: 40,
-      background: {
-        light: "rgb(255, 255, 255)",
-        dark: "rgb(50, 50, 50)",
-      },
+  selector: ".markdown :not(em) > img",
+  config: {
+    margin: 100,
+    scrollOffset: 40,
+    background: {
+      light: "rgb(255, 255, 255)",
+      dark: "rgb(50, 50, 50)",
     },
   },
-}
+};