Upstream/waveterm
1
0
Fork 0
mirror of https://github.com/wavetermdev/waveterm.git synced 2025-03-12 13:29:15 +01:00
Code Issues Packages Projects Releases Wiki Activity

Add code highlighting to docsite (#1866)

Browse Source
This commit is contained in:
Evan Simkowitz 2025-01-28 19:38:43 -08:00 committed by GitHub
parent 50c3710d4b
commit 1bcbed0bd7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 122 additions and 116 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
docs/docusaurus.config.ts
View File

@ -1,4 +1,5 @@
import type { Config } from "@docusaurus/types";
import rehypeHighlight from "rehype-highlight";
import { docOgRenderer } from "./src/renderer/image-renderers";
const baseUrl = process.env.EMBEDDED ? "/docsite/" : "/";
@ -40,6 +41,7 @@ const config: Config = {
routeBasePath: "/",
exclude: ["features/**"],
editUrl: !process.env.EMBEDDED ? "https://github.com/wavetermdev/waveterm/edit/main/docs/" : undefined,
rehypePlugins: [rehypeHighlight],
} as import("@docusaurus/plugin-content-docs").Options,
],
"ideal-image",
@ -63,7 +65,7 @@ const config: Config = {
"@docusaurus/plugin-svgr",
].filter((v) => v),
themes: [
["classic", { customCss: "src/css/custom.css" }],
["classic", { customCss: "src/css/custom.scss" }],
!process.env.EMBEDDED && "@docusaurus/theme-search-algolia",
].filter((v) => v),
themeConfig: {

1
docs/package.json
View File

@ -30,6 +30,7 @@
"prism-react-renderer": "^2.4.1",
"react": "^18.0.0",
"react-dom": "^18.0.0",
"rehype-highlight": "^7.0.1",
"remark-gfm": "^4.0.0",
"remark-typescript-code-import": "^1.0.1",
"sass": "^1.83.4",

115
docs/src/css/custom.css
View File

@ -1,115 +0,0 @@
:root {
--ifm-background-color: #ffffff;
--ifm-color-primary: #1a660b;
--ifm-color-primary-dark: #175c0a;
--ifm-color-primary-darker: #165709;
--ifm-color-primary-darkest: #124708;
--ifm-color-primary-light: #1d700c;
--ifm-color-primary-lighter: #1e750d;
--ifm-color-primary-lightest: #22850e;
}
[data-theme="dark"] {
--ifm-background-color: #1b1b1d;
--ifm-color-primary: #58c142;
--ifm-color-primary-dark: #4eb03a;
--ifm-color-primary-darker: #4aa636;
--ifm-color-primary-darkest: #429431;
--ifm-color-primary-light: #69c756;
--ifm-color-primary-lighter: #72cb5f;
--ifm-color-primary-lightest: #8cd47d;
}
.docs-doc-id-index article nav {
display: none;
}
body .markdown h1:first-child {
--ifm-h1-font-size: 2rem;
}
body .markdown h2 {
--ifm-h2-font-size: 1.75rem;
}
@media (min-width: 996px) {
.reference-links {
display: none;
}
}
/* Adds extra margin between last navbar item and the dark mode toggle. */
.navbar__items--right .navbar__item:last-of-type {
margin-right: 4px;
}
.header-link-custom:before {
display: block;
height: 24px;
width: 24px;
background-color: var(--ifm-navbar-link-color);
transition: background-color 0.15s linear;
}
.header-link-custom:hover:before {
background-color: var(--ifm-navbar-link-hover-color);
}
.custom-icon-inline:before {
display: inline-block;
height: 16px;
width: 16px;
background-color: var(--ifm-color-primary-contrast-foreground);
transition: background-color 0.15s linear;
}
.custom-icon-github:before {
content: "";
mask: url(/img/github.svg) no-repeat center / contain;
-webkit-mask: url(/img/github.svg) no-repeat center / contain;
}
.custom-icon-discord:before {
content: "";
mask: url(/img/discord.svg) no-repeat center / contain;
-webkit-mask: url(/img/discord.svg) no-repeat center / contain;
}
.custom-icon-workspace:before {
content: "";
mask: url(/img/workspace.svg) no-repeat center / contain;
-webkit-mask: url(/img/workspace.svg) no-repeat center / contain;
}
.custom-icon-magnify-enabled:before {
content: "";
mask: url(/img/magnify-enabled.svg) no-repeat center / contain;
-webkit-mask: url(/img/magnify-enabled.svg) no-repeat center / contain;
margin-bottom: -2px;
}
.custom-icon-magnify-disabled:before {
content: "";
mask: url(/img/magnify-disabled.svg) no-repeat center / contain;
-webkit-mask: url(/img/magnify-disabled.svg) no-repeat center / contain;
margin-bottom: -2px;
}
img[src*="#left"] {
float: left;
margin: 0 10px 10px 0;
max-width: 300px;
}
img[src*="#right"] {
float: right;
margin: 0 0 10px 10px;
max-width: 300px;
}
img[src*="#center"] {
display: block;
margin: auto;
}
.hidden {
display: none;
}

117
docs/src/css/custom.scss Normal file
View File

@ -0,0 +1,117 @@
@import url("../../../node_modules/highlight.js/scss/github-dark-dimmed.scss");
:root {
--ifm-background-color: #ffffff;
--ifm-color-primary: #1a660b;
--ifm-color-primary-dark: #175c0a;
--ifm-color-primary-darker: #165709;
--ifm-color-primary-darkest: #124708;
--ifm-color-primary-light: #1d700c;
--ifm-color-primary-lighter: #1e750d;
--ifm-color-primary-lightest: #22850e;
}
[data-theme="dark"] {
--ifm-background-color: #1b1b1d;
--ifm-color-primary: #58c142;
--ifm-color-primary-dark: #4eb03a;
--ifm-color-primary-darker: #4aa636;
--ifm-color-primary-darkest: #429431;
--ifm-color-primary-light: #69c756;
--ifm-color-primary-lighter: #72cb5f;
--ifm-color-primary-lightest: #8cd47d;
}
.docs-doc-id-index article nav {
display: none;
}
body .markdown h1:first-child {
--ifm-h1-font-size: 2rem;
}
body .markdown h2 {
--ifm-h2-font-size: 1.75rem;
}
@media (min-width: 996px) {
.reference-links {
display: none;
}
}
/* Adds extra margin between last navbar item and the dark mode toggle. */
.navbar__items--right .navbar__item:last-of-type {
margin-right: 4px;
}
.header-link-custom:before {
display: block;
height: 24px;
width: 24px;
background-color: var(--ifm-navbar-link-color);
transition: background-color 0.15s linear;
}
.header-link-custom:hover:before {
background-color: var(--ifm-navbar-link-hover-color);
}
.custom-icon-inline:before {
display: inline-block;
height: 16px;
width: 16px;
background-color: var(--ifm-color-primary-contrast-foreground);
transition: background-color 0.15s linear;
}
.custom-icon-github:before {
content: "";
mask: url(/img/github.svg) no-repeat center / contain;
-webkit-mask: url(/img/github.svg) no-repeat center / contain;
}
.custom-icon-discord:before {
content: "";
mask: url(/img/discord.svg) no-repeat center / contain;
-webkit-mask: url(/img/discord.svg) no-repeat center / contain;
}
.custom-icon-workspace:before {
content: "";
mask: url(/img/workspace.svg) no-repeat center / contain;
-webkit-mask: url(/img/workspace.svg) no-repeat center / contain;
}
.custom-icon-magnify-enabled:before {
content: "";
mask: url(/img/magnify-enabled.svg) no-repeat center / contain;
-webkit-mask: url(/img/magnify-enabled.svg) no-repeat center / contain;
margin-bottom: -2px;
}
.custom-icon-magnify-disabled:before {
content: "";
mask: url(/img/magnify-disabled.svg) no-repeat center / contain;
-webkit-mask: url(/img/magnify-disabled.svg) no-repeat center / contain;
margin-bottom: -2px;
}
img[src*="#left"] {
float: left;
margin: 0 10px 10px 0;
max-width: 300px;
}
img[src*="#right"] {
float: right;
margin: 0 0 10px 10px;
max-width: 300px;
}
img[src*="#center"] {
display: block;
margin: auto;
}
.hidden {
display: none;
}

1
yarn.lock
View File

@ -21603,6 +21603,7 @@ __metadata:
prism-react-renderer: "npm:^2.4.1"
react: "npm:^18.0.0"
react-dom: "npm:^18.0.0"
rehype-highlight: "npm:^7.0.1"
remark-cli: "npm:^12.0.1"
remark-frontmatter: "npm:^5.0.0"
remark-gfm: "npm:^4.0.0"