From e159b54971009bf3c0559b51a0b33f5b86cf05ea Mon Sep 17 00:00:00 2001 From: Adam Matthiesen Date: Thu, 7 Mar 2024 23:09:17 -0800 Subject: [PATCH] migrate catpuccin theme from `Fragment` component to `astro-remote` --- .../src/components/ghostrender/CodeSlot.astro | 9 ++++-- .../astro-ghostcms-catppuccin/package.json | 9 ++++-- .../src/components/FeaturedPost.astro | 14 ++++++++- .../src/components/Post.astro | 14 ++++++++- .../components/astro-remote/CodeSlot.astro | 17 +++++++++++ .../src/components/astro-remote/index.ts | 1 + .../src/routes/[slug].astro | 2 +- playgrounds/astro-playground/astro.config.mjs | 10 +++---- playgrounds/astro-playground/package.json | 1 + pnpm-lock.yaml | 30 ++++++++----------- 10 files changed, 76 insertions(+), 31 deletions(-) create mode 100644 packages/astro-ghostcms-catppuccin/src/components/astro-remote/CodeSlot.astro create mode 100644 packages/astro-ghostcms-catppuccin/src/components/astro-remote/index.ts diff --git a/packages/astro-ghostcms-brutalbyelian/src/components/ghostrender/CodeSlot.astro b/packages/astro-ghostcms-brutalbyelian/src/components/ghostrender/CodeSlot.astro index 6ba6deaf..e1400d76 100644 --- a/packages/astro-ghostcms-brutalbyelian/src/components/ghostrender/CodeSlot.astro +++ b/packages/astro-ghostcms-brutalbyelian/src/components/ghostrender/CodeSlot.astro @@ -6,7 +6,12 @@ import { querySelector } from "ultrahtml/selector" const html = await Astro.slots.render("default") const ast = await parse(html) const codetag = querySelector(ast,'code') -const { children } = codetag +const { children, attributes } = codetag + const code = children[0].value +const checkLang = attributes.class ? attributes.class.slice(9) : undefined + +const lang = checkLang ? checkLang : 'plaintxt' --- - \ No newline at end of file + + \ No newline at end of file diff --git a/packages/astro-ghostcms-catppuccin/package.json b/packages/astro-ghostcms-catppuccin/package.json index 2d434bc0..13c63a26 100644 --- a/packages/astro-ghostcms-catppuccin/package.json +++ b/packages/astro-ghostcms-catppuccin/package.json @@ -50,7 +50,8 @@ }, "scripts": {}, "peerDependencies": { - "astro": "^4.2.1" + "@matthiesenxyz/astro-ghostcms": ">=3.3.1", + "astro": ">=4.4.0" }, "devDependencies": { "@matthiesenxyz/astro-ghostcms": "workspace:*" @@ -61,8 +62,10 @@ "@fontsource-variable/inter": "^5.0.17", "@matthiesenxyz/astro-ghostcms": "^3.3.1", "@tailwindcss/typography": "^0.5.10", - "tailwindcss": "^3.3.5", "astro-navbar": "^2.3.1", - "astro-seo": "^0.8.3" + "astro-remote": "^0.3.2", + "astro-seo": "^0.8.3", + "tailwindcss": "^3.3.5", + "ultrahtml": "1.5.3" } } diff --git a/packages/astro-ghostcms-catppuccin/src/components/FeaturedPost.astro b/packages/astro-ghostcms-catppuccin/src/components/FeaturedPost.astro index 7dbe5547..1eb32a6d 100644 --- a/packages/astro-ghostcms-catppuccin/src/components/FeaturedPost.astro +++ b/packages/astro-ghostcms-catppuccin/src/components/FeaturedPost.astro @@ -3,6 +3,9 @@ import type { Settings, Post } from "@matthiesenxyz/astro-ghostcms/api"; import FeatureImage from "./FeatureImage.astro"; import AuthorList from "./AuthorList.astro"; import { formatDate } from "../utils"; +import { Markup } from 'astro-remote'; +import * as render from '../components/astro-remote'; + export type Props = { posts: Post[]; settings: Settings; @@ -59,7 +62,16 @@ const latestFeatured = posts[0]
- {latestFeatured && } + {latestFeatured && }
diff --git a/packages/astro-ghostcms-catppuccin/src/components/Post.astro b/packages/astro-ghostcms-catppuccin/src/components/Post.astro index 3613f73d..c046e38f 100644 --- a/packages/astro-ghostcms-catppuccin/src/components/Post.astro +++ b/packages/astro-ghostcms-catppuccin/src/components/Post.astro @@ -2,6 +2,9 @@ import PostHero from "../components/PostHero.astro"; import PostFooter from "../components/PostFooter.astro"; import { getFeaturedPosts, invariant, type Post, type Settings } from "@matthiesenxyz/astro-ghostcms/api"; +import { Markup } from 'astro-remote'; +import * as render from '../components/astro-remote'; + export type Props = { post: Post; settings: Settings; @@ -27,7 +30,16 @@ invariant(settings, "Settings not found");
- +
diff --git a/packages/astro-ghostcms-catppuccin/src/components/astro-remote/CodeSlot.astro b/packages/astro-ghostcms-catppuccin/src/components/astro-remote/CodeSlot.astro new file mode 100644 index 00000000..35f0e1c6 --- /dev/null +++ b/packages/astro-ghostcms-catppuccin/src/components/astro-remote/CodeSlot.astro @@ -0,0 +1,17 @@ +--- +import { Code } from "astro/components" +import { parse } from "ultrahtml" +import { querySelector } from "ultrahtml/selector" + +const html = await Astro.slots.render("default") +const ast = await parse(html) +const codetag = querySelector(ast,'code') +const { children, attributes } = codetag + +const code = children[0].value +const checkLang = attributes.class ? attributes.class.slice(9) : undefined + +const lang = checkLang ? checkLang : 'txt' +--- + + \ No newline at end of file diff --git a/packages/astro-ghostcms-catppuccin/src/components/astro-remote/index.ts b/packages/astro-ghostcms-catppuccin/src/components/astro-remote/index.ts new file mode 100644 index 00000000..f5badee5 --- /dev/null +++ b/packages/astro-ghostcms-catppuccin/src/components/astro-remote/index.ts @@ -0,0 +1 @@ +export { default as CodeSlot } from "./CodeSlot.astro"; diff --git a/packages/starlight-ghostcms/src/routes/[slug].astro b/packages/starlight-ghostcms/src/routes/[slug].astro index 1ec2cd06..72b82326 100644 --- a/packages/starlight-ghostcms/src/routes/[slug].astro +++ b/packages/starlight-ghostcms/src/routes/[slug].astro @@ -49,7 +49,7 @@ const pageProps = getPageProps(post.title) content={post.html} sanitize={{ allowComponents: true, - allowElements: ['a', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'img', 'figure', 'figcaption', 'ul', 'ol', 'li', 'blockquote', 'pre', 'code', 'em', 'strong', 'del', 'hr', 'br', 'table', 'thead', 'tbody', 'tr', 'th', 'td', 'caption', 'div', 'span', 'script', 'getgist', 'getgistgroup'], + allowElements: ['a', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'img', 'figure', 'figcaption', 'ul', 'ol', 'li', 'blockquote', 'pre', 'code', 'em', 'strong', 'del', 'hr', 'br', 'table', 'thead', 'tbody', 'tr', 'th', 'td', 'caption', 'div', 'span', 'script', 'getgist', 'getgistgroup', 'astrocard'], }} components={{ pre: render.CodeSlot, diff --git a/playgrounds/astro-playground/astro.config.mjs b/playgrounds/astro-playground/astro.config.mjs index 8a95f1f6..d9969fe5 100644 --- a/playgrounds/astro-playground/astro.config.mjs +++ b/playgrounds/astro-playground/astro.config.mjs @@ -1,18 +1,18 @@ import ghostcms from "@matthiesenxyz/astro-ghostcms"; import { defineConfig } from "astro/config"; -//import tailwind from "@astrojs/tailwind"; -import UnoCSS from "unocss/astro"; +import tailwind from "@astrojs/tailwind"; +//import UnoCSS from "unocss/astro"; // https://astro.build/config export default defineConfig({ site: "https://demo.astro-ghostcms.xyz/", integrations: [ - //tailwind(), - UnoCSS({ injectReset: true }), + tailwind(), + //UnoCSS({ injectReset: true }), ghostcms({ ghostURL: 'https://ghostdemo.matthiesen.xyz', ThemeProvider: { - theme: "@matthiesenxyz/astro-ghostcms-brutalbyelian", + theme: "@matthiesenxyz/astro-ghostcms-catppuccin", }, verbose: true, }), diff --git a/playgrounds/astro-playground/package.json b/playgrounds/astro-playground/package.json index acd2ad03..54811c23 100644 --- a/playgrounds/astro-playground/package.json +++ b/playgrounds/astro-playground/package.json @@ -14,6 +14,7 @@ "astro": "^4.4.13", "@matthiesenxyz/astro-ghostcms": "workspace:*", "@matthiesenxyz/astro-ghostcms-theme-default": "workspace:*", + "@matthiesenxyz/astro-ghostcms-catppuccin": "workspace:*", "@matthiesenxyz/astro-ghostcms-brutalbyelian": "workspace:*", "@astrojs/tailwind": "^5.1.0", "@unocss/astro": "^0.58.5", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 53fd0ec4..44fe7b33 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -147,7 +147,7 @@ importers: dependencies: '@astrojs/tailwind': specifier: ^5.1.0 - version: 5.1.0(astro@4.3.7)(tailwindcss@3.4.1) + version: 5.1.0(astro@4.4.13)(tailwindcss@3.4.1) '@catppuccin/tailwindcss': specifier: 0.1.6 version: 0.1.6(tailwindcss@3.4.1) @@ -161,17 +161,23 @@ importers: specifier: ^0.5.10 version: 0.5.10(tailwindcss@3.4.1) astro: - specifier: ^4.2.1 - version: 4.3.7(sass@1.71.1)(typescript@5.4.2) + specifier: '>=4.4.0' + version: 4.4.13(typescript@5.4.2) astro-navbar: specifier: ^2.3.1 version: 2.3.1 + astro-remote: + specifier: ^0.3.2 + version: 0.3.2 astro-seo: specifier: ^0.8.3 version: 0.8.3(typescript@5.4.2) tailwindcss: specifier: ^3.3.5 version: 3.4.1 + ultrahtml: + specifier: 1.5.3 + version: 1.5.3 packages/astro-ghostcms-rendercontent: dependencies: @@ -296,6 +302,9 @@ importers: '@matthiesenxyz/astro-ghostcms-brutalbyelian': specifier: workspace:* version: link:../../packages/astro-ghostcms-brutalbyelian + '@matthiesenxyz/astro-ghostcms-catppuccin': + specifier: workspace:* + version: link:../../packages/astro-ghostcms-catppuccin '@matthiesenxyz/astro-ghostcms-theme-default': specifier: workspace:* version: link:../../packages/astro-ghostcms-theme-default @@ -512,21 +521,6 @@ packages: transitivePeerDependencies: - supports-color - /@astrojs/tailwind@5.1.0(astro@4.3.7)(tailwindcss@3.4.1): - resolution: {integrity: sha512-BJoCDKuWhU9FT2qYg+fr6Nfb3qP4ShtyjXGHKA/4mHN94z7BGcmauQK23iy+YH5qWvTnhqkd6mQPQ1yTZTe9Ig==} - peerDependencies: - astro: ^3.0.0 || ^4.0.0 - tailwindcss: ^3.0.24 - dependencies: - astro: 4.3.7(sass@1.71.1)(typescript@5.4.2) - autoprefixer: 10.4.17(postcss@8.4.35) - postcss: 8.4.35 - postcss-load-config: 4.0.2(postcss@8.4.35) - tailwindcss: 3.4.1 - transitivePeerDependencies: - - ts-node - dev: false - /@astrojs/tailwind@5.1.0(astro@4.4.13)(tailwindcss@3.4.1): resolution: {integrity: sha512-BJoCDKuWhU9FT2qYg+fr6Nfb3qP4ShtyjXGHKA/4mHN94z7BGcmauQK23iy+YH5qWvTnhqkd6mQPQ1yTZTe9Ig==} peerDependencies: