diff --git a/packages/app-web-docs/docusaurus.config.mts b/packages/app-web-docs/docusaurus.config.mts index 78fbf256ae6..48cc2ce3a71 100644 --- a/packages/app-web-docs/docusaurus.config.mts +++ b/packages/app-web-docs/docusaurus.config.mts @@ -178,7 +178,7 @@ const config: Config = { alt: "Cursorless", src: "logo.svg", srcDark: "logo-dark.svg", - href: "https://www.cursorless.org/", + href: "https://www.cursorless.org", target: "_self", }, items: [ @@ -196,6 +196,12 @@ const config: Config = { sidebarId: "contributing", label: "For contributors", }, + { + href: "https://github.com/sponsors/cursorless-dev", + position: "right", + className: "header-sponsor-link", + "aria-label": "Sponsor Cursorless", + }, { href: "https://github.com/cursorless-dev/cursorless", position: "right", diff --git a/packages/app-web-docs/src/css/github-link.scss b/packages/app-web-docs/src/css/github-link.scss index 090404f5fd1..74127f97b3e 100644 --- a/packages/app-web-docs/src/css/github-link.scss +++ b/packages/app-web-docs/src/css/github-link.scss @@ -1,4 +1,22 @@ /* From https://github.com/facebook/docusaurus/blob/cc0bceab9c1678303f6237f5526753edc1b12fc3/website/src/css/custom.css#L70-L86 */ +.header-sponsor-link:hover { + opacity: 0.6; +} + +.header-sponsor-link::before { + content: ""; + width: 24px; + height: 24px; + display: flex; + background-color: #bf3989; + mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m8 14.25.345.666a.75.75 0 0 1-.69 0l-.008-.004-.018-.01a7.152 7.152 0 0 1-.31-.17 22.055 22.055 0 0 1-3.434-2.414C2.045 10.731 0 8.35 0 5.5 0 2.836 2.086 1 4.25 1 5.797 1 7.153 1.802 8 3.02 8.847 1.802 10.203 1 11.75 1 13.914 1 16 2.836 16 5.5c0 2.85-2.045 5.231-3.885 6.818a22.066 22.066 0 0 1-3.744 2.584l-.018.01-.006.003h-.002ZM4.25 2.5c-1.336 0-2.75 1.164-2.75 3 0 2.15 1.58 4.144 3.365 5.682A20.58 20.58 0 0 0 8 13.393a20.58 20.58 0 0 0 3.135-2.211C12.92 9.644 14.5 7.65 14.5 5.5c0-1.836-1.414-3-2.75-3-1.373 0-2.609.986-3.029 2.456a.749.749 0 0 1-1.442 0C6.859 3.486 5.623 2.5 4.25 2.5Z'/%3E%3C/svg%3E") + no-repeat center / contain; +} + +[data-theme="dark"] .header-sponsor-link::before { + background-color: #db61a2; +} + .header-github-link:hover { opacity: 0.6; }