diff --git a/microsite/README.md b/microsite/README.md index 26c25dc175..5bd20254b6 100644 --- a/microsite/README.md +++ b/microsite/README.md @@ -233,3 +233,9 @@ Full documentation can be found on the [Docusaurus website](https://docusaurus.i - `highlight-remove-next-line` - `highlight-remove-start` - `highlight-remove-end` + +## Feedback widget + +A feedback widget is provided by the `docusaurus-pushfeedback` plugin, which connects to the https://pushfeedback.com service. Styling of the button is configured in `microsite/src/theme/customTheme.scss`, while the plugin itself is configured in `microsite/docusaurus.config.js`. + +Feedback submissions are connected to an account owned by @Rugvip and are available on request, reach out to @Rugvip on [Discord](https://discord.gg/backstage-687207715902193673). diff --git a/microsite/docusaurus.config.js b/microsite/docusaurus.config.js index c942080db9..99be57788c 100644 --- a/microsite/docusaurus.config.js +++ b/microsite/docusaurus.config.js @@ -163,6 +163,15 @@ module.exports = { ], }, ], + [ + 'docusaurus-pushfeedback', + { + project: 'q8w1i6cair', + hideIcon: true, + customFont: true, + buttonStyle: 'dark', + }, + ], ], themeConfig: /** @type {import('@docusaurus/preset-classic').ThemeConfig} */ diff --git a/microsite/package.json b/microsite/package.json index d5efa8196b..1be5272286 100644 --- a/microsite/package.json +++ b/microsite/package.json @@ -1,21 +1,37 @@ { - "version": "0.0.0", "name": "backstage-microsite", - "license": "Apache-2.0", + "version": "0.0.0", "private": true, + "license": "Apache-2.0", "scripts": { - "start": "node scripts/pre-build.js && docusaurus start", "build": "node scripts/pre-build.js && docusaurus build", - "prettier:fix": "prettier --write .", - "prettier:check": "prettier --check .", - "publish-gh-pages": "docusaurus-publish", - "write-translations": "docusaurus-write-translations", - "version": "docusaurus-version", - "rename-version": "docusaurus-rename-version", - "verify:sidebars": "node ./scripts/verify-sidebars", - "swizzle": "docusaurus swizzle", "deploy": "docusaurus deploy", - "docusaurus": "docusaurus" + "docusaurus": "docusaurus", + "prettier:check": "prettier --check .", + "prettier:fix": "prettier --write .", + "publish-gh-pages": "docusaurus-publish", + "rename-version": "docusaurus-rename-version", + "start": "node scripts/pre-build.js && docusaurus start", + "swizzle": "docusaurus swizzle", + "verify:sidebars": "node ./scripts/verify-sidebars", + "version": "docusaurus-version", + "write-translations": "docusaurus-write-translations" + }, + "prettier": "@spotify/prettier-config", + "dependencies": { + "@docusaurus/core": "^3.1.1", + "@docusaurus/plugin-client-redirects": "^3.1.1", + "@docusaurus/preset-classic": "^3.1.1", + "@swc/core": "^1.3.46", + "clsx": "^2.0.0", + "docusaurus-plugin-sass": "^0.2.3", + "docusaurus-pushfeedback": "^1.0.0", + "luxon": "^3.0.0", + "prism-react-renderer": "^1.3.5", + "react": "^18.0.0", + "react-dom": "^18.0.0", + "sass": "^1.57.1", + "swc-loader": "^0.2.3" }, "devDependencies": { "@docusaurus/module-type-aliases": "^3.1.1", @@ -27,20 +43,5 @@ "prettier": "^2.6.2", "typescript": "~5.1.0", "yaml-loader": "^0.8.0" - }, - "prettier": "@spotify/prettier-config", - "dependencies": { - "@docusaurus/core": "^3.1.1", - "@docusaurus/plugin-client-redirects": "^3.1.1", - "@docusaurus/preset-classic": "^3.1.1", - "@swc/core": "^1.3.46", - "clsx": "^2.0.0", - "docusaurus-plugin-sass": "^0.2.3", - "luxon": "^3.0.0", - "prism-react-renderer": "^1.3.5", - "react": "^18.0.0", - "react-dom": "^18.0.0", - "sass": "^1.57.1", - "swc-loader": "^0.2.3" } } diff --git a/microsite/src/theme/customTheme.scss b/microsite/src/theme/customTheme.scss index b29f76d3c0..51615ed0dc 100644 --- a/microsite/src/theme/customTheme.scss +++ b/microsite/src/theme/customTheme.scss @@ -121,3 +121,26 @@ } /* #endregion */ + +/* For the docusaurus-pushfeedback plugin */ +:root { + --feedback-primary-color: var(--ifm-color-primary); + --feedback-button-dark-text-color: var(--ifm-color-black); + + --feedback-modal-button-submit-bg-color: var(--ifm-color-primary); + --feedback-modal-button-submit-bg-color-hover: var(--ifm-color-primary-dark); + + --feedback-modal-button-submit-text-color: var(--ifm-color-black); + --feedback-modal-button-submit-text-color-hover: var(--ifm-color-black); + + --feedback-button-text-font-size: 1rem; + --feedback-button-text-font-weight: 600; +} + +/* Hide feedback button unless we're in docs */ +feedback-button { + display: none; +} +html.plugin-docs feedback-button { + display: initial; +} diff --git a/microsite/yarn.lock b/microsite/yarn.lock index 4313047a75..51e5f3e25e 100644 --- a/microsite/yarn.lock +++ b/microsite/yarn.lock @@ -3862,6 +3862,7 @@ __metadata: "@types/webpack-env": ^1.18.0 clsx: ^2.0.0 docusaurus-plugin-sass: ^0.2.3 + docusaurus-pushfeedback: ^1.0.0 js-yaml: ^4.1.0 luxon: ^3.0.0 prettier: ^2.6.2 @@ -5115,6 +5116,15 @@ __metadata: languageName: node linkType: hard +"docusaurus-pushfeedback@npm:^1.0.0": + version: 1.0.0 + resolution: "docusaurus-pushfeedback@npm:1.0.0" + peerDependencies: + "@docusaurus/core": 3.x + checksum: 5f119fac4b18198ecab7ca3892b8d19ea21c1f4147b7500de0f2a341651630ff090e38ac4984e33d87729f1b00d621ae8945efe2a2ea37b9a74b76c7f468f21e + languageName: node + linkType: hard + "dom-converter@npm:^0.2.0": version: 0.2.0 resolution: "dom-converter@npm:0.2.0"