feat: add heading links to text
Some checks failed
continuous-integration/drone/push Build is failing
Some checks failed
continuous-integration/drone/push Build is failing
This commit is contained in:
parent
21642d36b0
commit
c989c34549
@ -1,7 +1,8 @@
|
||||
import {defineConfig, envField} from 'astro/config'
|
||||
import tailwind from '@astrojs/tailwind'
|
||||
import markdoc from '@astrojs/markdoc'
|
||||
|
||||
import rehypeSlug from 'rehype-slug'
|
||||
import rehypeAutolinkHeadings from 'rehype-autolink-headings'
|
||||
import node from '@astrojs/node'
|
||||
|
||||
// https://astro.build/config
|
||||
@ -12,6 +13,25 @@ export default defineConfig({
|
||||
adapter: node({
|
||||
mode: 'standalone',
|
||||
}),
|
||||
markdown: {
|
||||
rehypePlugins: [
|
||||
rehypeSlug,
|
||||
[
|
||||
// When changing content here, also change in Heading component for mdoc files
|
||||
rehypeAutolinkHeadings,
|
||||
{
|
||||
behavior: 'append',
|
||||
content: {
|
||||
type: 'text',
|
||||
value: '#',
|
||||
},
|
||||
properties: {
|
||||
className: ['anchor-link ml-1'],
|
||||
},
|
||||
},
|
||||
],
|
||||
],
|
||||
},
|
||||
experimental: {
|
||||
env: {
|
||||
schema: {
|
||||
|
@ -1,4 +1,4 @@
|
||||
import {defineMarkdocConfig, component} from '@astrojs/markdoc/config'
|
||||
import {defineMarkdocConfig, nodes, component} from '@astrojs/markdoc/config'
|
||||
import shiki from '@astrojs/markdoc/shiki'
|
||||
|
||||
export default defineMarkdocConfig({
|
||||
@ -24,4 +24,10 @@ export default defineMarkdocConfig({
|
||||
},
|
||||
},
|
||||
},
|
||||
nodes: {
|
||||
heading: {
|
||||
...nodes.heading,
|
||||
render: component('./src/components/Heading.astro'),
|
||||
},
|
||||
},
|
||||
})
|
@ -23,6 +23,8 @@
|
||||
"@tailwindcss/forms": "^0.5.7",
|
||||
"@tailwindcss/typography": "^0.5.13",
|
||||
"astro": "^4.10.3",
|
||||
"rehype-autolink-headings": "^7.1.0",
|
||||
"rehype-slug": "^6.0.0",
|
||||
"tailwindcss": "^3.4.4",
|
||||
"typescript": "^5.4.5"
|
||||
},
|
||||
|
@ -41,6 +41,12 @@ importers:
|
||||
astro:
|
||||
specifier: ^4.10.3
|
||||
version: 4.10.3(@types/node@20.14.9)(typescript@5.4.5)
|
||||
rehype-autolink-headings:
|
||||
specifier: ^7.1.0
|
||||
version: 7.1.0
|
||||
rehype-slug:
|
||||
specifier: ^6.0.0
|
||||
version: 6.0.0
|
||||
tailwindcss:
|
||||
specifier: ^3.4.4
|
||||
version: 3.4.4
|
||||
@ -1739,6 +1745,9 @@ packages:
|
||||
hast-util-from-parse5@8.0.1:
|
||||
resolution: {integrity: sha512-Er/Iixbc7IEa7r/XLtuG52zoqn/b3Xng/w6aZQ0xGVxzhw5xUFxcRqdPzP6yFi/4HBYRaifaI5fQ1RH8n0ZeOQ==}
|
||||
|
||||
hast-util-heading-rank@3.0.0:
|
||||
resolution: {integrity: sha512-EJKb8oMUXVHcWZTDepnr+WNbfnXKFNf9duMesmr4S8SXTJBJ9M4Yok08pu9vxdJwdlGRhVumk9mEhkEvKGifwA==}
|
||||
|
||||
hast-util-is-element@3.0.0:
|
||||
resolution: {integrity: sha512-Val9mnv2IWpLbNPqc/pUem+a7Ipj2aHacCwgNfTiK0vJKl0LF+4Ba4+v1oPHFpf3bLYmreq0/l3Gud9S5OH42g==}
|
||||
|
||||
@ -1754,6 +1763,9 @@ packages:
|
||||
hast-util-to-parse5@8.0.0:
|
||||
resolution: {integrity: sha512-3KKrV5ZVI8if87DVSi1vDeByYrkGzg4mEfeu4alwgmmIeARiBLKCZS2uw5Gb6nU9x9Yufyj3iudm6i7nl52PFw==}
|
||||
|
||||
hast-util-to-string@3.0.0:
|
||||
resolution: {integrity: sha512-OGkAxX1Ua3cbcW6EJ5pT/tslVb90uViVkcJ4ZZIMW/R33DX/AkcJcRrPebPwJkHYwlDHXz4aIwvAAaAdtrACFA==}
|
||||
|
||||
hast-util-to-text@4.0.2:
|
||||
resolution: {integrity: sha512-KK6y/BN8lbaq654j7JgBydev7wuNMcID54lkRav1P0CaE1e47P72AWWPiGKXTJU271ooYzcvTAn/Zt0REnvc7A==}
|
||||
|
||||
@ -2374,12 +2386,18 @@ packages:
|
||||
resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==}
|
||||
engines: {node: '>=8.10.0'}
|
||||
|
||||
rehype-autolink-headings@7.1.0:
|
||||
resolution: {integrity: sha512-rItO/pSdvnvsP4QRB1pmPiNHUskikqtPojZKJPPPAVx9Hj8i8TwMBhofrrAYRhYOOBZH9tgmG5lPqDLuIWPWmw==}
|
||||
|
||||
rehype-parse@9.0.0:
|
||||
resolution: {integrity: sha512-WG7nfvmWWkCR++KEkZevZb/uw41E8TsH4DsY9UxsTbIXCVGbAs4S+r8FrQ+OtH5EEQAs+5UxKC42VinkmpA1Yw==}
|
||||
|
||||
rehype-raw@7.0.0:
|
||||
resolution: {integrity: sha512-/aE8hCfKlQeA8LmyeyQvQF3eBiLRGNlfBJEvWH7ivp9sBqs7TNqBL5X3v157rM4IFETqDnIOO+z5M/biZbo9Ww==}
|
||||
|
||||
rehype-slug@6.0.0:
|
||||
resolution: {integrity: sha512-lWyvf/jwu+oS5+hL5eClVd3hNdmwM1kAC0BUvEGD19pajQMIzcNUd/k9GsfQ+FfECvX+JE+e9/btsKH0EjJT6A==}
|
||||
|
||||
rehype-stringify@10.0.0:
|
||||
resolution: {integrity: sha512-1TX1i048LooI9QoecrXy7nGFFbFSufxVRAfc6Y9YMRAi56l+oB0zP51mLSV312uRuvVLPV1opSlJmslozR1XHQ==}
|
||||
|
||||
@ -4562,6 +4580,10 @@ snapshots:
|
||||
vfile-location: 5.0.2
|
||||
web-namespaces: 2.0.1
|
||||
|
||||
hast-util-heading-rank@3.0.0:
|
||||
dependencies:
|
||||
'@types/hast': 3.0.4
|
||||
|
||||
hast-util-is-element@3.0.0:
|
||||
dependencies:
|
||||
'@types/hast': 3.0.4
|
||||
@ -4611,6 +4633,10 @@ snapshots:
|
||||
web-namespaces: 2.0.1
|
||||
zwitch: 2.0.4
|
||||
|
||||
hast-util-to-string@3.0.0:
|
||||
dependencies:
|
||||
'@types/hast': 3.0.4
|
||||
|
||||
hast-util-to-text@4.0.2:
|
||||
dependencies:
|
||||
'@types/hast': 3.0.4
|
||||
@ -5350,6 +5376,15 @@ snapshots:
|
||||
dependencies:
|
||||
picomatch: 2.3.1
|
||||
|
||||
rehype-autolink-headings@7.1.0:
|
||||
dependencies:
|
||||
'@types/hast': 3.0.4
|
||||
'@ungap/structured-clone': 1.2.0
|
||||
hast-util-heading-rank: 3.0.0
|
||||
hast-util-is-element: 3.0.0
|
||||
unified: 11.0.5
|
||||
unist-util-visit: 5.0.0
|
||||
|
||||
rehype-parse@9.0.0:
|
||||
dependencies:
|
||||
'@types/hast': 3.0.4
|
||||
@ -5362,6 +5397,14 @@ snapshots:
|
||||
hast-util-raw: 9.0.4
|
||||
vfile: 6.0.1
|
||||
|
||||
rehype-slug@6.0.0:
|
||||
dependencies:
|
||||
'@types/hast': 3.0.4
|
||||
github-slugger: 2.0.0
|
||||
hast-util-heading-rank: 3.0.0
|
||||
hast-util-to-string: 3.0.0
|
||||
unist-util-visit: 5.0.0
|
||||
|
||||
rehype-stringify@10.0.0:
|
||||
dependencies:
|
||||
'@types/hast': 3.0.4
|
||||
|
16
src/components/Heading.astro
Normal file
16
src/components/Heading.astro
Normal file
@ -0,0 +1,16 @@
|
||||
---
|
||||
interface Props {
|
||||
level: number
|
||||
id: string
|
||||
}
|
||||
|
||||
const {level, id} = Astro.props
|
||||
const HeadingTag = `h${level}`
|
||||
|
||||
// When changing content here, also change in astro.config.mjs for md files
|
||||
---
|
||||
|
||||
<HeadingTag id={id}>
|
||||
<slot/>
|
||||
<a href={'#'+id}>#</a>
|
||||
</HeadingTag>
|
@ -2,7 +2,10 @@ const defaultTheme = require('tailwindcss/defaultTheme');
|
||||
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
export default {
|
||||
content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
|
||||
content: [
|
||||
'./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}',
|
||||
'astro.config.mjs',
|
||||
],
|
||||
darkMode: 'selector',
|
||||
theme: {
|
||||
extend: {
|
||||
|
Loading…
Reference in New Issue
Block a user