fix: fixed rehype & remark plugins

This commit is contained in:
Sergey Yarkov 2022-08-17 16:56:08 +03:00
parent 793d621369
commit 11baec1177
2 changed files with 52 additions and 46 deletions

View File

@ -6,6 +6,10 @@ import solid from "@astrojs/solid-js";
import image from "@astrojs/image"; import image from "@astrojs/image";
// import compress from "astro-compress"; // import compress from "astro-compress";
import mdx from "@astrojs/mdx"; import mdx from "@astrojs/mdx";
import remarkGfm from "remark-gfm";
import remarkSmartypants from "remark-smartypants";
import rehypeSlug from "rehype-slug";
import rehypeAutolinkHeadings from "rehype-autolink-headings";
const createAnchorLabel = (heading) => { const createAnchorLabel = (heading) => {
const node = h("span.anchor-label", escape(heading)); const node = h("span.anchor-label", escape(heading));
@ -16,15 +20,15 @@ const createAnchorLabel = (heading) => {
// https://astro.build/config // https://astro.build/config
export default defineConfig({ export default defineConfig({
site: "https://yarkov.tech", site: "https://yarkov.tech",
integrations: [solid(), image(), mdx()], integrations: [
trailingSlash: "always", solid(),
markdown: { image(),
syntaxHighlight: "prism", mdx({
remarkPlugins: ["remark-gfm", "remark-smartypants"], remarkPlugins: [remarkGfm, remarkSmartypants],
rehypePlugins: [ rehypePlugins: [
"rehype-slug", rehypeSlug,
[ [
"rehype-autolink-headings", rehypeAutolinkHeadings,
{ {
properties: { properties: {
class: "anchor-link", class: "anchor-link",
@ -61,6 +65,11 @@ export default defineConfig({
}, },
], ],
], ],
}),
],
trailingSlash: "always",
markdown: {
syntaxHighlight: "prism",
}, },
vite: { vite: {
ssr: { ssr: {

View File

@ -17,10 +17,6 @@
padding-bottom: 5px; padding-bottom: 5px;
} }
h2 {
border-bottom: 1px solid var(--border-color);
}
& ul { & ul {
padding-left: 1.5rem; padding-left: 1.5rem;
line-height: var(--line-height-base); line-height: var(--line-height-base);
@ -177,6 +173,7 @@
& .anchor-icon { & .anchor-icon {
position: absolute; position: absolute;
left: -25px; left: -25px;
top: -13px;
} }
& svg { & svg {
vertical-align: middle; vertical-align: middle;