From bc6cef4ded110ada66bcc794fff0c4d23693ff9e Mon Sep 17 00:00:00 2001 From: liukaiming-alipay Date: Fri, 8 Nov 2024 13:53:35 +0800 Subject: [PATCH 1/3] fix: style bug --- docusaurus/src/css/custom.css | 87 ++++++++++--------- .../theme/DocBreadcrumbs/Items/Home/index.tsx | 12 ++- 2 files changed, 55 insertions(+), 44 deletions(-) diff --git a/docusaurus/src/css/custom.css b/docusaurus/src/css/custom.css index 6c0d425a97..0d7a83b0e3 100644 --- a/docusaurus/src/css/custom.css +++ b/docusaurus/src/css/custom.css @@ -83,50 +83,51 @@ border-radius: 12px; padding: 14px 32px; font-size: 14px !important; +} + +.container > h1 { + font-size: 24px !important; + color: #1a1b25e0 !important; + line-height: 32px !important; + font-weight: 600 !important; +} + +.container > h2 { + font-size: 24px !important; + color: #1a1b25e0 !important; + line-height: 32px !important; + font-weight: 600 !important; + margin-top: 28px !important; +} + +.container > a { + font-size: 14px !important; + color: #1677ff !important; +} + +.breadcrumbs__item:not(:last-child):after { + content: "/"; + background: none; + margin: 0 0 0 5px !important; + font-size: 14px !important; +} - h1 { - font-size: 24px !important; - color: #1a1b25e0 !important; - line-height: 32px !important; - font-weight: 600 !important; - } - - h2 { - font-size: 24px !important; - color: #1a1b25e0 !important; - line-height: 32px !important; - font-weight: 600 !important; - margin-top: 28px !important; - } - - p, - th, - td, - li, - span { - font-size: 14px !important; - color: #1a1b25e0 !important; - line-height: 22px !important; - } - - a { - font-size: 14px !important; - color: #1677ff !important; - } - .breadcrumbs__item:not(:last-child):after { - content: "/"; - background: none; - margin: 0 0 0 5px !important; - font-size: 14px !important; - } - - .breadcrumbs__link { - background-color: transparent !important; - font-size: 12px !important; - color: #0a0a0ae1 !important; - line-height: 20px; - padding: 0; - } +.breadcrumbs__link { + background-color: transparent !important; + font-size: 12px !important; + color: #0a0a0ae1 !important; + line-height: 20px; + padding: 0; +} + +.container > p, +.container > th, +.container > td, +.container > li, +.container > span { + font-size: 14px !important; + color: #1a1b25e0 !important; + line-height: 22px !important; } /* Cascader style */ diff --git a/docusaurus/src/theme/DocBreadcrumbs/Items/Home/index.tsx b/docusaurus/src/theme/DocBreadcrumbs/Items/Home/index.tsx index 45d8ff3314..823a9713d5 100644 --- a/docusaurus/src/theme/DocBreadcrumbs/Items/Home/index.tsx +++ b/docusaurus/src/theme/DocBreadcrumbs/Items/Home/index.tsx @@ -23,6 +23,16 @@ export default function HomeBreadcrumbItem(): JSX.Element { } }; + + const homeText = () => { + const lang = + pathname?.split("/")?.find((item) => ["zh", "en"].includes(item)) || "en"; + if (lang === "en") { + return "Docs"; + } + return "文档"; + } + return (
  • - 文档 + {homeText()}
    • From 8db8d89ed45240b1795774e9e16b52c4d38e3731 Mon Sep 17 00:00:00 2001 From: liukaiming-alipay Date: Wed, 20 Nov 2024 12:40:28 +0800 Subject: [PATCH 2/3] feat: doc style --- docusaurus/src/css/custom.css | 84 +++++++++++++++---- .../theme/DocBreadcrumbs/Items/Home/index.tsx | 25 +++--- 2 files changed, 77 insertions(+), 32 deletions(-) diff --git a/docusaurus/src/css/custom.css b/docusaurus/src/css/custom.css index 0d7a83b0e3..8592480eb1 100644 --- a/docusaurus/src/css/custom.css +++ b/docusaurus/src/css/custom.css @@ -40,7 +40,7 @@ #__docusaurus { padding: 16px 120px 0; - background-image: linear-gradient(180deg, #d8e2ee 0%, #d8e2ee 100%); + background-color: transparent; cursor: pointer; } @@ -64,6 +64,16 @@ color: #424e66 !important; } +.menu__list-item-collapsible, +.menu__list-item { + border-radius: 8px; +} + +.menu__list-item-collapsible > a, +.menu__list-item > a { + line-height: 22px; +} + .menu__link--active { background: #0e0b3b0d; border-radius: 8px; @@ -73,8 +83,17 @@ font-weight: 500; } +.clean-btn::before { + background-size: 1rem 1rem; +} + +.sidebarViewport_aRkj::-webkit-scrollbar { + display: none; /* 隐藏滚动条 */ +} .sidebarViewport_aRkj { - overflow-y: auto !important; + -ms-overflow-style: none; /* IE 和 Edge */ + scrollbar-width: none; /* Firefox */ + overflow-y: auto !important; /* 保持内容可滚动 */ } /* Docs container Style */ @@ -85,24 +104,38 @@ font-size: 14px !important; } -.container > h1 { - font-size: 24px !important; - color: #1a1b25e0 !important; - line-height: 32px !important; +.markdown > h1, +.markdown > h2, +.markdown > h3, +.markdown > h4, +.markdown > h5, +.markdown > h6 { + color: #292d3b !important; font-weight: 600 !important; } -.container > h2 { - font-size: 24px !important; - color: #1a1b25e0 !important; - line-height: 32px !important; - font-weight: 600 !important; +.markdown > h1 { + font-size: 26px !important; +} + +.markdown > h2 { + font-size: 20px !important; margin-top: 28px !important; } -.container > a { +.markdown > h3 { + font-size: 18px !important; +} +.markdown > h4 { + font-size: 16px !important; +} +.markdown > h5 { + font-size: 14px !important; +} + +.markdown > a { font-size: 14px !important; - color: #1677ff !important; + color: #2e5dfe !important; } .breadcrumbs__item:not(:last-child):after { @@ -120,17 +153,32 @@ padding: 0; } -.container > p, -.container > th, -.container > td, -.container > li, -.container > span { +.markdown > p, +.markdown > th, +.markdown > td, +.markdown > li, +.markdown > span { font-size: 14px !important; color: #1a1b25e0 !important; line-height: 22px !important; } +.table-of-contents > li > a { + font-size: 14px; + color: #768191; +} + +.table-of-contents > li > .table-of-contents__link--active { + font-size: 14px; + color: #2e5dfe; + font-weight: 500; +} + /* Cascader style */ + +.ant-cascader-menu { + height: fit-content !important; +} .itemWrapper { display: flex; flex-direction: column; diff --git a/docusaurus/src/theme/DocBreadcrumbs/Items/Home/index.tsx b/docusaurus/src/theme/DocBreadcrumbs/Items/Home/index.tsx index 823a9713d5..a053a4a0a9 100644 --- a/docusaurus/src/theme/DocBreadcrumbs/Items/Home/index.tsx +++ b/docusaurus/src/theme/DocBreadcrumbs/Items/Home/index.tsx @@ -1,8 +1,8 @@ -import React from 'react'; -import Link from '@docusaurus/Link'; -import { translate } from '@docusaurus/Translate'; +import React from "react"; +import Link from "@docusaurus/Link"; +import { translate } from "@docusaurus/Translate"; -import { useLocation } from '@docusaurus/router'; +import { useLocation } from "@docusaurus/router"; export default function HomeBreadcrumbItem(): JSX.Element { const { pathname } = useLocation(); @@ -23,7 +23,6 @@ export default function HomeBreadcrumbItem(): JSX.Element { } }; - const homeText = () => { const lang = pathname?.split("/")?.find((item) => ["zh", "en"].includes(item)) || "en"; @@ -31,22 +30,20 @@ export default function HomeBreadcrumbItem(): JSX.Element { return "Docs"; } return "文档"; - } + }; return (
  • -
    - {homeText()} -
    + href={homeHref()} + > +
    {homeText()}
    • ); From 04a72a7dcb6eb3ebca9faab6a56090585b425d4e Mon Sep 17 00:00:00 2001 From: liukaiming-alipay Date: Wed, 20 Nov 2024 13:58:38 +0800 Subject: [PATCH 3/3] feat: doc style --- docusaurus/src/css/custom.css | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/docusaurus/src/css/custom.css b/docusaurus/src/css/custom.css index 8592480eb1..1ac132d488 100644 --- a/docusaurus/src/css/custom.css +++ b/docusaurus/src/css/custom.css @@ -41,7 +41,7 @@ #__docusaurus { padding: 16px 120px 0; background-color: transparent; - cursor: pointer; + cursor: pointer !important; } /* Sidebar Style */ @@ -104,18 +104,18 @@ font-size: 14px !important; } -.markdown > h1, .markdown > h2, .markdown > h3, .markdown > h4, -.markdown > h5, -.markdown > h6 { +.markdown > h5 { color: #292d3b !important; font-weight: 600 !important; } -.markdown > h1 { +.markdown h1:first-child { font-size: 26px !important; + color: #292d3b !important; + font-weight: 600 !important; } .markdown > h2 { @@ -153,17 +153,17 @@ padding: 0; } -.markdown > p, -.markdown > th, -.markdown > td, -.markdown > li, -.markdown > span { +.markdown p, +.markdown th, +.markdown td, +.markdown li, +.markdown span { font-size: 14px !important; color: #1a1b25e0 !important; line-height: 22px !important; } -.table-of-contents > li > a { +.table-of-contents li > a { font-size: 14px; color: #768191; }