Merge pull request #246 from prototypa/astro-v3

Updates related to new Astro 3.x and minimal fixes

astro.config.mjs

@@ -31,10 +31,6 @@ export default defineConfig({
 
   output: 'static',
 
-  build: {
-    inlineStylesheets: 'auto',
-  },
-
   integrations: [
     tailwind({
       applyBaseStyles: false,

package.json

@@ -14,10 +14,11 @@
   },
   "dependencies": {
     "@astrojs/rss": "^3.0.0",
+    "@astrojs/sitemap": "^3.0.0",
     "@astrolib/analytics": "^0.4.2",
     "@astrolib/seo": "^1.0.0-beta.4",
     "@fontsource-variable/inter": "^5.0.8",
-    "astro": "^3.0.1",
+    "astro": "^3.0.2",
     "astro-icon": "^1.0.0-next.2",
     "limax": "4.1.0",
     "lodash.merge": "^4.6.2",
@@ -26,7 +27,6 @@
   "devDependencies": {
     "@astrojs/mdx": "^1.0.0",
     "@astrojs/partytown": "^2.0.0",
-    "@astrojs/sitemap": "^3.0.0",
     "@astrojs/tailwind": "5.0.0",
     "@iconify-json/flat-color-icons": "^1.1.7",
     "@iconify-json/tabler": "^1.1.89",
@@ -43,7 +43,6 @@
     "prettier": "^3.0.3",
     "prettier-plugin-astro": "^0.12.0",
     "reading-time": "^1.5.0",
-    "svgo": "3.0.2",
     "tailwind-merge": "^1.14.0",
     "tailwindcss": "^3.3.3",
     "typescript": "^5.2.2"

src/components/blog/SinglePost.astro

@@ -16,7 +16,7 @@ export interface Props {
 }
 
 const { post, url } = Astro.props;
-const Content = post?.Content || null;
+const { Content } = post;
 ---
 
 <section class="py-8 sm:py-16 lg:py-20 mx-auto">
@@ -73,13 +73,13 @@ const Content = post?.Content || null;
       }
     </header>
     <div
-      class="mx-auto px-6 sm:px-6 max-w-3xl prose prose-lg lg:prose-xl dark:prose-invert dark:prose-headings:text-slate-300 prose-md prose-headings:font-heading prose-headings:leading-tighter prose-headings:tracking-tighter prose-headings:font-bold prose-a:text-primary dark:prose-a:text-blue-400 prose-img:rounded-md prose-img:shadow-lg mt-8"
+      class="mx-auto px-6 sm:px-6 max-w-3xl prose prose-lg lg:prose-xl dark:prose-invert dark:prose-headings:text-slate-300 prose-md prose-headings:font-heading prose-headings:leading-tighter prose-headings:tracking-tighter prose-headings:font-bold prose-a:text-primary dark:prose-a:text-blue-400 prose-img:rounded-md prose-img:shadow-lg mt-8 prose-headings:scroll-mt-[80px]"
     >
       {
         Content ? (
           <Content />
         ) : (
-          <Fragment set:html={post.content} />
+          <Fragment set:html={post.content || ""} />
         )
       }
     </div>

src/content/post/astrowind-template-in-depth.mdx

@@ -37,8 +37,8 @@ The styling mechanism consists of the following files (all paths are prefixed wi
   header section. See next.
 </DListItem>
 <DListItem dt="layouts/Layout.astro">
-  This layout is used for all of the pages rendered by _AstroWind_. The contents of _tailwind.css_ and _CustomStyles.astro_ component,
-  described above, is injected into the html header.
+  This layout is used for all of the pages rendered by _AstroWind_. The contents of _tailwind.css_ and
+  _CustomStyles.astro_ component, described above, is injected into the html header.
 </DListItem>
 
 ### Dark Mode

src/types.d.ts

@@ -1,3 +1,5 @@
+import type { AstroComponentFactory } from 'astro/runtime/server/index.js';
+
 export interface Post {
   /** A unique ID number that identifies a post. */
   id: string;
@@ -34,7 +36,7 @@ export interface Post {
   draft?: boolean;
 
   /**  */
-  Content?: unknown;
+  Content?: AstroComponentFactory;
   content?: string;
 
   /**  */

src/utils/utils.ts

@@ -23,7 +23,7 @@ export const trim = (str = '', ch?: string) => {
 export const toUiAmount = (amount: number) => {
   if (!amount) return 0;
 
-  let value;
+  let value: string;
 
   if (amount >= 1000000000) {
     const formattedNumber = (amount / 1000000000).toFixed(1);