This is an automated email from the ASF dual-hosted git repository.
jeffreyh pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/doris-website.git
The following commit(s) were added to refs/heads/develop by this push:
new e2e514dbe2 fix:download pdf&modify style (#1436)
e2e514dbe2 is described below
commit e2e514dbe2f6544b5b2341ed904da5be188183dd
Author: yangon <[email protected]>
AuthorDate: Mon Dec 2 22:43:58 2024 +0800
fix:download pdf&modify style (#1436)
---
sidebarsCommunity.json | 11 +++--
src/scss/_variables.scss | 2 +-
src/scss/components/markdown.scss | 43 +++++++++++++++----
src/scss/components/navbar.scss | 71 ++++++++++++++++++++++++++++---
src/theme/Navbar/Content/index.tsx | 4 +-
src/theme/Navbar/Search/styles.module.css | 5 ++-
src/theme/TOC/index.tsx | 66 ++++++++++++++++++++++------
7 files changed, 165 insertions(+), 37 deletions(-)
diff --git a/sidebarsCommunity.json b/sidebarsCommunity.json
index 5459463763..5b45deb721 100644
--- a/sidebarsCommunity.json
+++ b/sidebarsCommunity.json
@@ -7,6 +7,7 @@
{
"type": "category",
"label": "How to Contribute",
+ "collapsed": false,
"items": [
"how-to-contribute/how-to-contribute",
"how-to-contribute/contributor-guide",
@@ -23,6 +24,7 @@
{
"type": "category",
"label": "Release Process & Verification",
+ "collapsed": false,
"items": [
"release-and-verify/release-prepare",
"release-and-verify/release-doris-core",
@@ -37,6 +39,7 @@
{
"type": "category",
"label": "Design Documents",
+ "collapsed": false,
"items": [
"design/doris_storage_optimization",
"design/grouping_sets_design",
@@ -47,6 +50,7 @@
{
"type": "category",
"label": "Developer Guide",
+ "collapsed": false,
"items": [
"developer-guide/debug-tool",
"developer-guide/docker-dev",
@@ -84,9 +88,8 @@
{
"type": "category",
"label": "Announcements",
- "items": [
- "doris-announcement/announcement-2401"
- ]
+ "collapsed": false,
+ "items": ["doris-announcement/announcement-2401"]
}
]
-}
\ No newline at end of file
+}
diff --git a/src/scss/_variables.scss b/src/scss/_variables.scss
index 93e8b95782..6b5874a9aa 100644
--- a/src/scss/_variables.scss
+++ b/src/scss/_variables.scss
@@ -23,7 +23,7 @@ html[lang='en-US'] {
--ifm-navbar-item-padding-vertical: 0.4rem;
--ifm-navbar-height: 5rem;
--ifm-menu-color-background-active: #e4e8ee;
-
+ --ifm-leading: 1.2;
--ifm-blockquote-color: #63646d;
--global-gutter: 1.5625rem;
diff --git a/src/scss/components/markdown.scss
b/src/scss/components/markdown.scss
index db0c0af7ee..7926b5f428 100644
--- a/src/scss/components/markdown.scss
+++ b/src/scss/components/markdown.scss
@@ -20,27 +20,54 @@
h1,
h1:first-child {
- font-size: 2rem;
margin-bottom: 1.5rem;
margin-top: 0;
+ font-size: 2.25rem;
+ font-weight: 700;
}
h2 {
- font-size: 1.5rem;
- margin-bottom: 1.25rem;
- margin-top: 2rem;
- padding-top: 2rem;
- border-top: 1px solid #e6e7e9;
+ font-size: 1.625rem;
+ line-height: 2.625rem;
+ font-weight: 700;
+ // margin-bottom: 1.25rem;
+ // margin-top: 1.25rem;
+ // padding-top: 1.25rem;
+ margin-top: calc(var(--ifm-h2-font-size) * var(--ifm-leading));
}
h3 {
+ font-size: 1.25rem;
+ font-weight: 700;
+ line-height: 2rem;
+ margin-bottom: 1.25rem;
+ margin-top: 1.25rem;
+ }
+
+ h4 {
font-size: 1.125rem;
+ font-weight: 400;
+ line-height: 1.75rem;
+ margin-top: 1.25rem;
margin-bottom: 1.25rem;
- margin-top: 1rem;
}
+
p {
- line-height: 1.875;
+ line-height: 1.625rem;
+ font-size: 1rem;
+ font-weight: 400;
+ margin-top: 0;
+ margin-bottom: 0.75rem;
+ }
+
+ .theme-code-block,
+ img,
+ table,
+ .theme-admonition-tip {
+ margin-top: 0.625rem;
+ margin-bottom: 1.25rem;
}
+
code {
border-radius: 4px;
background-color: #edf2fa;
diff --git a/src/scss/components/navbar.scss b/src/scss/components/navbar.scss
index 647e29495a..7758f70e5c 100644
--- a/src/scss/components/navbar.scss
+++ b/src/scss/components/navbar.scss
@@ -14,13 +14,64 @@
.navbar-left {
display: flex;
- }
- .docs-search {
- position: absolute;
- left: 50%;
- transform: translateX(-50%);
- width: 38vw;
- top: 14px;
+ .docs-search {
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ width: 38vw;
+ top: 12px;
+
+ .navbar__search > :last-child {
+ position: absolute;
+ right: 20px;
+ top: 21px;
+ transform: translateY(-50%);
+ // display: flex !important;
+ // align-items: center;
+ // justify-content: center;
+ pointer-events: none;
+ border: 1px solid #edf2fa;
+ padding: 5px 7px;
+ background-color: #ffffff;
+ gap: 2px;
+ .searchHint {
+ color: #8592a6;
+ background-color: #ffffff;
+ border: none;
+ border-radius: none;
+ box-shadow: none;
+ font-size: 12px;
+ padding: 0;
+ }
+ }
+ .navbar__search > span {
+ width: 100% !important;
+ left: auto !important;
+ right: 0 !important;
+ display: inline !important;
+ background: transparent;
+ border-radius: 6px;
+ margin-top: 8px;
+ width: var(--search-local-modal-width, 560px);
+ position: relative;
+ padding: var(--search-local-spacing, 12px);
+ }
+ .navbar__search input {
+ width: 100% !important;
+ border: none !important;
+ background-color: #f7f9fe !important;
+ background-image: url('/static/images/search-icon.svg');
+ height: 2.5rem !important;
+ background-position: 0.625rem center !important;
+ padding-left: 2.25rem !important;
+ color: #4c576c !important;
+ border-radius: 0.5rem;
+ }
+ .navbar__search input:focus {
+ border: none !important;
+ outline: none !important;
+ }
+ }
}
.custom-navbar-item {
@@ -354,6 +405,9 @@
.navbar__item {
display: block;
}
+ .docs-search {
+ display: none;
+ }
}
.docs-nav-mobile::-webkit-scrollbar {
display: none;
@@ -379,6 +433,9 @@
}
}
}
+ .docs-search {
+ display: none;
+ }
}
.navbar__toggle.clean-btn > svg {
width: 1.5rem;
diff --git a/src/theme/Navbar/Content/index.tsx
b/src/theme/Navbar/Content/index.tsx
index ba0b449ed9..275af09cc8 100644
--- a/src/theme/Navbar/Content/index.tsx
+++ b/src/theme/Navbar/Content/index.tsx
@@ -66,14 +66,14 @@ function NavbarContentLayout({
<div className="navbar__items">{left}</div>
<div className="navbar__items
navbar__items--right">{right}</div>
</div>
- <div className="navbar__bottom">
+ {/* <div className="navbar__bottom">
<div className="docs-nav-mobile">
<NavbarItems
items={isEN ? useThemeConfig().docNavbarEN.items :
useThemeConfig().docNavbarZH.items}
isDocsPage={isDocsPage}
/>
</div>
- </div>
+ </div> */}
<div className="navbar__bottom">{bottom}</div>
</>
);
diff --git a/src/theme/Navbar/Search/styles.module.css
b/src/theme/Navbar/Search/styles.module.css
index 9eeb2934d4..8edec9594b 100644
--- a/src/theme/Navbar/Search/styles.module.css
+++ b/src/theme/Navbar/Search/styles.module.css
@@ -8,8 +8,9 @@ See https://github.com/facebook/docusaurus/pull/9385
@media (max-width: 996px) {
.navbarSearchContainer {
- position: absolute;
- right: var(--ifm-navbar-padding-horizontal);
+ display: none;
+ /* position: absolute;
+ right: var(--ifm-navbar-padding-horizontal); */
}
}
diff --git a/src/theme/TOC/index.tsx b/src/theme/TOC/index.tsx
index 11da8084fb..d08817f4ab 100644
--- a/src/theme/TOC/index.tsx
+++ b/src/theme/TOC/index.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState, useEffect } from 'react';
import clsx from 'clsx';
import TOCItems from '@theme/TOCItems';
import type { Props } from '@theme/TOC';
@@ -6,6 +6,7 @@ import useDocusaurusContext from
'@docusaurus/useDocusaurusContext';
import HomeIcon from '@site/static/images/toc-icon/home.svg';
import PdfIcon from '@site/static/images/toc-icon/pdf.svg';
import GithubIcon from '@site/static/images/toc-icon/github.svg';
+import { DOWNLOAD_PDFS } from '@site/src/constant/download.data';
import Link from '@docusaurus/Link';
import styles from './styles.module.css';
@@ -15,10 +16,25 @@ import styles from './styles.module.css';
const LINK_CLASS_NAME = 'table-of-contents__link toc-highlight';
const LINK_ACTIVE_CLASS_NAME = 'table-of-contents__link--active';
+function downloadFile(url, filename) {
+ var xml = new XMLHttpRequest();
+ xml.open('GET', url, true);
+ xml.responseType = 'blob';
+ xml.onload = function () {
+ var url = window.URL.createObjectURL(xml.response);
+ var a = document.createElement('a');
+ a.href = url;
+ a.download = filename;
+ a.click();
+ };
+ xml.send();
+}
+
export default function TOC({ className, ...props }: Props): JSX.Element {
const { siteConfig } = useDocusaurusContext();
const isCN = siteConfig.baseUrl.indexOf('zh-CN') > -1;
-
+ const DEFAULT_VERSION = '2.1';
+ const [currentVersion, setCurrentVersion] = useState(DEFAULT_VERSION);
const handleMouseEnter = (id: string) => {
const dom = document.getElementById(id);
dom.style.color = '#444FD9';
@@ -30,6 +46,23 @@ export default function TOC({ className, ...props }: Props):
JSX.Element {
dom.style.color = '#1F1F26';
dom.firstChild.style.fill = '#7F7F83';
};
+
+ useEffect(() => {
+ if (typeof window !== 'undefined') {
+ const pathname = location.pathname.includes('zh-CN/docs')
+ ? location.pathname.split('/')[2]
+ : location.pathname.split('/')[1];
+ const secPath = location.pathname.includes('zh-CN/docs')
+ ? location.pathname.split('/')[3]
+ : location.pathname.split('/')[2];
+ if (pathname === 'docs' && ['dev', '3.0', '2.0',
'1.2'].includes(secPath)) {
+ setCurrentVersion(secPath);
+ } else {
+ setCurrentVersion(DEFAULT_VERSION);
+ }
+ }
+ }, [typeof window !== 'undefined' && location.pathname]);
+
return (
<div className={clsx(styles.tableOfContents, 'thin-scrollbar',
'toc-container', className)}>
<div>
@@ -41,18 +74,25 @@ export default function TOC({ className, ...props }:
Props): JSX.Element {
onMouseLeave={() => handleMouseLeave('toc-icon-home')}
>
<HomeIcon />
- <span>Doris Homepage</span>
+ <span>{isCN ? 'Doris 首页' : 'Doris Homepage'}</span>
</div>
</Link>
- <Link
- className="toc-icon-content"
- id="toc-icon-pdf"
- onMouseEnter={() => handleMouseEnter('toc-icon-pdf')}
- onMouseLeave={() => handleMouseLeave('toc-icon-pdf')}
- >
- <PdfIcon />
- <span>Download PDF</span>
- </Link>
+ {isCN && ['3.0', '2.0', '2.1'].includes(currentVersion) ? (
+ <div
+ className="toc-icon-content"
+ id="toc-icon-pdf"
+ onClick={() => {
+ const pdfInfo = DOWNLOAD_PDFS.find(item =>
item.version === currentVersion);
+ downloadFile(pdfInfo.link, pdfInfo.filename);
+ }}
+ onMouseEnter={() => handleMouseEnter('toc-icon-pdf')}
+ onMouseLeave={() => handleMouseLeave('toc-icon-pdf')}
+ >
+ <PdfIcon />
+ <span>{isCN ? '下载 PDF' : 'Download PDF'}</span>
+ </div>
+ ) : null}
+
<Link
className="toc-icon-content"
to={isCN ? 'https://ask.selectdb.com/' :
'https://github.com/apache/doris/discussions'}
@@ -61,7 +101,7 @@ export default function TOC({ className, ...props }: Props):
JSX.Element {
onMouseLeave={() => handleMouseLeave('toc-icon-github')}
>
<GithubIcon />
- <span>Ask Questions on Discussion</span>
+ <span>{isCN ? '技术论坛' : 'Ask Questions on
Discussion'}</span>
</Link>
</div>
<div>
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
