From 0c7c07330a1836762564e92961b597815acfa712 Mon Sep 17 00:00:00 2001 From: Hichem Fantar Date: Mon, 17 Jun 2024 15:46:52 +0100 Subject: [PATCH 1/7] refactor: Rename files to use TypeScript extension --- docusaurus.config.js | 166 ------------------ docusaurus.config.ts | 159 +++++++++++++++++ package-lock.json | 153 ++++++++++++++-- package.json | 12 +- sidebars.js => sidebars.ts | 5 +- .../HomepageFeatures/{index.jsx => index.tsx} | 0 .../{SponsorList.jsx => SponsorList.tsx} | 0 .../Sponsors/{Sponsor.jsx => Sponsor.tsx} | 2 +- .../Sponsors/{TopBanner.jsx => TopBanner.tsx} | 0 .../{TopBanners.jsx => TopBanners.tsx} | 0 tsconfig.json | 17 ++ 11 files changed, 329 insertions(+), 185 deletions(-) delete mode 100644 docusaurus.config.js create mode 100644 docusaurus.config.ts rename sidebars.js => sidebars.ts (86%) rename src/components/HomepageFeatures/{index.jsx => index.tsx} (100%) rename src/components/{SponsorList.jsx => SponsorList.tsx} (100%) rename src/components/Sponsors/{Sponsor.jsx => Sponsor.tsx} (94%) rename src/components/Sponsors/{TopBanner.jsx => TopBanner.tsx} (100%) rename src/components/{TopBanners.jsx => TopBanners.tsx} (100%) create mode 100644 tsconfig.json diff --git a/docusaurus.config.js b/docusaurus.config.js deleted file mode 100644 index 3593b98..0000000 --- a/docusaurus.config.js +++ /dev/null @@ -1,166 +0,0 @@ -// @ts-check -// `@type` JSDoc annotations allow editor autocompletion and type checking -// (when paired with `@ts-check`). -// There are various equivalent ways to declare your Docusaurus config. -// See: https://docusaurus.io/docs/api/docusaurus-config - -import { themes as prismThemes } from "prism-react-renderer"; - -/** @type {import('@docusaurus/types').Config} */ -const config = { - title: "Open WebUI", - tagline: "ChatGPT-Style WebUI for LLMs (Formerly Ollama WebUI)", - favicon: "img/favicon.png", - - // Set the production url of your site here - url: "https://openwebui.com", - // Set the // pathname under which your site is served - // For GitHub pages deployment, it is often '//' - baseUrl: "/", - - // GitHub pages deployment config. - // If you aren't using GitHub pages, you don't need these. - organizationName: "open-webui", // Usually your GitHub org/user name. - projectName: "docs", // Usually your repo name. - - onBrokenLinks: "throw", - onBrokenMarkdownLinks: "warn", - - // Even if you don't use internationalization, you can use this field to set - // useful metadata like html lang. For example, if your site is Chinese, you - // may want to replace "en" with "zh-Hans". - i18n: { - defaultLocale: "en", - locales: ["en"], - }, - - // Enable Mermaid for diagrams - markdown: { - mermaid: true, - }, - themes: ["@docusaurus/theme-mermaid"], - - presets: [ - [ - "classic", - /** @type {import('@docusaurus/preset-classic').Options} */ - ({ - docs: { - sidebarPath: "./sidebars.js", - routeBasePath: "/", - // Please change this to your repo. - // Remove this to remove the "edit this page" links. - editUrl: "https://github.com/open-webui/docs/blob/main", - }, - // blog: false, - blog: { - showReadingTime: true, - // Please change this to your repo. - // Remove this to remove the "edit this page" links. - // editUrl: - // "https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/", - }, - theme: { - customCss: "./src/css/custom.css", - }, - }), - ], - ], - - themeConfig: - /** @type {import('@docusaurus/preset-classic').ThemeConfig} */ - ({ - // Replace with your project's social card - // image: "img/docusaurus-social-card.jpg", - navbar: { - title: "Open WebUI", - logo: { - src: "img/logo.png", - srcDark: "img/logo-dark.png", - }, - items: [ - // { - // type: "docSidebar", - // sidebarId: "blog", - // position: "left", - // label: "Blog", - // }, - - // { - // href: "/blog", - // label: "Blog", - // position: "left", - // }, - { - href: "https://github.com/open-webui/open-webui", - label: "GitHub", - position: "right", - }, - ], - }, - footer: { - logo: { - src: "img/logo-dark.png", - height: 100, - }, - style: "light", - links: [ - { - title: "Docs", - items: [ - { - label: "Getting Started", - to: "getting-started", - }, - { - label: "FAQ", - to: "faq", - }, - ], - }, - { - title: "Community", - items: [ - { - label: "GitHub", - href: "https://github.com/open-webui/open-webui", - }, - { - label: "Discord", - href: "https://discord.gg/5rJgQTnV4s", - }, - { - label: "Twitter", - href: "https://twitter.com/OpenWebUI", - }, - ], - }, - { - title: "More", - items: [ - { - label: "Release Notes", - to: "https://github.com/open-webui/open-webui/blob/main/CHANGELOG.md", - }, - { - label: "About", - to: "https://openwebui.com", - }, - { - label: "Research", - to: "research", - }, - ], - }, - ], - // copyright: `Copyright © ${new Date().getFullYear()} OpenWebUI`, - }, - prism: { - theme: prismThemes.github, - darkTheme: prismThemes.dracula, - }, - }), - plugins: [require.resolve("docusaurus-lunr-search")], -}; - -export default config; diff --git a/docusaurus.config.ts b/docusaurus.config.ts new file mode 100644 index 0000000..3a8c652 --- /dev/null +++ b/docusaurus.config.ts @@ -0,0 +1,159 @@ +import { Config } from "@docusaurus/types"; +import type * as Preset from "@docusaurus/preset-classic"; + +import { themes as prismThemes } from "prism-react-renderer"; + +const config: Config = { + title: "Open WebUI", + tagline: "ChatGPT-Style WebUI for LLMs (Formerly Ollama WebUI)", + favicon: "img/favicon.png", + + // Set the production url of your site here + url: "https://openwebui.com", + // Set the // pathname under which your site is served + // For GitHub pages deployment, it is often '//' + baseUrl: "/", + + // GitHub pages deployment config. + // If you aren't using GitHub pages, you don't need these. + organizationName: "open-webui", // Usually your GitHub org/user name. + projectName: "docs", // Usually your repo name. + + onBrokenLinks: "throw", + onBrokenMarkdownLinks: "warn", + + // Even if you don't use internationalization, you can use this field to set + // useful metadata like html lang. For example, if your site is Chinese, you + // may want to replace "en" with "zh-Hans". + i18n: { + defaultLocale: "en", + locales: ["en"], + }, + + // Enable Mermaid for diagrams + markdown: { + mermaid: true, + }, + themes: ["@docusaurus/theme-mermaid"], + + presets: [ + [ + "classic", + { + docs: { + sidebarPath: "./sidebars.ts", + routeBasePath: "/", + // Please change this to your repo. + // Remove this to remove the "edit this page" links. + editUrl: "https://github.com/open-webui/docs/blob/main", + }, + // blog: false, + blog: { + showReadingTime: true, + // Please change this to your repo. + // Remove this to remove the "edit this page" links. + // editUrl: + // "https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/", + }, + theme: { + customCss: "./src/css/custom.css", + }, + } satisfies Preset.Options, + ], + ], + + themeConfig: { + // Replace with your project's social card + // image: "img/docusaurus-social-card.jpg", + navbar: { + title: "Open WebUI", + logo: { + src: "img/logo.png", + srcDark: "img/logo-dark.png", + }, + items: [ + // { + // type: "docSidebar", + // sidebarId: "blog", + // position: "left", + // label: "Blog", + // }, + + // { + // href: "/blog", + // label: "Blog", + // position: "left", + // }, + { + href: "https://github.com/open-webui/open-webui", + label: "GitHub", + position: "right", + }, + ], + }, + footer: { + logo: { + src: "img/logo-dark.png", + height: 100, + }, + style: "light", + links: [ + { + title: "Docs", + items: [ + { + label: "Getting Started", + to: "getting-started", + }, + { + label: "FAQ", + to: "faq", + }, + ], + }, + { + title: "Community", + items: [ + { + label: "GitHub", + href: "https://github.com/open-webui/open-webui", + }, + { + label: "Discord", + href: "https://discord.gg/5rJgQTnV4s", + }, + { + label: "Twitter", + href: "https://twitter.com/OpenWebUI", + }, + ], + }, + { + title: "More", + items: [ + { + label: "Release Notes", + to: "https://github.com/open-webui/open-webui/blob/main/CHANGELOG.md", + }, + { + label: "About", + to: "https://openwebui.com", + }, + { + label: "Research", + to: "research", + }, + ], + }, + ], + // copyright: `Copyright © ${new Date().getFullYear()} OpenWebUI`, + }, + prism: { + theme: prismThemes.github, + darkTheme: prismThemes.dracula, + }, + } satisfies Preset.ThemeConfig, + plugins: [require.resolve("docusaurus-lunr-search")], +}; + +export default config; diff --git a/package-lock.json b/package-lock.json index f22f71e..85f319e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,22 +8,26 @@ "name": "docs", "version": "0.0.0", "dependencies": { - "@docusaurus/core": "^3.4.0", - "@docusaurus/preset-classic": "^3.4.0", - "@docusaurus/theme-mermaid": "^3.4.0", + "@docusaurus/core": "^3.2.0", + "@docusaurus/preset-classic": "^3.2.0", + "@docusaurus/theme-mermaid": "^3.2.0", "@mdx-js/react": "^3.0.0", "clsx": "^2.0.0", "docusaurus-lunr-search": "^3.4.0", + "docusaurus-plugin-sass": "^0.2.5", "prism-react-renderer": "^2.3.0", "react": "^18.0.0", - "react-dom": "^18.0.0" + "react-dom": "^18.0.0", + "sass": "^1.77.5" }, "devDependencies": { - "@docusaurus/module-type-aliases": "^3.2.0", - "@docusaurus/types": "^3.2.0", + "@docusaurus/module-type-aliases": "^3.4.0", + "@docusaurus/tsconfig": "^3.4.0", + "@docusaurus/types": "^3.4.0", "autoprefixer": "^10.4.19", "postcss": "^8.4.38", - "tailwindcss": "^3.4.3" + "tailwindcss": "^3.4.3", + "typescript": "^5.4.5" }, "engines": { "node": ">=18.0" @@ -2643,6 +2647,12 @@ "node": ">=18.0" } }, + "node_modules/@docusaurus/tsconfig": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/@docusaurus/tsconfig/-/tsconfig-3.4.0.tgz", + "integrity": "sha512-0qENiJ+TRaeTzcg4olrnh0BQ7eCxTgbYWBnWUeQDc84UYkt/T3pDNnm3SiQkqPb+YQ1qtYFlC0RriAElclo8Dg==", + "dev": true + }, "node_modules/@docusaurus/types": { "version": "3.4.0", "resolved": "https://registry.npmjs.org/@docusaurus/types/-/types-3.4.0.tgz", @@ -6360,6 +6370,18 @@ "url": "https://opencollective.com/unified" } }, + "node_modules/docusaurus-plugin-sass": { + "version": "0.2.5", + "resolved": "https://registry.npmjs.org/docusaurus-plugin-sass/-/docusaurus-plugin-sass-0.2.5.tgz", + "integrity": "sha512-Z+D0fLFUKcFpM+bqSUmqKIU+vO+YF1xoEQh5hoFreg2eMf722+siwXDD+sqtwU8E4MvVpuvsQfaHwODNlxJAEg==", + "dependencies": { + "sass-loader": "^10.1.1" + }, + "peerDependencies": { + "@docusaurus/core": "^2.0.0-beta || ^3.0.0-alpha", + "sass": "^1.30.0" + } + }, "node_modules/dom-converter": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/dom-converter/-/dom-converter-0.2.0.tgz", @@ -8470,6 +8492,11 @@ "url": "https://opencollective.com/immer" } }, + "node_modules/immutable": { + "version": "4.3.6", + "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.6.tgz", + "integrity": "sha512-Ju0+lEMyzMVZarkTn/gqRpdqd5dOPaz1mCZ0SH3JV6iFw81PldE/PEB1hWVEA288HPt4WXW8O7AWxB10M+03QQ==" + }, "node_modules/import-fresh": { "version": "3.3.0", "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz", @@ -9074,6 +9101,14 @@ "node": ">=6" } }, + "node_modules/klona": { + "version": "2.0.6", + "resolved": "https://registry.npmjs.org/klona/-/klona-2.0.6.tgz", + "integrity": "sha512-dhG34DXATL5hSxJbIexCft8FChFXtmskoZYnoPWjXQuebWYCNkVeV3KkGegCK9CP1oswI/vQibS2GY7Em/sJJA==", + "engines": { + "node": ">= 8" + } + }, "node_modules/latest-version": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-7.0.0.tgz", @@ -14555,6 +14590,103 @@ "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz", "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==" }, + "node_modules/sass": { + "version": "1.77.5", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.77.5.tgz", + "integrity": "sha512-oDfX1mukIlxacPdQqNb6mV2tVCrnE+P3nVYioy72V5tlk56CPNcO4TCuFcaCRKKfJ1M3lH95CleRS+dVKL2qMg==", + "dependencies": { + "chokidar": ">=3.0.0 <4.0.0", + "immutable": "^4.0.0", + "source-map-js": ">=0.6.2 <2.0.0" + }, + "bin": { + "sass": "sass.js" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/sass-loader": { + "version": "10.5.2", + "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-10.5.2.tgz", + "integrity": "sha512-vMUoSNOUKJILHpcNCCyD23X34gve1TS7Rjd9uXHeKqhvBG39x6XbswFDtpbTElj6XdMFezoWhkh5vtKudf2cgQ==", + "dependencies": { + "klona": "^2.0.4", + "loader-utils": "^2.0.0", + "neo-async": "^2.6.2", + "schema-utils": "^3.0.0", + "semver": "^7.3.2" + }, + "engines": { + "node": ">= 10.13.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/webpack" + }, + "peerDependencies": { + "fibers": ">= 3.1.0", + "node-sass": "^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0", + "sass": "^1.3.0", + "webpack": "^4.36.0 || ^5.0.0" + }, + "peerDependenciesMeta": { + "fibers": { + "optional": true + }, + "node-sass": { + "optional": true + }, + "sass": { + "optional": true + } + } + }, + "node_modules/sass-loader/node_modules/ajv": { + "version": "6.12.6", + "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz", + "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==", + "dependencies": { + "fast-deep-equal": "^3.1.1", + "fast-json-stable-stringify": "^2.0.0", + "json-schema-traverse": "^0.4.1", + "uri-js": "^4.2.2" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/epoberezkin" + } + }, + "node_modules/sass-loader/node_modules/ajv-keywords": { + "version": "3.5.2", + "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz", + "integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==", + "peerDependencies": { + "ajv": "^6.9.1" + } + }, + "node_modules/sass-loader/node_modules/json-schema-traverse": { + "version": "0.4.1", + "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz", + "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==" + }, + "node_modules/sass-loader/node_modules/schema-utils": { + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.3.0.tgz", + "integrity": "sha512-pN/yOAvcC+5rQ5nERGuwrjLlYvLTbCibnZ1I7B1LaiAz9BRBlE9GMgE/eqV30P7aJQUf7Ddimy/RsbYO/GrVGg==", + "dependencies": { + "@types/json-schema": "^7.0.8", + "ajv": "^6.12.5", + "ajv-keywords": "^3.5.2" + }, + "engines": { + "node": ">= 10.13.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/webpack" + } + }, "node_modules/sax": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/sax/-/sax-1.4.1.tgz", @@ -15831,10 +15963,9 @@ } }, "node_modules/typescript": { - "version": "5.4.3", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.3.tgz", - "integrity": "sha512-KrPd3PKaCLr78MalgiwJnA25Nm8HAmdwN3mYUYZgG/wizIo9EainNVQI9/yDavtVFRN2h3k8uf3GLHuhDMgEHg==", - "peer": true, + "version": "5.4.5", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.5.tgz", + "integrity": "sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==", "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" diff --git a/package.json b/package.json index b9f07ee..ef59b91 100644 --- a/package.json +++ b/package.json @@ -22,16 +22,20 @@ "@mdx-js/react": "^3.0.0", "clsx": "^2.0.0", "docusaurus-lunr-search": "^3.4.0", + "docusaurus-plugin-sass": "^0.2.5", "prism-react-renderer": "^2.3.0", "react": "^18.0.0", - "react-dom": "^18.0.0" + "react-dom": "^18.0.0", + "sass": "^1.77.5" }, "devDependencies": { - "@docusaurus/module-type-aliases": "^3.2.0", - "@docusaurus/types": "^3.2.0", + "@docusaurus/module-type-aliases": "^3.4.0", + "@docusaurus/tsconfig": "^3.4.0", + "@docusaurus/types": "^3.4.0", "autoprefixer": "^10.4.19", "postcss": "^8.4.38", - "tailwindcss": "^3.4.3" + "tailwindcss": "^3.4.3", + "typescript": "^5.4.5" }, "browserslist": { "production": [ diff --git a/sidebars.js b/sidebars.ts similarity index 86% rename from sidebars.js rename to sidebars.ts index 27a63e1..b2e9737 100644 --- a/sidebars.js +++ b/sidebars.ts @@ -9,10 +9,9 @@ Create as many sidebars as you want. */ -// @ts-check +import type { SidebarsConfig } from "@docusaurus/plugin-content-docs"; -/** @type {import('@docusaurus/plugin-content-docs').SidebarsConfig} */ -const sidebars = { +const sidebars: SidebarsConfig = { // By default, Docusaurus generates a sidebar from the docs folder structure tutorialSidebar: [{ type: "autogenerated", dirName: "." }], diff --git a/src/components/HomepageFeatures/index.jsx b/src/components/HomepageFeatures/index.tsx similarity index 100% rename from src/components/HomepageFeatures/index.jsx rename to src/components/HomepageFeatures/index.tsx diff --git a/src/components/SponsorList.jsx b/src/components/SponsorList.tsx similarity index 100% rename from src/components/SponsorList.jsx rename to src/components/SponsorList.tsx diff --git a/src/components/Sponsors/Sponsor.jsx b/src/components/Sponsors/Sponsor.tsx similarity index 94% rename from src/components/Sponsors/Sponsor.jsx rename to src/components/Sponsors/Sponsor.tsx index 87f6752..4f3959a 100644 --- a/src/components/Sponsors/Sponsor.jsx +++ b/src/components/Sponsors/Sponsor.tsx @@ -8,7 +8,7 @@ export const Sponsor = ({ sponsor }) => { - +
Date: Mon, 17 Jun 2024 15:47:58 +0100 Subject: [PATCH 2/7] chore: Add typecheck script to package.json --- package.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index ef59b91..f3b1c90 100644 --- a/package.json +++ b/package.json @@ -13,7 +13,8 @@ "write-translations": "docusaurus write-translations", "write-heading-ids": "docusaurus write-heading-ids", "prettier": "npx prettier . --write", - "mdx-check": "npx docusaurus-mdx-checker" + "mdx-check": "npx docusaurus-mdx-checker", + "typecheck": "tsc" }, "dependencies": { "@docusaurus/core": "^3.2.0", From 776b34c283591a5620e068207aca2925b91cad6e Mon Sep 17 00:00:00 2001 From: Hichem Fantar Date: Mon, 17 Jun 2024 16:05:20 +0100 Subject: [PATCH 3/7] chore: Update GitHub link in header navigation and fix font size --- docusaurus.config.ts | 3 ++- src/css/custom.css | 27 +++++++++++++++------------ 2 files changed, 17 insertions(+), 13 deletions(-) diff --git a/docusaurus.config.ts b/docusaurus.config.ts index 3a8c652..41b9867 100644 --- a/docusaurus.config.ts +++ b/docusaurus.config.ts @@ -86,8 +86,9 @@ const config: Config = { // }, { href: "https://github.com/open-webui/open-webui", - label: "GitHub", position: "right", + className: "header-github-link", + "aria-label": "GitHub repository", }, ], }, diff --git a/src/css/custom.css b/src/css/custom.css index e34e931..e3ba23f 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -142,12 +142,6 @@ blockquote { border-color: #fff; } -.navbar__brand { - margin-right: 0px; -} -.navbar__logo { - width: 3em; -} [data-theme="light"] .navbar__brand:hover { color: #000; } @@ -385,9 +379,6 @@ article p a { /* from here - https://theochu.com/docusaurus/styling/ */ @media screen and (max-width: 996px) { - :root { - --ifm-font-size-base: 18px; - } h1 { font-size: 1.5rem !important; font-weight: 600; @@ -398,9 +389,6 @@ article p a { } @media screen and (min-width: 997px) { - :root { - --ifm-font-size-base: 17px; - } h1 { font-size: 2rem !important; } @@ -597,3 +585,18 @@ td { .main-wrapper { min-height: 100vh; } + +.header-github-link::before { + content: ""; + width: 24px; + height: 24px; + display: flex; + background-color: var(--ifm-navbar-link-color); + mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12'/%3E%3C/svg%3E"); + transition: background-color var(--ifm-transition-fast) + var(--ifm-transition-timing-default); +} + +.header-github-link:hover::before { + background-color: var(--ifm-navbar-link-hover-color); +} From 114eacece593cb79d71bcb444a916af9e34b8fbb Mon Sep 17 00:00:00 2001 From: Hichem Fantar Date: Mon, 17 Jun 2024 16:17:52 +0100 Subject: [PATCH 4/7] chore: Update header navigation with Discord server link --- docusaurus.config.ts | 6 ++++++ src/css/custom.css | 15 +++++++++++++++ 2 files changed, 21 insertions(+) diff --git a/docusaurus.config.ts b/docusaurus.config.ts index 41b9867..5085186 100644 --- a/docusaurus.config.ts +++ b/docusaurus.config.ts @@ -84,6 +84,12 @@ const config: Config = { // label: "Blog", // position: "left", // }, + { + href: "https://discord.com/invite/5rJgQTnV4s", + position: "right", + className: "header-discord-link", + "aria-label": "Discord server", + }, { href: "https://github.com/open-webui/open-webui", position: "right", diff --git a/src/css/custom.css b/src/css/custom.css index e3ba23f..7b4e7f3 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -600,3 +600,18 @@ td { .header-github-link:hover::before { background-color: var(--ifm-navbar-link-hover-color); } + +.header-discord-link::before { + content: ""; + width: 24px; + height: 24px; + display: flex; + background-color: var(--ifm-navbar-link-color); + mask-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' role='img' xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M19.73 4.87a18.2 18.2 0 0 0-4.6-1.44c-.21.4-.4.8-.58 1.21-1.69-.25-3.4-.25-5.1 0-.18-.41-.37-.82-.59-1.2-1.6.27-3.14.75-4.6 1.43A19.04 19.04 0 0 0 .96 17.7a18.43 18.43 0 0 0 5.63 2.87c.46-.62.86-1.28 1.2-1.98-.65-.25-1.29-.55-1.9-.92.17-.12.32-.24.47-.37 3.58 1.7 7.7 1.7 11.28 0l.46.37c-.6.36-1.25.67-1.9.92.35.7.75 1.35 1.2 1.98 2.03-.63 3.94-1.6 5.64-2.87.47-4.87-.78-9.09-3.3-12.83ZM8.3 15.12c-1.1 0-2-1.02-2-2.27 0-1.24.88-2.26 2-2.26s2.02 1.02 2 2.26c0 1.25-.89 2.27-2 2.27Zm7.4 0c-1.1 0-2-1.02-2-2.27 0-1.24.88-2.26 2-2.26s2.02 1.02 2 2.26c0 1.25-.88 2.27-2 2.27Z' class=''%3E%3C/path%3E%3C/svg%3E"); + transition: background-color var(--ifm-transition-fast) + var(--ifm-transition-timing-default); +} + +.header-discord-link:hover::before { + background-color: var(--ifm-navbar-link-hover-color); +} From 1e11572c577a5423e0cafb56907656ed7f4d5870 Mon Sep 17 00:00:00 2001 From: Hichem Fantar Date: Mon, 17 Jun 2024 16:21:46 +0100 Subject: [PATCH 5/7] chore: remove unused class attribute --- src/css/custom.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/css/custom.css b/src/css/custom.css index 7b4e7f3..2abf297 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -607,7 +607,7 @@ td { height: 24px; display: flex; background-color: var(--ifm-navbar-link-color); - mask-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' role='img' xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M19.73 4.87a18.2 18.2 0 0 0-4.6-1.44c-.21.4-.4.8-.58 1.21-1.69-.25-3.4-.25-5.1 0-.18-.41-.37-.82-.59-1.2-1.6.27-3.14.75-4.6 1.43A19.04 19.04 0 0 0 .96 17.7a18.43 18.43 0 0 0 5.63 2.87c.46-.62.86-1.28 1.2-1.98-.65-.25-1.29-.55-1.9-.92.17-.12.32-.24.47-.37 3.58 1.7 7.7 1.7 11.28 0l.46.37c-.6.36-1.25.67-1.9.92.35.7.75 1.35 1.2 1.98 2.03-.63 3.94-1.6 5.64-2.87.47-4.87-.78-9.09-3.3-12.83ZM8.3 15.12c-1.1 0-2-1.02-2-2.27 0-1.24.88-2.26 2-2.26s2.02 1.02 2 2.26c0 1.25-.89 2.27-2 2.27Zm7.4 0c-1.1 0-2-1.02-2-2.27 0-1.24.88-2.26 2-2.26s2.02 1.02 2 2.26c0 1.25-.88 2.27-2 2.27Z' class=''%3E%3C/path%3E%3C/svg%3E"); + mask-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' role='img' xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M19.73 4.87a18.2 18.2 0 0 0-4.6-1.44c-.21.4-.4.8-.58 1.21-1.69-.25-3.4-.25-5.1 0-.18-.41-.37-.82-.59-1.2-1.6.27-3.14.75-4.6 1.43A19.04 19.04 0 0 0 .96 17.7a18.43 18.43 0 0 0 5.63 2.87c.46-.62.86-1.28 1.2-1.98-.65-.25-1.29-.55-1.9-.92.17-.12.32-.24.47-.37 3.58 1.7 7.7 1.7 11.28 0l.46.37c-.6.36-1.25.67-1.9.92.35.7.75 1.35 1.2 1.98 2.03-.63 3.94-1.6 5.64-2.87.47-4.87-.78-9.09-3.3-12.83ZM8.3 15.12c-1.1 0-2-1.02-2-2.27 0-1.24.88-2.26 2-2.26s2.02 1.02 2 2.26c0 1.25-.89 2.27-2 2.27Zm7.4 0c-1.1 0-2-1.02-2-2.27 0-1.24.88-2.26 2-2.26s2.02 1.02 2 2.26c0 1.25-.88 2.27-2 2.27Z' %3E%3C/path%3E%3C/svg%3E"); transition: background-color var(--ifm-transition-fast) var(--ifm-transition-timing-default); } From 6765c167e964c164648dca1df780a70d9c545379 Mon Sep 17 00:00:00 2001 From: Hichem Fantar Date: Mon, 17 Jun 2024 16:23:41 +0100 Subject: [PATCH 6/7] chore: explain how to url encode an svg --- src/css/custom.css | 1 + 1 file changed, 1 insertion(+) diff --git a/src/css/custom.css b/src/css/custom.css index 2abf297..ca5d61f 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -607,6 +607,7 @@ td { height: 24px; display: flex; background-color: var(--ifm-navbar-link-color); + /* URL encode an svg https://yoksel.github.io/url-encoder/ */ mask-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' role='img' xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M19.73 4.87a18.2 18.2 0 0 0-4.6-1.44c-.21.4-.4.8-.58 1.21-1.69-.25-3.4-.25-5.1 0-.18-.41-.37-.82-.59-1.2-1.6.27-3.14.75-4.6 1.43A19.04 19.04 0 0 0 .96 17.7a18.43 18.43 0 0 0 5.63 2.87c.46-.62.86-1.28 1.2-1.98-.65-.25-1.29-.55-1.9-.92.17-.12.32-.24.47-.37 3.58 1.7 7.7 1.7 11.28 0l.46.37c-.6.36-1.25.67-1.9.92.35.7.75 1.35 1.2 1.98 2.03-.63 3.94-1.6 5.64-2.87.47-4.87-.78-9.09-3.3-12.83ZM8.3 15.12c-1.1 0-2-1.02-2-2.27 0-1.24.88-2.26 2-2.26s2.02 1.02 2 2.26c0 1.25-.89 2.27-2 2.27Zm7.4 0c-1.1 0-2-1.02-2-2.27 0-1.24.88-2.26 2-2.26s2.02 1.02 2 2.26c0 1.25-.88 2.27-2 2.27Z' %3E%3C/path%3E%3C/svg%3E"); transition: background-color var(--ifm-transition-fast) var(--ifm-transition-timing-default); From dafe8e9a28ddefd0a2cfcc63750746f44c251326 Mon Sep 17 00:00:00 2001 From: Hichem Fantar Date: Mon, 17 Jun 2024 16:38:50 +0100 Subject: [PATCH 7/7] chore: Update header navigation with Discord server link and GitHub repository link --- docusaurus.config.ts | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/docusaurus.config.ts b/docusaurus.config.ts index 5085186..99715c2 100644 --- a/docusaurus.config.ts +++ b/docusaurus.config.ts @@ -84,18 +84,18 @@ const config: Config = { // label: "Blog", // position: "left", // }, - { - href: "https://discord.com/invite/5rJgQTnV4s", - position: "right", - className: "header-discord-link", - "aria-label": "Discord server", - }, { href: "https://github.com/open-webui/open-webui", position: "right", className: "header-github-link", "aria-label": "GitHub repository", }, + { + href: "https://discord.com/invite/5rJgQTnV4s", + position: "right", + className: "header-discord-link", + "aria-label": "Discord server", + }, ], }, footer: {