feat: support dark mode and revamp docs visuals (#91)

* feat: revamp docs visuals

* ci: use github runners instead of custom runners

* feat: support dark mode and update tailwind

* fix: fix header theme on landing page and minor styling issues

* ci: fix storybook build

* fix: use source inline instead of safelist

* fix: fix preflight import

* fix: fix table of contents styling

* fix: fix font size in code blocks

* fix: fix code blocks styling

* fix: new theme switcher icon, auto hide header, minor code block fixes

* chore: fix linting issues

Author: shadowusr

.github/workflows/checks.yml

@@ -15,7 +15,7 @@ concurrency:
 
 jobs:
     build:
-        runs-on: self-hosted-arc
+        runs-on: ubuntu-latest
 
         strategy:
             matrix:
@@ -33,7 +33,7 @@ jobs:
             - run: npm test
 
     deploy-static:
-        runs-on: self-hosted-arc
+        runs-on: ubuntu-latest
         environment: CI
 
         strategy:

.github/workflows/deploy.yml

@@ -17,7 +17,7 @@ jobs:
     # Build job
     build:
         environment: CI
-        runs-on: self-hosted-arc
+        runs-on: ubuntu-latest
         steps:
             - uses: actions/checkout@v4
             - uses: actions/setup-node@v4

.storybook/main.ts

@@ -47,11 +47,7 @@ const config: StorybookConfig = {
             options: {
                 postcssOptions: {
                     ident: "postcss",
-                    plugins: [
-                        require("postcss-import"),
-                        require("tailwindcss"),
-                        require("autoprefixer"),
-                    ],
+                    plugins: [require("@tailwindcss/postcss")],
                 },
             },
         };

docs/command-line/index.mdx

@@ -192,6 +192,7 @@ testplane --repl --grep 'my test name' --browser chrome
 -   `--keep-browser-on-fail` - the same as the `--keep-browser` option, but the browser will only remain open if the tests fail.
 
 Example of console output with connection information to the browser:
+
 ```
 [15:44:38 +0700] Testplane run has finished, but the browser won't be closed, because you passed the --keep-browser argument.
 [15:44:38 +0700] You may attach to this browser using the following capabilities:

docs/config/browsers.mdx

@@ -49,7 +49,11 @@ In this example, the value `10` will be used for the `sessionsPerBrowser` option
         <tr>
             <td>[`gridUrl`](#grid_url)</td>
             <td>`string`</td>
-            <td>`"http://localhost:4444/wd/hub"`</td>
+            <td>
+                `"http://localhost`
+                <br />
+                `:4444/wd/hub"`
+            </td>
             <td>Selenium grid URL.</td>
         </tr>
         <tr>

docs/guides/local-browsers.mdx

@@ -81,7 +81,7 @@ Supported browser versions per OS:
 |  Edge   | \*      | \*    | \*        | \*        | \*        |
 | Safari  | -       | \*    | -         | -         | -         |
 
--   -   Browser auto download is not supported, but if the browser is installed by the user himself, installed version will be used by Testplane.
+> `*` — browser auto download is not supported, but if the browser is installed by the user himself, installed version will be used by Testplane.
 
 For virtual environments, you would need to run headless. "--no-sandbox" CLI arg for "chrome" browser could also be necessary:
 

docs/reference/testplane-standalone-api.mdx

@@ -18,7 +18,7 @@ import { launchBrowser } from "testplane/unstable";
 // Launch a new browser with the given settings
 const browser = await launchBrowser({
     desiredCapabilities: {
-        browserName: 'chrome',
+        browserName: "chrome",
     },
     headless: false,
 });

docusaurus.config.ts

@@ -45,6 +45,7 @@ const config: Config = {
                     sidebarPath: "./sidebars.ts",
                     editUrl: "https://github.com/gemini-testing/testplane-docs/tree/master/",
                     lastVersion: "current",
+                    breadcrumbs: false,
                     versions: {
                         current: {
                             label: "v8",
@@ -65,11 +66,20 @@ const config: Config = {
 
     themeConfig: {
         colorMode: {
-            disableSwitch: true,
+            disableSwitch: false,
         },
         image: "img/docusaurus-social-card.jpg",
         navbar: {
+            hideOnScroll: true,
             title: "testplane",
+            logo: {
+                alt: "Testplane Logo",
+                src: "img/logo.svg",
+                srcDark: "img/logo-dark.svg",
+                target: "_self",
+                width: 28,
+                height: 28,
+            },
             items: [
                 {
                     type: "docSidebar",
@@ -167,7 +177,6 @@ const config: Config = {
                     ],
                 },
             ],
-            copyright: `MIT License © ${new Date().getFullYear()}`,
         },
         prism: {
             theme: prismThemes.github,

i18n/ru/docusaurus-plugin-content-docs/current/command-line/index.mdx

@@ -193,6 +193,7 @@ testplane --repl --grep 'my test name' --browser chrome
 -   `--keep-browser-on-fail` - то же, что и опция `--keep-browser`, только браузер останется только в том случае, если тесты завершатся неуспешно
 
 Пример вывода в консоли c информацией для подключения к браузеру
+
 ```
 [15:44:38 +0700] Testplane run has finished, but the browser won't be closed, because you passed the --keep-browser argument.
 [15:44:38 +0700] You may attach to this browser using the following capabilities:

i18n/ru/docusaurus-plugin-content-docs/current/config/browsers.mdx

@@ -49,7 +49,11 @@ import AssertViewOptions from "@site/docs/_partials/specs/assert-view-options.md
         <tr>
             <td>[`gridUrl`](#grid_url)</td>
             <td>`string`</td>
-            <td>`"http://localhost:4444/wd/hub"`</td>
+            <td>
+                `"http://localhost`
+                <br />
+                `:4444/wd/hub"`
+            </td>
             <td>URL грида Selenium.</td>
         </tr>
         <tr>