This is an automated email from the ASF dual-hosted git repository.
luzhijing 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 9d7f0bb17a1 (feat) fix first-page tab & update docs footer & add
first-page mobile tab (#369)
9d7f0bb17a1 is described below
commit 9d7f0bb17a18e27891f3254a5debbbf4756b9451
Author: velodb-Linjiang <134401306+velodb-linji...@users.noreply.github.com>
AuthorDate: Fri Dec 22 19:28:51 2023 +0800
(feat) fix first-page tab & update docs footer & add first-page mobile tab
(#369)
Co-authored-by: Wenlong Hu <962950...@qq.com>
---
src/components/link-arrow/index.tsx | 4 +-
src/components/progress/progress.tsx | 2 +-
src/constant/various-analytics.data.tsx | 81 +++++++++-----
src/pages/index.scss | 68 +++++++++++-
src/pages/index.tsx | 121 ++++++++++++++-------
src/pages/users/index.tsx | 3 +
src/theme/Footer/index.tsx | 45 +++++++-
src/theme/Footer/styles.scss | 23 ++++
.../NavbarItem/DocsVersionDropdownNavbarItem.tsx | 3 +-
src/theme/NavbarItem/DropdownNavbarItem.js | 6 +-
static/images/what-is-doris-new.png | Bin 908574 -> 162914 bytes
11 files changed, 280 insertions(+), 76 deletions(-)
diff --git a/src/components/link-arrow/index.tsx
b/src/components/link-arrow/index.tsx
index 1d5688eba94..9c48bf39ff4 100644
--- a/src/components/link-arrow/index.tsx
+++ b/src/components/link-arrow/index.tsx
@@ -18,8 +18,8 @@ export default function LinkWithArrow(props: ReadMoreProps) {
<svg
xmlns="http://www.w3.org/2000/svg";
className="transition-slide"
- width="16"
- height="14"
+ width="1em"
+ height="1em"
viewBox="0 0 16 14"
fill="none"
>
diff --git a/src/components/progress/progress.tsx
b/src/components/progress/progress.tsx
index 79d8cf4c2f0..d10fc6eb2cc 100644
--- a/src/components/progress/progress.tsx
+++ b/src/components/progress/progress.tsx
@@ -3,7 +3,7 @@ import React from 'react';
export function Progress({ percent }: { percent: number }) {
return (
<div className="h-0.5 w-[calc(100%-1.5rem)] bg-neutral-200
dark:bg-neutral-600 progress">
- <div className="h-0.5 bg-primary" style={{ width: `${percent}%`
}}></div>
+ <div className="h-0.5 bg-[#C0C3F1]" style={{ width: `${percent}%`
}}></div>
</div>
);
}
diff --git a/src/constant/various-analytics.data.tsx
b/src/constant/various-analytics.data.tsx
index 324ddd86e3f..8c749e8111b 100644
--- a/src/constant/various-analytics.data.tsx
+++ b/src/constant/various-analytics.data.tsx
@@ -7,18 +7,18 @@ export const VariousAnalyticsData = [
'From traditional batch reporting to real-time reporting and
dashboards. From internal-facing analytics like traditional BI to
customer-facing analytics. From decision support analytics to algorithm-driven
real-time decision-making.',
links: [{ content: 'Read JD.com story ', to: '/blog/JD_OLAP' }],
icon: (
- <svg xmlns="http://www.w3.org/2000/svg"; width="80" height="80"
viewBox="0 0 80 80" fill="none">
+ <svg xmlns="http://www.w3.org/2000/svg"; width="16" height="16"
viewBox="0 0 16 16" fill="none">
<path
- d="M53 57C55.2091 57 57 55.2091 57 53L57 27C57 24.7909
55.2091 23 53 23L27 23C24.7909 23 23 24.7909 23 27L23 53C23 55.2091 24.7909 57
27 57L53 57Z"
+ d="M14.1176 16C15.1572 16 16 15.1572 16 14.1176L16
1.88235C16 0.842756 15.1572 -3.8256e-08 14.1176 -8.54458e-08L1.88236
-6.40837e-07C0.842762 -6.88026e-07 1.74312e-06 0.842759 3.06258e-06
1.88235L1.85917e-05 14.1176C1.99112e-05 15.1572 0.842778 16 1.88237 16L14.1176
16Z"
fill="#C0C3F1"
/>
- <path d="M30.0001 30H50.0001" stroke="white" stroke-width="3"
stroke-linecap="round" />
- <path d="M30.0001 37H50.0001" stroke="white" stroke-width="3"
stroke-linecap="round" />
- <circle cx="47" cy="47" r="10" fill="#444FD9" />
+ <path d="M3.29395 3.29419H12.7057" stroke="white"
stroke-width="1.41176" stroke-linecap="round" />
+ <path d="M3.29395 6.58813H12.7057" stroke="white"
stroke-width="1.41176" stroke-linecap="round" />
+ <circle cx="11.2943" cy="11.294" r="4.70588" fill="#444FD9" />
<path
- d="M51.279 45.0771L45.9586 50.7201L42.5728 47.5279"
+ d="M13.3077 10.3892L10.8039 13.0447L9.21063 11.5425"
stroke="white"
- stroke-width="3"
+ stroke-width="1.41176"
stroke-linecap="round"
stroke-linejoin="round"
/>
@@ -31,15 +31,15 @@ export const VariousAnalyticsData = [
content: `According to Forbes, 78% of organizations consider ad-hoc
analysis to be a critical or very important feature in business intelligence
adoption. Interactive ad-hoc analysis is replacing predefined data reporting,
allowing a wider range of people to perform self-service analysis. Doris' high
performance can provide fast response to any query, making it an invaluable
tool for organizations that need to quickly analyze data and make informed
decisions.`,
links: [{ content: 'Read Xiaomi story', to: '/blog/xiaomi_vector' }],
icon: (
- <svg xmlns="http://www.w3.org/2000/svg"; width="80" height="80"
viewBox="0 0 80 80" fill="none">
+ <svg xmlns="http://www.w3.org/2000/svg"; width="16" height="16"
viewBox="0 0 16 16" fill="none">
<path
- d="M53 55C55.2091 55 57 53.2091 57 51L57 25C57 22.7909
55.2091 21 53 21L27 21C24.7909 21 23 22.7909 23 25L23 51C23 53.2091 24.7909 55
27 55L53 55Z"
+ d="M14.1176 16C15.1572 16 16 15.1572 16 14.1176L16
1.88235C16 0.842756 15.1572 -9.78606e-08 14.1176 -1.4505e-07L1.88236
-7.00441e-07C0.842761 -7.47631e-07 1.71306e-06 0.842759 3.06898e-06
1.88235L1.90271e-05 14.1176C2.0383e-05 15.1572 0.842778 16 1.88237 16L14.1176
16Z"
fill="#444FD9"
/>
<path
- d="M28.7998 38H33.3527C33.5052 38 33.6457 37.9174 33.7198
37.784L37.1361 31.6347C37.3136 31.3152 37.7862 31.3591 37.9017 31.7058L42.0979
44.2943C42.2134 44.641 42.686 44.6849 42.8635 44.3654L46.2798 38.2161C46.3539
38.0827 46.4944 38 46.6469 38H51.1998"
+ d="M2.72949 8.00005H4.87202C4.9438 8.00005 5.00994 7.96114
5.04479 7.89839L6.65247 5.00457C6.73599 4.85424 6.95837 4.87491 7.01275
5.03806L8.98741 10.962C9.04179 11.1252 9.26417 11.1459 9.34769 10.9955L10.9554
8.10171C10.9902 8.03897 11.0564 8.00005 11.1281 8.00005H13.2707"
stroke="white"
- stroke-width="3"
+ stroke-width="1.41176"
stroke-linecap="round"
/>
</svg>
@@ -56,15 +56,15 @@ export const VariousAnalyticsData = [
},
],
icon: (
- <svg xmlns="http://www.w3.org/2000/svg"; width="80" height="80"
viewBox="0 0 80 80" fill="none">
- <rect x="23.9999" y="34" width="32" height="10" rx="2"
fill="#444FD9" />
+ <svg xmlns="http://www.w3.org/2000/svg"; width="16" height="16"
viewBox="0 0 16 16" fill="none">
+ <rect x="0.470703" y="5.64697" width="15.0588"
height="4.70588" rx="0.941176" fill="#444FD9" />
<path
- d="M23.9999 42H25.3333C25.766 42 26.1871 42.1404 26.5333
42.4L27.5209 43.1407C28.9803 44.2352 30.9952 44.2038 32.4197 43.0642L32.5012
42.999C33.962 41.8303 36.0391 41.8313 37.4999 43C38.9608 44.1687 41.0391
44.1687 42.4999 43C43.9608 41.8313 46.0378 41.8303 47.4987 42.999L47.5802
43.0642C49.0046 44.2038 51.0196 44.2352 52.479 43.1407L53.4666 42.4C53.8128
42.1404 54.2339 42 54.6666 42H55.9999V54C55.9999 55.1046 55.1045 56 53.9999
56H25.9999C24.8954 56 23.9999 55.1046 2 [...]
+ d="M0.470703 9.41175H1.09815C1.3018 9.41175 1.49995 9.4778
1.66286 9.59999L2.12763 9.94856C2.81438 10.4636 3.76261 10.4488 4.43294
9.91255L4.47128 9.88188C5.15875 9.3319 6.13617 9.33236 6.82364
9.88234V9.88234C7.51111 10.4323 8.48912 10.4323 9.17659 9.88234V9.88234C9.86406
9.33236 10.8415 9.3319 11.529 9.88188L11.5673 9.91255C12.2376 10.4488 13.1859
10.4636 13.8726 9.94856L14.3374 9.59999C14.5003 9.4778 14.6984 9.41175 14.9021
9.41175H15.5295V15.0588C15.5295 15.5786 1 [...]
fill="#C0C3F1"
/>
- <rect x="27.9999" y="37.5" width="6" height="3" rx="1.5"
fill="white" />
- <rect x="23.9999" y="22" width="32" height="10" rx="2"
fill="#444FD9" />
- <rect x="27.9999" y="25.5" width="6" height="3" rx="1.5"
fill="white" />
+ <rect x="2.35303" y="7.29395" width="2.82353" height="1.41176"
rx="0.705882" fill="white" />
+ <rect x="0.470703" width="15.0588" height="4.70588"
rx="0.941176" fill="#444FD9" />
+ <rect x="2.35303" y="1.64697" width="2.82353" height="1.41176"
rx="0.705882" fill="white" />
</svg>
),
backgroundClassName: 'cases-bg-datalake',
@@ -73,13 +73,29 @@ export const VariousAnalyticsData = [
title: 'ELT data processing',
content: `As data warehouses become more powerful, there is indeed a
shift from ETL (Extract, Transform, Load) processes that rely on external
systems to ELT (Extract, Load, Transform) methods that are performed within the
database itself. Doris, with its high-performance computing engine, supports
complex large queries and incremental data reading, making it an excellent
choice for ELT data processing.`,
icon: (
- <svg xmlns="http://www.w3.org/2000/svg"; width="80" height="80"
viewBox="0 0 80 80" fill="none">
+ <svg xmlns="http://www.w3.org/2000/svg"; width="16" height="16"
viewBox="0 0 16 16" fill="none">
<path
- fill-rule="evenodd"
- clip-rule="evenodd"
- d="M56.9999 53C56.9999 55.2091 55.2091 57 52.9999
57H27C24.7908 57 23 55.2091 23 53L22.9999 27C22.9999 24.7909 24.7908 23 26.9999
23L52.9999 23C55.209 23 56.9999 24.7909 56.9999 27L56.9999 53ZM44.5964
30.6236C45.3565 30.953 45.7057 31.8362 45.3763 32.5963L38.8763 47.5963C38.5469
48.3564 37.6637 48.7056 36.9035 48.3762C36.1434 48.0468 35.7942 47.1636 36.1236
46.4035L42.6236 31.4035C42.953 30.6434 43.8362 30.2942 44.5964 30.6236ZM34.0606
38.8607C34.6464 38.2749 34.6464 [...]
+ d="M14.1176 16C15.1572 16 16 15.1572 16 14.1176L16
1.88235C16 0.842756 15.1572 -2.76675e-07 14.1176 -3.23864e-07L1.88236
-8.79255e-07C0.842761 -9.26445e-07 1.62019e-06 0.842759 2.96444e-06
1.88235L1.87853e-05 14.1176C2.01295e-05 15.1572 0.842778 16 1.88237 16L14.1176
16Z"
fill="#444FD9"
/>
+ <path
+ d="M4.70605 6.9646L3.49394 8.17671C3.38368 8.28698 3.38368
8.46575 3.49394 8.57602L4.70605 9.78813"
+ stroke="white"
+ stroke-width="1.41176"
+ stroke-linecap="round"
+ />
+ <path
+ d="M11.2939 7.05884L12.5061 8.27095C12.6163 8.38121
12.6163 8.55999 12.5061 8.67026L11.2939 9.88237"
+ stroke="white"
+ stroke-width="1.41176"
+ stroke-linecap="round"
+ />
+ <path
+ d="M9.88255 4.23535L6.82373 11.2942"
+ stroke="white"
+ stroke-width="1.41176"
+ stroke-linecap="round"
+ />
</svg>
),
links: [
@@ -94,14 +110,20 @@ export const VariousAnalyticsData = [
title: 'Log analytics',
content: `Store business, system, or IoT-related log data as
structured, semi-structured, or raw text to establish a unified log storage and
analytics platform. Doris offers efficient handling of high-volume log data and
provides high-performance log retrieval and analytics capabilities at a highly
cost-effective rate.`,
icon: (
- <svg xmlns="http://www.w3.org/2000/svg"; width="80" height="80"
viewBox="0 0 80 80" fill="none">
+ <svg xmlns="http://www.w3.org/2000/svg"; width="16" height="16"
viewBox="0 0 16 16" fill="none">
<path
- d="M56.9999 30L22.9999 30L22.9999 27C22.9999 24.7909
24.7908 23 26.9999 23L52.9999 23C55.2091 23 56.9999 24.7909 56.9999 27L56.9999
30Z"
+ d="M0 4.70605H15.9999V13.6472C15.9999 14.6868 15.1571
15.5295 14.1175 15.5295H1.88234C0.842753 15.5295 0 14.6868 0 13.6472L0 4.70605Z"
+ fill="#444FD9"
+ />
+ <path
+ d="M16 3.76489L0.000114441 3.76489L0.000114564
2.35314C0.000114655 1.31355 0.842867 0.470799 1.88245 0.470799L14.1177
0.4708C15.1572 0.4708 16 1.31355 16 2.35314L16 3.76489Z"
fill="#C0C3F1"
/>
<path
- d="M57.0002 32H23.0002V51C23.0002 53.2091 24.791 55
27.0002 55H53.0002C55.2093 55 57.0002 53.2091 57.0002 51V32ZM49.1999
39.9001L43.3383 47.7156C42.7176 48.5432 41.5077 48.6292 40.7762 47.8977L37.1243
44.2458L34.1712 47.9371C33.6537 48.584 32.7098 48.6889 32.0629 48.1714C31.416
47.6539 31.3111 46.7099 31.8286 46.063L35.689 41.2375C36.322 40.4463 37.5021
40.381 38.2186 41.0974L41.8376 44.7165L46.7999 38.1001C47.297 37.4373 48.2372
37.303 48.8999 37.8001C49.5627 38.2971 [...]
- fill="#444FD9"
+ d="M4.70605 11.7647L6.52271 9.49387C6.55775 9.45006
6.62308 9.44644 6.66275 9.48611L8.86458 11.6879C8.90508 11.7284 8.97206 11.7237
9.00643 11.6779L11.7648 8"
+ stroke="white"
+ stroke-width="1.41175"
+ stroke-linecap="round"
/>
</svg>
),
@@ -118,16 +140,17 @@ export const VariousAnalyticsData = [
title: 'Customer data platform',
content: `Gather user-specific attributes and behavioral data,
construct a comprehensive user data platform, perform in-depth analysis of user
behaviors including engagement, retention, and conversion rates, and conduct
precise audience analysis covering insights and segmentation.`,
icon: (
- <svg xmlns="http://www.w3.org/2000/svg"; width="80" height="80"
viewBox="0 0 80 80" fill="none">
+ <svg xmlns="http://www.w3.org/2000/svg"; width="16" height="16"
viewBox="0 0 16 16" fill="none">
<path
- d="M54.6379 50.5263V55.9879C54.6379 56.4799 54.2801
56.8987 53.7942 56.9757L35.8443 59.817C35.2372 59.9131 34.688 59.4439 34.688
58.8293V57.9046C34.688 56.7561 33.7229 55.8435 32.5761 55.9077L28.6335
56.1285C27.5499 56.1891 26.6157 55.377 26.5233 54.2957C26.2995 51.6756 25.9077
47.3169 25.767 47.1782C24.8484 46.2722 20.2012 46.2722 21.1195 44.4603C22.0377
42.6485 24.8484 37.3684 24.8484 37.3684C25.4608 35.8585 24.8484 34.8574 24.8484
32.6831C24.8484 29.9653 30.3599 20 [...]
+ d="M13.8551 12.2105V14.3952C13.8551 14.5919 13.7119
14.7595 13.5176 14.7903L6.33762 15.9268C6.09479 15.9652 5.87508 15.7776 5.87508
15.5317V15.1618C5.87508 14.7024 5.48905 14.3374 5.03036 14.3631L3.45329
14.4514C3.01988 14.4757 2.64617 14.1508 2.60922 13.7183C2.51969 12.6702 2.36296
10.9268 2.30669 10.8713C1.93925 10.5089 0.0803872 10.5089 0.447694
9.78413C0.815 9.05938 1.93926 6.94737 1.93926 6.94737C2.18421 6.34341 1.93926
5.94296 1.93926 5.07326C1.93926 3.98613 4.1 [...]
fill="#C0C3F1"
/>
- <circle cx="42" cy="36" r="13" fill="#444FD9" />
+ <circle cx="8.8001" cy="6.39995" r="5.2" fill="#444FD9" />
<path
- d="M39 31V37H42V43C42 43 43.6926 40.6557 44.5 39C45.2312
37.5005 46 35 46 35H43L44 31H39Z"
+ d="M7.6001 4.3999V6.7999H8.8001V9.1999C8.8001 9.1999
9.47713 8.26219 9.8001 7.5999C10.0926 7.00009 10.4001 5.9999 10.4001
5.9999H9.2001L9.6001 4.3999H7.6001Z"
fill="white"
stroke="white"
+ stroke-width="0.4"
stroke-linejoin="round"
/>
</svg>
diff --git a/src/pages/index.scss b/src/pages/index.scss
index 209931421fe..74f6a581df8 100644
--- a/src/pages/index.scss
+++ b/src/pages/index.scss
@@ -207,7 +207,7 @@
}
.core-capabilities-group {
- gap: 5rem 1.5rem;
+ gap: 1.5rem;
}
.various-analytics-group {
@@ -329,6 +329,7 @@
}
.ant-tabs-tab-btn {
flex: 1;
+ color: #1d1d1d;
.progress {
display: none;
}
@@ -336,6 +337,7 @@
}
}
.ant-tabs-content-holder {
+ border-left: 1px solid #f2f3fc;
.ant-tabs-content {
height: 100%;
min-height: 300px;
@@ -374,10 +376,74 @@
&.ant-tabs-tabpane-active {
opacity: 1;
+ z-index: 1;
}
&.ant-tabs-tabpane-hidden {
display: block;
opacity: 0;
+ z-index: 0;
+ }
+ }
+ }
+ }
+}
+
+.cases-collapse {
+ text-align: left;
+ .ant-collapse {
+ background-color: #fff;
+ .ant-collapse-item-active {
+ .ant-collapse-header-text {
+ color: #444fd9;
+ }
+ .ant-collapse-expand-icon {
+ transform: rotate(180deg);
+ color: #444fd9;
+ }
+ }
+ .ant-collapse-item {
+ border-bottom: 0px;
+ .ant-collapse-header {
+ align-items: center;
+ padding: 1rem 0;
+ border-bottom: 0.5px solid #dfe5f0;
+ .ant-collapse-expand-icon {
+ padding: 0;
+ transition-property: all;
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+ transition-duration: 150ms;
+ }
+ }
+ .ant-collapse-content-box {
+ height: 12rem;
+ padding: 0;
+ margin-top: 0.75rem;
+ margin-bottom: 0.75rem;
+
+ .cases-bg-datalake {
+ background: url('/static/images/cases-bg-datalake.png')
no-repeat center;
+ background-size: cover;
+ }
+ .cases-bg-ad-hoc {
+ background: url('/static/images/cases-bg-ad-hoc.png')
no-repeat center;
+ background-size: cover;
+ }
+ .cases-bg-customer {
+ background: url('/static/images/cases-bg-customer.png')
no-repeat center;
+ background-size: cover;
+ }
+ .cases-bg-ELT {
+ background: url('/static/images/cases-bg-ELT.png')
no-repeat center;
+ background-size: cover;
+ }
+ .cases-bg-log {
+ background: url('/static/images/cases-bg-log.png')
no-repeat center;
+ background-size: cover;
+ }
+
+ .cases-bg-real-time {
+ background: url('/static/images/cases-bg-real-time.png')
no-repeat center;
+ background-size: cover;
}
}
}
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index dcf5ed59d78..e7b29890780 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -21,9 +21,10 @@ import { VariousAnalyticsData } from
'../constant/various-analytics.data';
import { Swiper, SwiperClass, SwiperSlide } from 'swiper/react';
import { Pagination, Navigation } from 'swiper';
import GetStarted from '@site/src/components/get-started/get-started';
-import { Tabs } from 'antd';
+import { Collapse, Tabs } from 'antd';
import { Content } from 'antd/es/layout/layout';
import ReadMore from '../components/ReadMore';
+import { ArrowDownIcon } from '../components/Icons/arrow-down-icon';
export default function Home(): JSX.Element {
const { siteConfig } = useDocusaurusContext();
@@ -504,7 +505,7 @@ export default function Home(): JSX.Element {
className="lg:pb-[7.5rem] py-16"
title={
<Translate id="homepage.what" description="What is
Apache Doris">
- What is Apache Doris?
+ What is Apache Doris
</Translate>
}
footer={
@@ -567,42 +568,85 @@ export default function Home(): JSX.Element {
</div>
}
>
- <div className="cases-tabs" onMouseEnter={() => setStop(true)}
onMouseLeave={() => setStop(false)}>
- <Tabs
- activeKey={activeKey}
- onChange={activeKey => {
- setCount(0);
- setActiveKey(activeKey);
- }}
- tabPosition={isPhone ? 'top' : 'left'}
- items={VariousAnalyticsData.map(({ content, title,
links, backgroundClassName }, index) => {
- return {
- label: (
- <div className="font-misans text-start">
- <span>{title}</span>
- <div className="absolute -bottom-0
w-full">
- <Progress percent={count} />
- </div>
- </div>
- ),
- key: index.toString(),
- children: (
- <div
- className={`font-misans text-start
h-full ${backgroundClassName} py-14 pr-14 text-base`}
- >
- <div>{content}</div>
+ {isPhone ? (
+ <div className="cases-collapse">
+ <Collapse
+ bordered={false}
+ defaultActiveKey={['0']}
+ accordion
+ expandIcon={ArrowDownIcon}
+ expandIconPosition="right"
+ items={VariousAnalyticsData.map(
+ ({ title, content, icon, links,
backgroundClassName }, index) => {
+ return {
+ key: index,
+ label: (
+ <div className="flex items-center">
+ <div
className="mr-4">{icon}</div>
+ <span
className="text-base">{title}</span>
+ </div>
+ ),
+ children: (
+ <div
+ className={`font-misans
text-start h-full ${backgroundClassName} text-[10px] leading-[17px]`}
+ >
+ <div className=" pt-3
pr-3">{content}</div>
- <div className="flex mt-14 gap-2">
- {links.map(({ content, to }) => (
- <More style={{ textAlign:
'left' }} link={to} text={content} />
- ))}
- </div>
- </div>
- ),
- };
- })}
- />
- {/* {VariousAnalyticsData.map(({ title, content, links,
icon }) => (
+ <div className="flex mt-3
gap-2">
+ {links.map(({ content, to
}) => (
+ <LinkWithArrow
+
className="text-start text-[10px] leading-[17px]"
+ to={to}
+ text={content}
+ />
+ ))}
+ </div>
+ </div>
+ ),
+ };
+ },
+ )}
+ />
+ </div>
+ ) : (
+ <div className="cases-tabs" onMouseMove={() =>
setStop(true)} onMouseLeave={() => setStop(false)}>
+ <Tabs
+ activeKey={activeKey}
+ onChange={activeKey => {
+ setCount(0);
+ setActiveKey(activeKey);
+ }}
+ tabPosition={isPhone ? 'top' : 'left'}
+ items={VariousAnalyticsData.map(
+ ({ content, title, links, backgroundClassName,
icon }, index) => {
+ return {
+ label: (
+ <div className="font-misans
text-start">
+ <span>{title}</span>
+ <div className="absolute
-bottom-0 w-full">
+ <Progress percent={count}
/>
+ </div>
+ </div>
+ ),
+ key: index.toString(),
+ children: (
+ <div
+ className={`font-misans
text-start h-full ${backgroundClassName} py-14 pr-14 text-base leading-7`}
+ >
+ <div>{content}</div>
+
+ <div className="flex mt-14
gap-2">
+ {links.map(({ content, to
}) => (
+ <LinkWithArrow
className="text-start" to={to} text={content} />
+ ))}
+ </div>
+ </div>
+ ),
+ };
+ },
+ )}
+ />
+ {/* {VariousAnalyticsData.map(({ title, content,
links, icon }) => (
<div className="various-analytics-group flex-col
lg:flex-row">
<div className="items-title w-auto lg:w-[27.25rem]
">
<div>{icon}</div>
@@ -620,7 +664,8 @@ export default function Home(): JSX.Element {
</div>
</div>
))} */}
- </div>
+ </div>
+ )}
</PageColumn>
<PageColumn
className="bg-[#F7F9FE]"
diff --git a/src/pages/users/index.tsx b/src/pages/users/index.tsx
index c3056bb7fc9..68639010f6f 100644
--- a/src/pages/users/index.tsx
+++ b/src/pages/users/index.tsx
@@ -34,6 +34,9 @@ export default function Users(): JSX.Element {
return arr.map((item, index) =>
require(`@site/static/images/user-logo-${page}/u-${index + 1}.png`).default);
};
+ const PAGE_SIZE = 32;
+ const [currentSize, setCurrentSize] = useState<number>(PAGE_SIZE);
+
useEffect(() => {
setActive(ALL_TEXT);
}, []);
diff --git a/src/theme/Footer/index.tsx b/src/theme/Footer/index.tsx
index 46722b7ca9c..30143f48b90 100644
--- a/src/theme/Footer/index.tsx
+++ b/src/theme/Footer/index.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
import { useThemeConfig } from '@docusaurus/theme-common';
import FooterLinks from '@theme/Footer/Links';
import FooterLogo from '@theme/Footer/Logo';
@@ -14,6 +14,7 @@ import { YoutubeIcon } from
'@site/src/components/Icons/youtube';
import { LinkedinIcon } from '@site/src/components/Icons/linkedin';
import { MediumIcon } from '@site/src/components/Icons/medium';
import Translate from '@docusaurus/Translate';
+import Link from '@docusaurus/Link';
function Footer() {
const { footer } = useThemeConfig();
@@ -21,6 +22,48 @@ function Footer() {
return null;
}
const { copyright, links, logo, style } = footer;
+
+ const [isDocsPage, setIsDocsPage] = useState(false);
+ useEffect(() => {
+ if (typeof window !== 'undefined') {
+ const pathname = location.pathname.split('/')[1];
+ const docsPage = pathname === 'docs' ||
location.pathname.includes('zh-CN/docs');
+ setIsDocsPage(docsPage);
+ }
+ }, [typeof window !== 'undefined' && location.pathname]);
+
+ const ResourcesItems = (links.find(e => e.title === 'Resources')?.items ||
[]) as any[];
+ const CommunityItems = (links.find(e => e.title === 'Community')?.items ||
[]) as any[];
+
+ if (isDocsPage) {
+ return (
+ <div className="docs-footer">
+ <div className="logo">
+ <FooterLogo logo={logo} />
+ </div>
+ <div className="content">
+ <div className="my-7 text-[#8592A6] text-sm">
+ <div className="flex pb-3 border-b border-[#F7F9FE]
flex-wrap">
+ <div className=" w-40">RESOURCES</div>
+ {ResourcesItems.map(({ label, href }) => (
+ <Link className="w-40 no-underline "
href={href}>
+ {label}
+ </Link>
+ ))}
+ </div>
+ <div className="flex pt-3 flex-wrap">
+ <div className="w-40">COMMUNITY</div>
+ {CommunityItems.map(({ label, href }) => (
+ <Link className="w-40 no-underline "
href={href}>
+ {label}
+ </Link>
+ ))}
+ </div>
+ </div>
+ </div>
+ </div>
+ );
+ }
return (
<div className="footer pt-16 pb-10">
<div className="container">
diff --git a/src/theme/Footer/styles.scss b/src/theme/Footer/styles.scss
index 48a40adbb11..fd5017ed819 100644
--- a/src/theme/Footer/styles.scss
+++ b/src/theme/Footer/styles.scss
@@ -210,3 +210,26 @@
}
}
}
+
+.docs-footer {
+ height: 7.625rem;
+ background-color: #fff;
+ display: flex;
+ border-top: 1px solid #edf2fa;
+ .logo {
+ width: var(--doc-sidebar-width);
+ position: relative;
+ .footer__logo {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ width: 8.5625rem;
+ height: 3.5rem;
+ margin-top: 0;
+ }
+ }
+ .content {
+ flex: 1;
+ }
+}
diff --git a/src/theme/NavbarItem/DocsVersionDropdownNavbarItem.tsx
b/src/theme/NavbarItem/DocsVersionDropdownNavbarItem.tsx
index 8d9cc628f80..43794fa8216 100644
--- a/src/theme/NavbarItem/DocsVersionDropdownNavbarItem.tsx
+++ b/src/theme/NavbarItem/DocsVersionDropdownNavbarItem.tsx
@@ -31,6 +31,7 @@ export default function DocsVersionDropdownNavbarItem({
onClick: () => savePreferredVersionName(version.name),
};
});
+
const items = [...dropdownItemsBefore, ...versionLinks,
...dropdownItemsAfter];
const dropdownVersion = useDocsVersionCandidates(docsPluginId)[0];
// Mobile dropdown is handled a bit differently
@@ -61,7 +62,7 @@ export default function DocsVersionDropdownNavbarItem({
<DropdownNavbarItem
{...props}
mobile={mobile}
- label={<span className="text-sm">Versions</span>}
+ label={<span className="text-sm">Versions: {versionLinks.find(e =>
e.isActive())?.label}</span>}
to={dropdownTo}
items={items}
isActive={dropdownActiveClassDisabled ? () => false : undefined}
diff --git a/src/theme/NavbarItem/DropdownNavbarItem.js
b/src/theme/NavbarItem/DropdownNavbarItem.js
index 8b250f4b463..7ce5d35c758 100644
--- a/src/theme/NavbarItem/DropdownNavbarItem.js
+++ b/src/theme/NavbarItem/DropdownNavbarItem.js
@@ -67,9 +67,9 @@ function DropdownNavbarItemDesktop({ items, position,
className, onClick, ...pro
{props.children ?? props.label}
</NavbarNavLink>
<ul className="dropdown__menu">
- {items.map((childItemProps, i) => (
- <NavbarItem isDropdownItem
activeClassName="dropdown__link--active" {...childItemProps} key={i} />
- ))}
+ {items.map((childItemProps, i) => {
+ return <NavbarItem isDropdownItem
activeClassName="dropdown__link--active" {...childItemProps} key={i} />
+})}
</ul>
</div>
);
diff --git a/static/images/what-is-doris-new.png
b/static/images/what-is-doris-new.png
index ae8d129b53e..16c16b397ac 100644
Binary files a/static/images/what-is-doris-new.png and
b/static/images/what-is-doris-new.png differ
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscr...@doris.apache.org
For additional commands, e-mail: commits-h...@doris.apache.org
