Chris Swithinbank delucis

This script is a quick way to migrate existing Astro-flavoured Markdown pages in an Astro project to MDX pages.

It does the following:

Loads all *.md files in your src/pages/ directory
Parses each page’s frontmatter
Moves the contents of setup in frontmatter into the main file body as required for imports in MDX
Writes the updated contents of each page to the same location but as .mdx instead of .md
Deletes the original .md file

This Gist is used in the Astro Embed documentation.

This small utility demonstrates transforming an object to data-* attributes for use in server templating. The data-* attributes match how a browser maps to JS, so you can use it and get back your original keys on the client from an element’s dataset property.

For example, in an Astro component:

---
import { dataset } from './dataset';

const data = { Example: "value", count: 10, backgroundColor: '#fff' };

	const plugin = require('tailwindcss/plugin');

	const BevelPlugin = plugin(function bevelPlugin({ addUtilities, e }) {
	const base = 0.5;

	const absoluteSizes = Object.entries({
	md: 1.5,
	lg: 2,
	xl: 3,
	'2xl': 4,

	/**
	* Get a list of the moves that are currently available to a specific player.
	*
	* @param {import("boardgame.io").Game} game boardgame.io game object
	* @param {import("boardgame.io").Ctx} ctx current game context object
	* @param {import("boardgame.io").PlayerID} playerID the ID of the player to get moves for
	* @returns {string[]} an array of move names
	*
	* @example
	* const game = {

	/**
	* Simple observable value store.
	* @template {any} T
	* @param {T \| Promise<T>} initial
	*/
	export function Store(initial) {
	/** @type {Set<(newValue: T) => void>} */
	const subscribers = new Set();
	const store = { value: Promise.resolve(initial) };
	return {

	// Fetch all themes from the Astro theme API.
	const allThemes = await fetch('https://portal.astro.build/api/themes').then((res) => res.json());
	// Fetch all themes tagged as using Tailwind from the Astro theme API.
	const tailwindThemes = await fetch(
	'https://portal.astro.build/api/themes?technology%5B%5D=tailwind'
	).then((res) => res.json());
	// Filter out themes using Tailwind from the list of all themes.
	const themesWithoutTailwind = allThemes.filter(
	(theme) =>
	// Check that Tailwind isn’t mentioned in the theme’s description or body.