From f3277df0758caefcd399d98f0c6c023fec79d4b0 Mon Sep 17 00:00:00 2001 From: yingxuelin Date: Fri, 29 Nov 2024 14:46:30 +0800 Subject: [PATCH 1/2] =?UTF-8?q?feat:=20=E8=B0=83=E6=95=B4=E6=96=87?= =?UTF-8?q?=E6=A1=A3navbar=E8=8F=9C=E5=8D=95=E7=BB=93=E6=9E=84=EF=BC=8C?= =?UTF-8?q?=E4=BC=98=E5=8C=96=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docusaurus.config.ts | 93 +++++++++++-------------------- src/css/custom.css | 77 ++++++++++++++++++++++++- src/theme/Navbar/index.tsx | 57 +++++++++++++++++++ src/theme/Navbar/style.module.css | 36 ++++++++++++ 4 files changed, 203 insertions(+), 60 deletions(-) create mode 100644 src/theme/Navbar/index.tsx create mode 100644 src/theme/Navbar/style.module.css diff --git a/docusaurus.config.ts b/docusaurus.config.ts index ca758f6..e13529c 100644 --- a/docusaurus.config.ts +++ b/docusaurus.config.ts @@ -65,13 +65,22 @@ const config: Config = { srcDark: 'img/logo-full-white.svg', href: 'https://ai.gitee.com', target: '_self', + style: { + paddingLeft: '8px', + } }, items: [ + { + type: 'html', + position: 'left', + className: 'gai-navbar-item-home', + value: '工作台', + }, { label: 'Serverless API', to: 'https://ai.gitee.com/serverless-api', target: '_self', - className: 'gai-navbar-item', + className: 'gai-navbar-item gai-navbar-item-badge', }, { label: '模型', @@ -120,35 +129,41 @@ const config: Config = { ], }, { - type: 'docSidebar', - sidebarId: 'tutorialSidebar', - position: 'left', - label: '文档', - className: 'gai-navbar-item', - }, - { - type: 'dropdown', - label: '接口文档', - position: 'left', + label: '专区', items: [ { - label: 'Serverless API', - to: '/docs/openapi/serverless', + label: '天数智芯', + to: 'https://ai.gitee.com/topics/iluvatar', + target: '_self', }, { - label: 'Serverless API (OpenAI 兼容)', - to: '/docs/openapi/v1', + label: '沐曦', + to: 'https://ai.gitee.com/serverless-api/packages/1492', + target: '_self', }, { - label: '平台接口', - to: '/docs/openapi/base', + label: '曙光智算', + to: 'https://ai.gitee.com/topics/sugon', + target: '_self', }, { - label: '支付接口', - to: '/docs/openapi/payment', + label: '国产大模型', + to: 'https://ai.gitee.com/topics/domestic', + target: '_self', + }, + { + label: 'AI 编程', + to: 'https://ai.gitee.com/topics/ai', + target: '_self', }, ], }, + { + label: '文档', + to: '/docs/getting-started/intro', + className: 'gai-navbar-item', + activeBaseRegex: '^/docs(?!\/金牌客服马建仓).*', + }, { label: 'AI 客服', to: '/docs/金牌客服马建仓', @@ -236,46 +251,6 @@ const config: Config = { }, } as ScalarOptions, ], - [ - '@scalar/docusaurus', - { - id: 'openapi/base', - label: '', - route: '/docs/openapi/base', - configuration: { - spec: { - url: 'https://ai.gitee.com/api/base/yaml', - }, - hideModels: true, - servers: [ - { - url: 'https://ai.gitee.com/api/base', - description: '生产服务器', - }, - ], - }, - } as ScalarOptions, - ], - [ - '@scalar/docusaurus', - { - id: 'openapi/payment', - label: '', - route: '/docs/openapi/payment', - configuration: { - spec: { - url: 'https://ai.gitee.com/api/pay/yaml', - }, - hideModels: true, - servers: [ - { - url: 'https://ai.gitee.com/api/pay', - description: '生产服务器', - }, - ], - }, - } as ScalarOptions, - ], [ '@scalar/docusaurus', { diff --git a/src/css/custom.css b/src/css/custom.css index 4b64bda..22e7960 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -14,8 +14,14 @@ --ifm-color-primary-lighter: #4a7eee; --ifm-color-primary-lightest: #7098f2; --ifm-code-font-size: 95%; - --ifm-navbar-height: 4rem; + --ifm-navbar-height: 3.5rem; --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1); + --ifm-navbar-item-padding-vertical: 0.375rem; + --ifm-navbar-item-padding-horizontal: 1rem; + --ifm-navbar-item-hover-bg: rgba(241, 245, 249, 1); + --ifm-navbar-second-background-color: rgba(248, 250, 252, 1); + --ifm-navbar-button-border-color: rgba(226, 232, 240, 1); + --ifm-navbar-button-color: rgba(15, 23, 41, 1); } /* For readability concerns, you should choose a lighter palette in dark mode. */ @@ -32,6 +38,10 @@ html[data-theme='dark'] { --ifm-navbar-shadow: 0 1px 0 0 rgba(30, 41, 59); --ifm-toc-border-color: rgba(30, 41, 59); --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3); + --ifm-navbar-item-hover-bg: rgba(30, 41, 59, 1); + --ifm-navbar-second-background-color: rgba(30, 41, 59, 1); + --ifm-navbar-button-border-color: rgba(30, 41, 59, 1); + --ifm-navbar-button-color: rgb(248, 250, 252); } /** @@ -186,3 +196,68 @@ div[id^='headlessui-disclosure-panel'] tr td.relative:nth-child(2) { display: none; } } + +.theme-doc-toc-desktop { + top: calc(var(--ifm-navbar-height) + 1rem + var(--ifm-navbar-height)) !important; +} + +.dropdown > .navbar__link:after { + width: 4px; + height: 4px; + border-width: 1px 1px 0 0; + border-color: currentColor; + position: relative; + top: -4px; + transform: rotate(135deg); + left: 3px; +} + +.gai-navbar-item-home { + padding: 6px 16px; + border-radius: 8px; + border: 1px solid var(--ifm-navbar-button-border-color); + font-size: 14px; + height: 32px; + line-height: 18px; +} +.gai-navbar-item-home:hover { + background-color: var(--ifm-navbar-button-background-color); +} +.gai-navbar-item-home a { + color: var(--ifm-navbar-button-color); + text-decoration: none; +} + +.gai-navbar-item-badge { + position: relative; + margin-right: 2rem; +} + +.gai-navbar-item-badge::after { + content: 'HOT'; + font-size: 10px; + color: var(--ifm-color-white); + background-color: rgba(220, 38, 38, 1); + border-radius: 4px; + padding: 2px 4px; + position: absolute; + top: 0; + line-height: 0.75rem; + left: 112px; +} + +.navbar__link--active { + color: var(--ifm-link-color) !important; + background-color: var(--ifm-navbar-item-hover-bg); + border-radius: 8px; +} + +@media (max-width: 996px) { + .gai-navbar-item-home { + border: none; + padding: 6px 12px; + } + .gai-navbar-item-home a { + color: var(--ifm-menu-color); + } +} diff --git a/src/theme/Navbar/index.tsx b/src/theme/Navbar/index.tsx new file mode 100644 index 0000000..ee3f524 --- /dev/null +++ b/src/theme/Navbar/index.tsx @@ -0,0 +1,57 @@ +import React from 'react'; +import NavbarLayout from '@theme/Navbar/Layout'; +import NavbarContent from '@theme/Navbar/Content'; +import clsx from 'clsx'; +import { useLocation } from 'react-router-dom'; +import style from './style.module.css'; + +export default function NavBar(): JSX.Element { + const location = useLocation(); + + const isActive = (path) => { + return location.pathname.startsWith(path); + }; + + const isIntroActive = () => { + return ( + isActive('/docs') && + !isActive('/docs/openapi/') && + !isActive('/docs/金牌客服马建仓') + ); + }; + return ( + <> + + + + + + ); +} diff --git a/src/theme/Navbar/style.module.css b/src/theme/Navbar/style.module.css new file mode 100644 index 0000000..3de8bf2 --- /dev/null +++ b/src/theme/Navbar/style.module.css @@ -0,0 +1,36 @@ +.nav { + position: sticky; + background-color: var(--ifm-navbar-second-background-color); + border-bottom: 1px solid var(--ifm-toc-border-color); + top: var(--ifm-navbar-height); + overflow: auto; + height: var(--ifm-navbar-height); + z-index: 2; + display: flex; + padding: 0 20px; + font-size: 14px; +} + +.navContent { + display: flex; + align-items: center; +} + +.navItem { + color: var(--ifm-navbar-link-color); + font-weight: var(--ifm-font-weight-semibold); + margin-right: 32px; +} + +.navItem.active { + color: var(--ifm-color-primary); +} + +@media (max-width: 996px) { + .nav { + padding-right: 0; + } + .navItem { + margin-right: 24px; + } +} -- Gitee From 8e9ee446fe15552f2c505b0cc8f5fed824fc75e4 Mon Sep 17 00:00:00 2001 From: Bluishoul Date: Fri, 29 Nov 2024 07:23:57 +0000 Subject: [PATCH 2/2] Update src/theme/Navbar/index.tsx --- src/theme/Navbar/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/theme/Navbar/index.tsx b/src/theme/Navbar/index.tsx index ee3f524..b763094 100644 --- a/src/theme/Navbar/index.tsx +++ b/src/theme/Navbar/index.tsx @@ -39,7 +39,7 @@ export default function NavBar(): JSX.Element { )} href="/docs/openapi/v1" > - 接口文档 [兼容 OpenAI] + 接口文档（兼容 OpenAI）