This is an automated email from the ASF dual-hosted git repository.
morningman pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/doris-website.git
The following commit(s) were added to refs/heads/master by this push:
new 14f9adef178 [add] mobile compatible (#1003)
14f9adef178 is described below
commit 14f9adef178d799a1fabe0c75e894a05c78e14c5
Author: 0xFlackoLFG <[email protected]>
AuthorDate: Thu Aug 15 11:53:13 2024 +0800
[add] mobile compatible (#1003)
---
src/scss/components/navbar.scss | 16 +++++++++++++++-
src/theme/Navbar/Content/index.tsx | 14 ++++++++++++++
2 files changed, 29 insertions(+), 1 deletion(-)
diff --git a/src/scss/components/navbar.scss b/src/scss/components/navbar.scss
index 23f96ab941a..9b4cf22aeec 100644
--- a/src/scss/components/navbar.scss
+++ b/src/scss/components/navbar.scss
@@ -314,7 +314,7 @@
height: 3.75rem;
&.docs,
&.community {
- height: 6.5rem;
+ height: 8.1rem;
flex-direction: column;
.navbar__inner {
height: 3.75rem;
@@ -327,10 +327,24 @@
.docs-nav-version-locale {
display: flex;
justify-content: flex-end;
+ align-items: center;
.navbar__item {
display: block;
}
}
+ .docs-nav-mobile {
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+ overflow-x: auto;
+ white-space: nowrap;
+ .navbar__item {
+ display: block;
+ }
+ }
+ .docs-nav-mobile::-webkit-scrollbar {
+ display: none;
+ }
li {
list-style: none;
}
diff --git a/src/theme/Navbar/Content/index.tsx
b/src/theme/Navbar/Content/index.tsx
index c9d7cd0ff99..10a75c25932 100644
--- a/src/theme/Navbar/Content/index.tsx
+++ b/src/theme/Navbar/Content/index.tsx
@@ -29,6 +29,12 @@ function NavbarItems({ items, isDocsPage }) {
);
}
function NavbarContentLayout({ left, right, bottom, isDocsPage = false }) {
+ const [isEN, setIsEN] = useState(true);
+ useEffect(() => {
+ if (typeof window !== 'undefined') {
+ location.pathname.includes('zh-CN') ? setIsEN(false) :
setIsEN(true);
+ }
+ }, [typeof window !== 'undefined' && location.pathname]);
return (
<>
<div
@@ -40,6 +46,14 @@ function NavbarContentLayout({ left, right, bottom,
isDocsPage = false }) {
<div className="navbar__items">{left}</div>
<div className="navbar__items
navbar__items--right">{right}</div>
</div>
+ <div className="navbar__bottom">
+ <div className="docs-nav-mobile">
+ <NavbarItems
+ items={isEN ? useThemeConfig().docNavbarEN.items :
useThemeConfig().docNavbarZH.items}
+ isDocsPage={isDocsPage}
+ />
+ </div>
+ </div>
<div className="navbar__bottom">{bottom}</div>
</>
);
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
