diff --git a/astro.config.mjs b/astro.config.mjs index 4df16f4..6779ab9 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -1,8 +1,10 @@ import { defineConfig, passthroughImageService } from 'astro/config'; import starlight from '@astrojs/starlight'; -import starlightImageZoom from 'starlight-image-zoom' +import starlightImageZoom from 'starlight-image-zoom'; import rehypeAstroRelativeMarkdownLinks from "astro-rehype-relative-markdown-links"; -import starlightLinksValidator from 'starlight-links-validator' +import starlightLinksValidator from 'starlight-links-validator'; +import { rehypeHeadingIds } from '@astrojs/markdown-remark'; +import rehypeAutolinkHeadings from 'rehype-autolink-headings'; const options = { contentPath: 'src/content/docs', @@ -31,6 +33,7 @@ export default defineConfig({ }, customCss: [ './src/styles/custom.css', + './src/styles/headings.css', ], editLink: { @@ -371,7 +374,17 @@ export default defineConfig({ }), ], markdown: { - rehypePlugins: [[rehypeAstroRelativeMarkdownLinks, options]], + rehypePlugins: [ + [rehypeAstroRelativeMarkdownLinks, options], + rehypeHeadingIds, + [ + rehypeAutolinkHeadings, + { + behavior: 'wrap', + }, + ], + + ], }, redirects: { "/getting-started/test-plans": "/project/plans", diff --git a/package.json b/package.json index 5611f89..c650457 100644 --- a/package.json +++ b/package.json @@ -25,6 +25,7 @@ "slugify": "^1.6.6" }, "dependencies": { + "@astrojs/markdown-remark": "^6.0.2", "@astrojs/starlight": "^0.31.1", "@octokit/core": "^5.1.0", "@pagefind/default-ui": "^1.3.0", @@ -38,6 +39,7 @@ "dotenv": "^16.4.7", "gray-matter": "^4.0.3", "meilisearch-docsearch": "^0.7.0", + "rehype-autolink-headings": "^7.1.0", "schema-dts": "^1.1.2", "sharp": "^0.33.5", "starlight-image-zoom": "^0.10.1", diff --git a/src/styles/headings.css b/src/styles/headings.css new file mode 100644 index 0000000..02aaa6b --- /dev/null +++ b/src/styles/headings.css @@ -0,0 +1,9 @@ +/* Style the Markdown heading links. */ +.sl-markdown-content :is(h1, h2, h3, h4, h5, h6) > a { + color: var(--sl-color-white); + text-decoration: none; + + &:hover { + text-decoration: underline; + } +} \ No newline at end of file