This is an automated email from the ASF dual-hosted git repository.
dmsolr 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 c9de244a1fa fix: restore Apache footer logos and refine homepage
(#1154)
c9de244a1fa is described below
commit c9de244a1faca40a1aa560e40c81bacbd9565bbb
Author: Liming Deng <[email protected]>
AuthorDate: Sat Oct 10 16:42:38 2026 +0800
fix: restore Apache footer logos and refine homepage (#1154)
* fix: restore Apache logos in the shared footer
* fix: refine homepage presentation and center footer notices
---
i18n/zh/code.json | 3 ---
src/components/Footer.module.css | 29 ++++++++++++++++++++++
src/components/Footer.tsx | 15 +++++++++++-
src/data/homepage.ts | 4 ---
src/pages/index.module.css | 53 ----------------------------------------
src/pages/index.tsx | 12 +++------
6 files changed, 47 insertions(+), 69 deletions(-)
diff --git a/i18n/zh/code.json b/i18n/zh/code.json
index 3775cc5f783..f3d4fe6f2b9 100755
--- a/i18n/zh/code.json
+++ b/i18n/zh/code.json
@@ -878,9 +878,6 @@
"releases.summary.2.7.1-release": {
"message": "增强 MCP Server，迁移 WASM 运行时，并改进安全性与基础设施。"
},
- "homepage.refresh.ecosystem": {
- "message": "与你的技术生态，无缝协作"
- },
"team.title": {
"message": "社区团队"
},
diff --git a/src/components/Footer.module.css b/src/components/Footer.module.css
index ce53c2cf060..0e5db44eba3 100644
--- a/src/components/Footer.module.css
+++ b/src/components/Footer.module.css
@@ -32,6 +32,34 @@
color: #929b8d;
}
+.apacheLogos {
+ display: flex;
+ flex-wrap: wrap;
+ align-items: center;
+ gap: 16px;
+ margin-top: 20px;
+}
+
+.apacheLogos a {
+ display: inline-flex;
+ align-items: center;
+ border-radius: 6px;
+}
+
+.apacheLogos a:focus-visible {
+ outline: 2px solid #ffad85;
+ outline-offset: 5px;
+}
+
+.apacheLogos img {
+ display: block;
+}
+
+.foundationLogo {
+ padding: 10px 12px;
+ background: #fff;
+}
+
.group h2 {
font-size: 16px;
font-weight: 600;
@@ -60,6 +88,7 @@
}
.legal {
+ text-align: center;
margin-top: 38px;
padding-top: 22px;
border-top: 1px solid #3a3e35;
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
index 39176beebba..4b8f98d821c 100644
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@@ -6,6 +6,8 @@ import styles from './Footer.module.css';
export default function Footer(): React.ReactElement {
const copy = getHomepageContent();
const logo = useBaseUrl('/img/logo-light.svg');
+ const supportApacheLogo = useBaseUrl('/img/logo/support-apache.png');
+ const foundationLogo = useBaseUrl('/img/logo/asf_logo.svg');
const groups = [{
title: copy.footerProject,
links: [[copy.docs, '/document'], [copy.download, '/download'],
[copy.blog, '/blog'], ['GitHub', 'https://github.com/apache/shenyu']]
@@ -19,7 +21,18 @@ export default function Footer(): React.ReactElement {
return <footer className={styles.footer}>
<div className={styles.container}>
<div className={styles.top}>
- <div className={styles.brand}><Link to="/"><img src={logo} alt="Apache
ShenYu" width="200" height="40" /></Link><p>{copy.footerTagline}</p><span>Open
source. Apache 2.0.</span></div>
+ <div className={styles.brand}>
+ <Link to="/"><img src={logo} alt="Apache ShenYu" width="200"
height="40" /></Link>
+ <p>{copy.footerTagline}</p><span>Open source. Apache 2.0.</span>
+ <div className={styles.apacheLogos}>
+ <a href="https://www.apache.org/";>
+ <img src={supportApacheLogo} alt="Support Apache" width="64"
height="64" />
+ </a>
+ <a className={styles.foundationLogo}
href="https://www.apache.org/";>
+ <img src={foundationLogo} alt="The Apache Software Foundation"
width="120" height="63" />
+ </a>
+ </div>
+ </div>
{groups.map(group => <div className={styles.group}
key={group.title}><h2>{group.title}</h2><ul>{group.links.map(([label, to]) =>
<li key={label}><Link to={to}>{label}</Link></li>)}</ul></div>)}
</div>
<div className={styles.legal}>
diff --git a/src/data/homepage.ts b/src/data/homepage.ts
index 5654dc7814b..28e883738b3 100644
--- a/src/data/homepage.ts
+++ b/src/data/homepage.ts
@@ -76,10 +76,6 @@ export function getHomepageContent() {
id: "homepage.refresh.flowNote",
message: "Many protocols. One place to manage them."
}),
- ecosystem: translate({
- id: "homepage.refresh.ecosystem",
- message: "AT HOME IN YOUR ECOSYSTEM"
- }),
featuresEyebrow: translate({
id: "homepage.refresh.featuresEyebrow",
message: "BUILT FOR REAL-WORLD APIS"
diff --git a/src/pages/index.module.css b/src/pages/index.module.css
index 47c2c99b6ab..7199f1c32b6 100755
--- a/src/pages/index.module.css
+++ b/src/pages/index.module.css
@@ -263,44 +263,6 @@
color: var(--home-accent);
}
-.ecosystem {
- margin-top: 70px;
- padding: 25px 0;
- border-top: 1px solid var(--home-line);
- border-bottom: 1px solid var(--home-line);
- display: flex;
- align-items: center;
- gap: 42px;
-}
-
-.ecosystem > span {
- font-size: 13px;
- line-height: 1.7;
- letter-spacing: 1.5px;
- color: var(--home-muted);
- max-width: 130px;
- flex-shrink: 0;
-}
-
-.ecosystem ul {
- display: flex;
- flex: 1;
- flex-wrap: wrap;
- gap: 18px 28px;
- justify-content: space-between;
- align-items: center;
- list-style: none;
- margin: 0;
- padding: 0;
-}
-
-.ecosystem li {
- font-size: 18px;
- font-weight: 650;
- letter-spacing: -.4px;
- color: var(--home-muted);
-}
-
.section {
padding-top: 94px;
padding-bottom: 94px;
@@ -601,9 +563,6 @@
.adminGrid {
gap: 36px;
}
- .ecosystem {
- gap: 24px;
- }
}
@media (max-width: 800px) {
@@ -628,18 +587,6 @@
max-width: 560px;
justify-self: center;
}
- .ecosystem {
- margin-top: 38px;
- flex-direction: column;
- align-items: flex-start;
- gap: 18px;
- }
- .ecosystem > span {
- max-width: none;
- }
- .ecosystem ul {
- justify-content: flex-start;
- }
.section {
padding-top: 58px;
padding-bottom: 58px;
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index e16945c8738..892121d97fb 100755
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -56,7 +56,7 @@ function RequestFlow({
</div>;
}
function DiagramDeck({copy}: {copy: ReturnType<typeof getHomepageContent>}) {
- const [active, setActive] = useState<'flow' | 'architecture'>('flow');
+ const [active, setActive] = useState<'flow' |
'architecture'>('architecture');
const architecture =
useBaseUrl('/img/architecture/shenyu-readme-architecture.png');
return <div className={styles.diagramDeck} role="group"
aria-label={copy.diagramSwitcher}>
<div className={styles.deckStage}>
@@ -67,7 +67,7 @@ function DiagramDeck({copy}: {copy: ReturnType<typeof
getHomepageContent>}) {
<div className={`${styles.deckCard} ${active === 'architecture' ?
styles.frontCard : styles.backCard}`}>
<div aria-hidden={active !== 'architecture'}
className={styles.cardContent}>
<div className={`${styles.flow} ${styles.architectureCard}`}>
- <div className={styles.flowTop}><span className={styles.statusDot}
/>{copy.architectureTitle}<span className={styles.flowIndex}>02 /
02</span></div>
+ <div className={styles.flowTop}><span className={styles.statusDot}
/>{copy.architectureTitle}<span className={styles.flowIndex}>01 /
02</span></div>
<a className={styles.architectureImage} href={architecture}
target="_blank" rel="noopener noreferrer" tabIndex={active === 'architecture' ?
0 : -1} aria-label={copy.architectureEnlarge}>
<img src={architecture} alt={copy.architectureAlt} width="3360"
height="2016" />
</a>
@@ -78,8 +78,8 @@ function DiagramDeck({copy}: {copy: ReturnType<typeof
getHomepageContent>}) {
</div>
</div>
<div className={styles.deckControls}>
- <button type="button" aria-pressed={active === 'flow'} onClick={() =>
setActive('flow')}>01<span>{copy.flowTab}</span></button>
- <button type="button" aria-pressed={active === 'architecture'}
onClick={() =>
setActive('architecture')}>02<span>{copy.architectureTab}</span></button>
+ <button type="button" aria-pressed={active === 'architecture'}
onClick={() =>
setActive('architecture')}>01<span>{copy.architectureTab}</span></button>
+ <button type="button" aria-pressed={active === 'flow'} onClick={() =>
setActive('flow')}>02<span>{copy.flowTab}</span></button>
</div>
</div>;
}
@@ -159,10 +159,6 @@ export default function Home() {
</div>
<DiagramDeck copy={copy} />
</div>
- <div className={styles.ecosystem}>
- <span>{copy.ecosystem}</span>
- <ul>{['Apache Dubbo', 'Spring Cloud', 'gRPC', 'Kubernetes',
'Apache SkyWalking'].map(name => <li key={name}>{name}</li>)}</ul>
- </div>
</div>
</section>
