This is an automated email from the ASF dual-hosted git repository.
xiaoyu pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/shenyu-website.git
The following commit(s) were added to refs/heads/main by this push:
new e0b0aba516 index page update (#706)
e0b0aba516 is described below
commit e0b0aba5160b55e67d47daa57bd43024bc2653b0
Author: gouzixing <[email protected]>
AuthorDate: Sat Aug 13 16:52:47 2022 +0800
index page update (#706)
* newsPage
* news page
* bugfix
* news page update
* bugfix --path bug
* conflict
* conflict
* img update
* blog page refractor
* blog page new style
* delete annotate
* index page highlight for slogon
* bugfix:document for node
* bugfix--link false
* i18n & link fix
* 'translate'
* translate
* urlchange bugfix
* docs fix
* delete unused import
* fix
* event page & navibar update & overview doc & pic update for news
* lint
* lint
* translate
* lint
* trans
* feat
* fix--locale=zh
* docs fix
* footer
* i18n
* userList
* fix
* fix
* fix
* index
* fix
* hover
* fix
* index page
Co-authored-by: gouzixing <[email protected]>
Co-authored-by: gouzixing <[email protected]>
---
i18n/zh/code.json | 33 ------
src/components/FeatureCard.module.css | 16 +--
src/components/Features.module.css | 32 +++--
src/components/Features.tsx | 89 ++++++++++----
src/pages/index.module.css | 7 ++
src/pages/index.tsx | 132 +++++++++++----------
static/img/home/2_1.jpg | Bin 0 -> 638461 bytes
static/img/home/2_2.jpg | Bin 0 -> 694717 bytes
static/img/home/2_3.jpg | Bin 0 -> 307920 bytes
static/img/home/2_4.jpg | Bin 0 -> 306189 bytes
static/img/home/2_5.jpg | Bin 0 -> 429615 bytes
static/img/home/2_6.jpg | Bin 0 -> 446375 bytes
static/img/home/{flow.svg => apiGovernance.svg} | 2 +-
static/img/home/clusters.svg | 2 +-
static/img/home/{performance.svg => dashboard.svg} | 2 +-
.../img/home/{multi-plugins.svg => extensions.svg} | 2 +-
static/img/home/language.svg | 1 +
static/img/home/observability.svg | 1 +
static/img/home/{rich-protocol.svg => proxy.svg} | 2 +-
static/img/home/{extended.svg => security.svg} | 2 +-
20 files changed, 172 insertions(+), 151 deletions(-)
diff --git a/i18n/zh/code.json b/i18n/zh/code.json
index 5d3efe2126..f17439bf82 100755
--- a/i18n/zh/code.json
+++ b/i18n/zh/code.json
@@ -274,39 +274,6 @@
"Plug-in design idea, plug-in hot plug, easy to expand.Built-in rich plugin
support, authentication, limiting, fuse, firewall, etc.": {
"message": "插件化设计思想，插件热插拔，易扩展。内置丰富的插件，支持鉴权、限流、熔断、防火墙等"
},
- "Rich protocols": {
- "message": "丰富的协议"
- },
- "Supports Dubbo, Tars, Spring-Cloud, gRPC.": {
- "message": "支持 Dubbo，Tars，Spring-Cloud，gRPC。"
- },
- "Plug-in design idea, plug-in hot plug, easy to expand.": {
- "message": "插件化设计思想，插件热插拔，易扩展。"
- },
- "Flow Control": {
- "message": "流控"
- },
- "Flexible flow filtering to meet various flow control.": {
- "message": "灵活的流量筛选，能满足各种流量控制。"
- },
- "Built-in Plug-ins": {
- "message": "内置插件"
- },
- "Built-in rich plugin support, authentication, limiting, fuse, firewall,
etc.": {
- "message": "内置丰富的插件支持，鉴权，限流，熔断，防火墙等。"
- },
- "High Performance": {
- "message": "高性能"
- },
- "Dynamic flow configuration, high performance, gateway consumption is
1~2ms.": {
- "message": "流量配置动态化，性能极高，网关消耗在 1~2ms。"
- },
- "Cluster Deployment": {
- "message": "集群部署"
- },
- "Support cluster deployment, A/B Test, blue-green release.": {
- "message": "支持集群部署，支持 A/B Test，蓝绿发布。"
- },
"Feature List": {
"message": "特性一览"
},
diff --git a/src/components/FeatureCard.module.css
b/src/components/FeatureCard.module.css
index 5e89efc4ac..c4d489828b 100644
--- a/src/components/FeatureCard.module.css
+++ b/src/components/FeatureCard.module.css
@@ -3,10 +3,7 @@
border-radius: 15px;
padding: 1rem;
box-shadow: var(--ifm-navbar-shadow);
- display: grid;
- align-items: center;
- justify-content: center;
- grid-template-columns: 0.3fr 1fr;
+ height: 200px;
text-align: center;
}
@@ -17,18 +14,13 @@
.featureCard h3 {
color: var(--verdaccio-color);
- font-weight: normal;
+ font-weight: bold;
font-size: 1.375rem;
}
.featureCard p {
color: var(--p-color);
+ /* font-size: 0.5rem; */
font-size: var(--font-size);
}
-
- @media only screen and (max-width: 600px) {
- .featureCard {
- text-align: left;
- column-gap: 2rem;
- }
- }
\ No newline at end of file
+
\ No newline at end of file
diff --git a/src/components/Features.module.css
b/src/components/Features.module.css
index d7f2142602..1b942a6b4a 100644
--- a/src/components/Features.module.css
+++ b/src/components/Features.module.css
@@ -2,34 +2,30 @@
max-width: 100%;
margin: 0 auto;
}
-
- .features--wrap {
- display: grid;
- grid-template-columns: repeat(2, 1fr);
- gap: 1rem;
- }
- .linkFeatures {
- margin-top: 2rem;
- text-align: center;
- }
-
.blockTitle:before {
content: "";
display: block;
width: 50px;
height: 3px;
- background-color: var(--ifm-color-primary);
+ background-color: #000033;
margin: 0 auto 8px;
}
.blockTitle {
text-shadow: 4px 6px 0 rgb(0 0 0 / 7%);
text-align: center;
+ margin-bottom: 40px;
}
-
- @media only screen and (max-width: 600px) {
- .features--wrap {
- grid-template-columns: repeat(1, 1fr);
- }
- }
\ No newline at end of file
+
+ :global(.swiper-slide){
+ transform: scale(0.8);
+ }
+
+ :global(.swiper-slide-shadow-left){
+ background-image: linear-gradient(to left,rgba(0,0,0,0),rgba(0,0,0,0))
!important;
+ }
+
+ :global(.swiper-slide-shadow-right){
+ background-image: linear-gradient(to left,rgba(0,0,0,0),rgba(0,0,0,0))
!important;
+ }
\ No newline at end of file
diff --git a/src/components/Features.tsx b/src/components/Features.tsx
index efae6926a2..ac1d569b6f 100644
--- a/src/components/Features.tsx
+++ b/src/components/Features.tsx
@@ -5,53 +5,78 @@ import FeatureCard from './FeatureCard';
import styles from './Features.module.css';
+import { Swiper, SwiperSlide } from "swiper/react";
+import SwiperCore, {
+ Autoplay,
+ EffectCoverflow
+} from 'swiper';
+import "swiper/css";
+import "swiper/css/navigation";
+import "swiper/css/pagination";
+
const FEATURES = [
{
- image: '/img/home/rich-protocol.svg',
- title: translate({ message: 'Rich protocols' }),
+ image: '/img/home/proxy.svg',
+ title: translate({ message: 'Proxy' }),
+ subtitle: translate({
+ message:
+ 'Support for Apache® Dubbo™, Spring Cloud, gRPC, Motan, SOFA, TARS,
WebSocket, MQTT.',
+ }),
+ },
+ {
+ image: '/img/home/security.svg',
+ title: translate({ message: 'Security' }),
subtitle: translate({
message:
- 'Supports Dubbo, Tars, Spring-Cloud, gRPC.',
+ 'Sign, OAuth 2.0, JSON Web Tokens, WAF plugin.',
}),
},
{
- image: '/img/home/extended.svg',
- title: translate({ message: 'Pluggable' }),
+ image: '/img/home/apiGovernance.svg',
+ title: translate({ message: 'API governance' }),
subtitle: translate({
message:
- 'Plug-in design idea, plug-in hot plug, easy to expand.',
+ 'Request, response, parameter mapping, Hystrix, RateLimiter plugin.',
}),
},
{
- image: '/img/home/flow.svg',
- title: translate({ message: 'Flow Control' }),
+ image: '/img/home/observability.svg',
+ title: translate({ message: 'Observability' }),
subtitle: translate({
message:
- 'Flexible flow filtering to meet various flow control.',
+ 'Tracing, metrics, logging plugin',
}),
},
{
- image: '/img/home/multi-plugins.svg',
- title: translate({ message: 'Built-in Plug-ins' }),
+ image: '/img/home/dashboard.svg',
+ title: translate({ message: 'Dashboard' }),
subtitle: translate({
message:
- 'Built-in rich plugin support, authentication, limiting, fuse,
firewall, etc.',
+ 'Dynamic traffic control, visual backend for user menu permissions',
}),
},
{
- image: '/img/home/performance.svg',
- title: translate({ message: 'High Performance' }),
+ image: '/img/home/extensions.svg',
+ title: translate({ message: 'Extensions' }),
subtitle: translate({
message:
- 'Dynamic flow configuration, high performance, gateway consumption is
1~2ms.',
+ 'Plugin hot-swapping, dynamic loading',
}),
},
{
image: '/img/home/clusters.svg',
- title: translate({ message: 'Cluster Deployment' }),
+ title: translate({ message: 'Cluster' }),
+ subtitle: translate({
+ message:
+ 'NGINX, Docker, Kubernetes',
+ }),
+ },
+ {
+ image: '/img/home/language.svg',
+ title: translate({ message: 'Language' }),
subtitle: translate({
message:
- 'Support cluster deployment, A/B Test, blue-green release.',
+ 'provides .NET, Python, Go, Java client for API register',
}),
},
];
@@ -60,9 +85,33 @@ const Features = (): React.ReactElement => (
<section className={styles.features}>
<h1 className={styles.blockTitle}><Translate>Feature List</Translate></h1>
<div className={styles['features--wrap']}>
- {FEATURES.map(({ image, title, subtitle }) => (
- <FeatureCard key={title} image={useBaseUrl(image)} title={title}
subtitle={subtitle} />
- ))}
+ <Swiper
+ modules={[Autoplay, EffectCoverflow]}
+ watchSlidesProgress={true}
+ slidesPerView={3.3}
+ centeredSlides={true}
+ slideToClickedSlide={true}
+ loop={true}
+ loopedSlides={3}
+ autoplay={{
+ delay: 2000,
+ }}
+ effect={"coverflow"}
+ grabCursor
+ coverflowEffect={{
+ rotate: 50,
+ stretch: 0,
+ depth: 100,
+ modifier: 1,
+ slideShadows: true,
+ }}
+ >
+ {FEATURES.map(({ image, title, subtitle }) => (
+ <SwiperSlide className={styles.swiperSlide}>
+ <FeatureCard key={title} image={useBaseUrl(image)} title={title}
subtitle={subtitle} />
+ </SwiperSlide>
+ ))}
+ </Swiper>
</div>
</section>
);
diff --git a/src/pages/index.module.css b/src/pages/index.module.css
index 9b4781657c..bd45a2d790 100755
--- a/src/pages/index.module.css
+++ b/src/pages/index.module.css
@@ -13,6 +13,7 @@
.sectionInner {
margin: 0 auto;
+ user-select: none;
}
.featureImage {
@@ -298,4 +299,10 @@
background: linear-gradient(-90deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
width: 88px;
height: 100%;
+}
+
+.contentImg{
+ display: table;
+ margin: 0 auto;
+ width: 80%;
}
\ No newline at end of file
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index fc1235e841..eed34a5da8 100755
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -1,14 +1,23 @@
import React from "react";
import Link from "@docusaurus/Link";
import Translate, { translate } from "@docusaurus/Translate";
+import { Swiper, SwiperSlide } from "swiper/react";
import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
import useBaseUrl from "@docusaurus/useBaseUrl";
import Layout from "@theme/Layout";
+import SwiperCore, {
+ EffectFade,
+ Navigation,
+ Autoplay
+} from 'swiper';
import clsx from "clsx";
import styles from "./index.module.css";
import Features from "../components/Features";
import Footer from "../components/Footer";
+import "swiper/css";
+import "swiper/css/navigation";
+import "swiper/css/pagination";
function Home() {
const {
@@ -28,7 +37,6 @@ function Home() {
src="/img/logo.svg"
className={styles.heroProjectLogo}
></img>
- {/* <span
className={styles.heroProjectSubTitle}>Incubating</span> */}
</h1>
<h3 className={styles.heroProjectTagline}>
<span
@@ -58,73 +66,73 @@ function Home() {
</div>
<div className="col col--5 col--offset-1">
<div className={styles.logoContainer}>
- <img
- alt={translate({ message: "Docusaurus with Keytar" })}
- className={styles.heroLogo}
-
src={useBaseUrl("/img/architecture/shenyu-architecture-3d.png")}
- />
- </div>
- </div>
- </div>
- </div>
- <div className={styles.section}>
- <div className="container text--center">
- <div className="row">
- <div className="col">
<img
- className={styles.featureImage}
- alt="Powered by MDX"
- src={useBaseUrl("/img/home/open.svg")}
+ alt={translate({ message: "Docusaurus with Keytar" })}
+ className={styles.heroLogo}
+
src={useBaseUrl("/img/architecture/shenyu-architecture-3d.png")}
/>
- <h2 className={clsx(styles.featureHeading)}>
- <Translate>Open</Translate>
- </h2>
- <p className="padding-horiz--md">
- <Translate>
- The technology stack is fully open source construction,
- maintain the community neutrality, compatible with the
- community open source ecology, welcome to participate in
- various contributions at any time.
- </Translate>
- </p>
- </div>
- <div className="col">
- <img
- alt="Built Using React"
- className={styles.featureImage}
- src={useBaseUrl("/img/home/high-performance.svg")}
- />
- <h2 className={clsx(styles.featureHeading)}>
- <Translate>High-Performance</Translate>
- </h2>
- <p className="padding-horiz--md">
- <Translate>
- High-performance micro-service API gateway, experienced the
- temper of large-scale scenes.Dynamic flow configuration,
- high performance, gateway consumption is 1~2ms.
- </Translate>
- </p>
- </div>
- <div className="col">
- <img
- alt="Ready for Translations"
- className={styles.featureImage}
- src={useBaseUrl("/img/home/plugins.svg")}
- />
- <h2 className={clsx(styles.featureHeading)}>
- <Translate>Pluggable</Translate>
- </h2>
- <p className="padding-horiz--md">
- <Translate>
- Plug-in design idea, plug-in hot plug, easy to
- expand.Built-in rich plugin support, authentication,
- limiting, fuse, firewall, etc.
- </Translate>
- </p>
</div>
</div>
</div>
</div>
+ <div className={styles.section}>
+ <Swiper
+ modules={[EffectFade, Navigation, Autoplay]}
+ navigation={{
+ nextEl: '.user-swiper-button-next',
+ prevEl: '.user-swiper-button-prev',
+ }}
+ effect={'fade'}
+ fadeEffect={{
+ crossFade: true
+ }}
+ speed={1000}
+ slidesPerView={1}
+ grabCursor
+ autoplay={{
+ delay: 3000,
+ }}
+ >
+ <SwiperSlide>
+ <img
+ className={styles.contentImg}
+ src={useBaseUrl("/img/home/2_1.jpg")}
+ />
+ </SwiperSlide>
+ <SwiperSlide>
+ <img
+ className={styles.contentImg}
+ src={useBaseUrl("/img/home/2_2.jpg")}
+ />
+ </SwiperSlide>
+ <SwiperSlide>
+ <img
+ className={styles.contentImg}
+ src={useBaseUrl("/img/home/2_3.jpg")}
+ />
+ </SwiperSlide>
+ <SwiperSlide>
+ <img
+ className={styles.contentImg}
+ src={useBaseUrl("/img/home/2_4.jpg")}
+ />
+ </SwiperSlide>
+ <SwiperSlide>
+ <img
+ className={styles.contentImg}
+ src={useBaseUrl("/img/home/2_5.jpg")}
+ />
+ </SwiperSlide>
+ <SwiperSlide>
+ <img
+ className={styles.contentImg}
+ src={useBaseUrl("/img/home/2_6.jpg")}
+ />
+ </SwiperSlide>
+ </Swiper>
+ </div>
+ <div className="swiper-button-prev user-swiper-button-prev" style={{
top:"880px", left: "50px" }}></div>
+ <div className="swiper-button-next user-swiper-button-next" style={{
top:"880px", right: "50px" }}></div>
<div className={clsx(styles.section, styles.sectionAlt)}>
<div className="container">
<Features />
diff --git a/static/img/home/2_1.jpg b/static/img/home/2_1.jpg
new file mode 100644
index 0000000000..c5cfafc0b0
Binary files /dev/null and b/static/img/home/2_1.jpg differ
diff --git a/static/img/home/2_2.jpg b/static/img/home/2_2.jpg
new file mode 100644
index 0000000000..608b6e876c
Binary files /dev/null and b/static/img/home/2_2.jpg differ
diff --git a/static/img/home/2_3.jpg b/static/img/home/2_3.jpg
new file mode 100644
index 0000000000..22d4cc0b1a
Binary files /dev/null and b/static/img/home/2_3.jpg differ
diff --git a/static/img/home/2_4.jpg b/static/img/home/2_4.jpg
new file mode 100644
index 0000000000..c27a801eff
Binary files /dev/null and b/static/img/home/2_4.jpg differ
diff --git a/static/img/home/2_5.jpg b/static/img/home/2_5.jpg
new file mode 100644
index 0000000000..37b25fe73e
Binary files /dev/null and b/static/img/home/2_5.jpg differ
diff --git a/static/img/home/2_6.jpg b/static/img/home/2_6.jpg
new file mode 100644
index 0000000000..7d001c0b29
Binary files /dev/null and b/static/img/home/2_6.jpg differ
diff --git a/static/img/home/flow.svg b/static/img/home/apiGovernance.svg
similarity index 89%
rename from static/img/home/flow.svg
rename to static/img/home/apiGovernance.svg
index 6d90a0e2b1..499ed533bb 100644
--- a/static/img/home/flow.svg
+++ b/static/img/home/apiGovernance.svg
@@ -1 +1 @@
-<svg height="200" viewBox="0 0 1024 1024" width="200"
xmlns="http://www.w3.org/2000/svg";><path d="m221.866667
85.333333h580.309333a85.333333 85.333333 0 0 1 68.522667 136.064l-4.48
5.546667-226.218667 258.389333v325.333334a42.666667 42.666667 0 0 1 -37.674667
42.368l-4.992.298666a42.666667 42.666667 0 0 1
-42.368-37.674666l-.298666-4.992v-341.333334a42.666667 42.666667 0 0 1
7.424-24.021333l3.157333-4.096 236.757333-270.549333-580.053333.042666 236.8
270.506667a42.666667 42.666667 0 0 1 [...]
\ No newline at end of file
+<svg height="200" viewBox="0 0 1024 1024" width="200"
xmlns="http://www.w3.org/2000/svg";><path d="m221.866667
85.333333h580.309333a85.333333 85.333333 0 0 1 68.522667 136.064l-4.48
5.546667-226.218667 258.389333v325.333334a42.666667 42.666667 0 0 1 -37.674667
42.368l-4.992.298666a42.666667 42.666667 0 0 1
-42.368-37.674666l-.298666-4.992v-341.333334a42.666667 42.666667 0 0 1
7.424-24.021333l3.157333-4.096 236.757333-270.549333-580.053333.042666 236.8
270.506667a42.666667 42.666667 0 0 1 [...]
\ No newline at end of file
diff --git a/static/img/home/clusters.svg b/static/img/home/clusters.svg
index df06a9a128..ca1c61dd5b 100644
--- a/static/img/home/clusters.svg
+++ b/static/img/home/clusters.svg
@@ -1 +1 @@
-<svg height="200" viewBox="0 0 1024 1024" width="200"
xmlns="http://www.w3.org/2000/svg";><path d="m768
85.333333h-341.333333a85.333333 85.333333 0 0 0 -85.333334
85.333334v512a85.333333 85.333333 0 0 0 85.333334
85.333333h341.333333a85.333333 85.333333 0 0 0
85.333333-85.333333v-512a85.333333 85.333333 0 0 0
-85.333333-85.333334zm-341.333333 85.333334h341.333333v512h-341.333333z"
fill="#049dee"/><path d="m213.333333 213.333333a42.666667 42.666667 0 0 1
42.368 37.674667l.298667 4.992v597. [...]
\ No newline at end of file
+<svg height="200" viewBox="0 0 1024 1024" width="200"
xmlns="http://www.w3.org/2000/svg";><path d="m768
85.333333h-341.333333a85.333333 85.333333 0 0 0 -85.333334
85.333334v512a85.333333 85.333333 0 0 0 85.333334
85.333333h341.333333a85.333333 85.333333 0 0 0
85.333333-85.333333v-512a85.333333 85.333333 0 0 0
-85.333333-85.333334zm-341.333333 85.333334h341.333333v512h-341.333333z"
fill="#000033"/><path d="m213.333333 213.333333a42.666667 42.666667 0 0 1
42.368 37.674667l.298667 4.992v597. [...]
\ No newline at end of file
diff --git a/static/img/home/performance.svg b/static/img/home/dashboard.svg
similarity index 86%
rename from static/img/home/performance.svg
rename to static/img/home/dashboard.svg
index dd0005f003..b1c1d58100 100644
--- a/static/img/home/performance.svg
+++ b/static/img/home/dashboard.svg
@@ -1 +1 @@
-<svg height="200" viewBox="0 0 1024 1024" width="200"
xmlns="http://www.w3.org/2000/svg";><path d="m548.821333 414.848a42.666667
42.666667 0 0 1 63.872 56.32l-3.541333 4.010667-125.866667 125.866666a42.666667
42.666667 0 0 1 -63.872-56.32l3.541334-4.010666z" fill="#03cd8e"/><path
d="m818.56 91.946667-673.877333 240.597333 3.712-.896a85.333333 85.333333 0 0 0
-67.242667 82.517333l.213333 6.954667a85.333333 85.333333 0 0 0 58.624
75.008l2.688.768 277.589334 105.984 106.752 277.418667-1.152- [...]
\ No newline at end of file
+<svg height="200" viewBox="0 0 1024 1024" width="200"
xmlns="http://www.w3.org/2000/svg";><path d="m548.821333 414.848a42.666667
42.666667 0 0 1 63.872 56.32l-3.541333 4.010667-125.866667 125.866666a42.666667
42.666667 0 0 1 -63.872-56.32l3.541334-4.010666z" fill="#ff5c00"/><path
d="m818.56 91.946667-673.877333 240.597333 3.712-.896a85.333333 85.333333 0 0 0
-67.242667 82.517333l.213333 6.954667a85.333333 85.333333 0 0 0 58.624
75.008l2.688.768 277.589334 105.984 106.752 277.418667-1.152- [...]
\ No newline at end of file
diff --git a/static/img/home/multi-plugins.svg b/static/img/home/extensions.svg
similarity index 93%
rename from static/img/home/multi-plugins.svg
rename to static/img/home/extensions.svg
index f6f2de46f6..00315a4b07 100644
--- a/static/img/home/multi-plugins.svg
+++ b/static/img/home/extensions.svg
@@ -1 +1 @@
-<svg height="200" viewBox="0 0 1024 1024" width="200"
xmlns="http://www.w3.org/2000/svg";><path d="m896
85.333333h-298.666667a42.666667 42.666667 0 0 0 -42.666666
42.666667v298.666667a42.666667 42.666667 0 0 0 42.666666
42.666666h298.666667a42.666667 42.666667 0 0 0
42.666667-42.666666v-298.666667a42.666667 42.666667 0 0 0
-42.666667-42.666667zm-42.666667
85.333334v213.333333h-213.333333v-213.333333zm-426.666666
384h-298.666667a42.666667 42.666667 0 0 0 -42.666667 42.666666v298.666667a42.
[...]
\ No newline at end of file
+<svg height="200" viewBox="0 0 1024 1024" width="200"
xmlns="http://www.w3.org/2000/svg";><path d="m896
85.333333h-298.666667a42.666667 42.666667 0 0 0 -42.666666
42.666667v298.666667a42.666667 42.666667 0 0 0 42.666666
42.666666h298.666667a42.666667 42.666667 0 0 0
42.666667-42.666666v-298.666667a42.666667 42.666667 0 0 0
-42.666667-42.666667zm-42.666667
85.333334v213.333333h-213.333333v-213.333333zm-426.666666
384h-298.666667a42.666667 42.666667 0 0 0 -42.666667 42.666666v298.666667a42.
[...]
\ No newline at end of file
diff --git a/static/img/home/language.svg b/static/img/home/language.svg
new file mode 100644
index 0000000000..894ad7d460
--- /dev/null
+++ b/static/img/home/language.svg
@@ -0,0 +1 @@
+<svg t="1660374573045" class="icon" viewBox="0 0 1024 1024" version="1.1"
xmlns="http://www.w3.org/2000/svg"; p-id="7343" width="200" height="200"><path
d="M192 797.867l51.2-115.2-34.133-12.8-51.2
115.2c-12.8-4.267-25.6-4.267-34.134-4.267C55.467 780.8 0 836.267 0
904.533S55.467 1024 123.733 1024s123.734-55.467
123.734-123.733c0-42.667-21.334-81.067-55.467-102.4z m-68.267 192c-46.933
0-89.6-38.4-89.6-89.6 0-46.934 42.667-89.6 89.6-89.6s89.6 42.666 89.6
89.6-42.666 89.6-89.6 89.6zM900.267 0 [...]
\ No newline at end of file
diff --git a/static/img/home/observability.svg
b/static/img/home/observability.svg
new file mode 100644
index 0000000000..961d195867
--- /dev/null
+++ b/static/img/home/observability.svg
@@ -0,0 +1 @@
+<svg t="1660374932550" class="icon" viewBox="0 0 1024 1024" version="1.1"
xmlns="http://www.w3.org/2000/svg"; p-id="904" width="200" height="200"><path
d="M802.6 65.39c45.22 0 82.01 36.79 82.01 82.01v730.04c0 45.22-36.79
82.01-82.01 82.01H218.57c-45.22 0-82.01-36.79-82.01-82.01V147.4c0-45.22
36.79-82.01 82.01-82.01H802.6m0-64H218.57c-80.64 0-146.01 65.37-146.01
146.01v730.04c0 80.64 65.37 146.01 146.01 146.01H802.6c80.64 0 146.01-65.37
146.01-146.01V147.4c0-80.64-65.37-146.01-146.01-146.0 [...]
\ No newline at end of file
diff --git a/static/img/home/rich-protocol.svg b/static/img/home/proxy.svg
similarity index 88%
rename from static/img/home/rich-protocol.svg
rename to static/img/home/proxy.svg
index 0c5a7f6b8c..3fafaac97a 100644
--- a/static/img/home/rich-protocol.svg
+++ b/static/img/home/proxy.svg
@@ -1 +1 @@
-<svg height="200" viewBox="0 0 1024 1024" width="200"
xmlns="http://www.w3.org/2000/svg";><path d="m588.544 375.125333a42.666667
42.666667 0 0 1 60.330667.085334 193.706667 193.706667 0 0 1 6.826666
266.410666l-6.826666 7.253334-213.418667 213.333333a193.706667 193.706667 0 0 1
-273.664-.085333 193.706667 193.706667 0 0 1 0-273.578667 42.666667 42.666667 0
0 1 60.416 60.245333 108.373333 108.373333 0 0 0 -.085333 153.002667 108.373333
108.373333 0 0 0 147.370666 5.290667l5.674667-5.248 21 [...]
\ No newline at end of file
+<svg height="200" viewBox="0 0 1024 1024" width="200"
xmlns="http://www.w3.org/2000/svg";><path d="m588.544 375.125333a42.666667
42.666667 0 0 1 60.330667.085334 193.706667 193.706667 0 0 1 6.826666
266.410666l-6.826666 7.253334-213.418667 213.333333a193.706667 193.706667 0 0 1
-273.664-.085333 193.706667 193.706667 0 0 1 0-273.578667 42.666667 42.666667 0
0 1 60.416 60.245333 108.373333 108.373333 0 0 0 -.085333 153.002667 108.373333
108.373333 0 0 0 147.370666 5.290667l5.674667-5.248 21 [...]
\ No newline at end of file
diff --git a/static/img/home/extended.svg b/static/img/home/security.svg
similarity index 87%
rename from static/img/home/extended.svg
rename to static/img/home/security.svg
index 13ca0031c9..0c04588140 100644
--- a/static/img/home/extended.svg
+++ b/static/img/home/security.svg
@@ -1 +1 @@
-<svg height="200" viewBox="0 0 1024 1024" width="200"
xmlns="http://www.w3.org/2000/svg";><path d="m896 341.333333h-768a42.666667
42.666667 0 0 0 -42.666667 42.666667v170.666667a42.666667 42.666667 0 0 0
42.666667 42.666666h768a42.666667 42.666667 0 0 0
42.666667-42.666666v-170.666667a42.666667 42.666667 0 0 0
-42.666667-42.666667zm-42.666667 85.333334v85.333333h-682.666666v-85.333333z"
fill="#03cd8e"/><path d="m853.333333 170.666667h-682.666666a85.333333 85.333333
0 0 0 -85.333334 85.333 [...]
\ No newline at end of file
+<svg height="200" viewBox="0 0 1024 1024" width="200"
xmlns="http://www.w3.org/2000/svg";><path d="m896 341.333333h-768a42.666667
42.666667 0 0 0 -42.666667 42.666667v170.666667a42.666667 42.666667 0 0 0
42.666667 42.666666h768a42.666667 42.666667 0 0 0
42.666667-42.666666v-170.666667a42.666667 42.666667 0 0 0
-42.666667-42.666667zm-42.666667 85.333334v85.333333h-682.666666v-85.333333z"
fill="#ff5c00"/><path d="m853.333333 170.666667h-682.666666a85.333333 85.333333
0 0 0 -85.333334 85.333 [...]
\ No newline at end of file
