This is an automated email from the ASF dual-hosted git repository. chaokunyang pushed a commit to branch optimize_homepage in repository https://gitbox.apache.org/repos/asf/fory-site.git
commit 21a18129243dccabd15844f75898db42a122caeb Author: chaokunyang <[email protected]> AuthorDate: Thu Jun 4 23:06:04 2026 +0800 Polish homepage and docs layout --- src/components/home/HomepageLanding.module.css | 28 +++++++-------- src/components/home/HomepageLanding.tsx | 4 --- src/css/custom.css | 47 +++++++++++++++++--------- 3 files changed, 45 insertions(+), 34 deletions(-) diff --git a/src/components/home/HomepageLanding.module.css b/src/components/home/HomepageLanding.module.css index a67fbb7698..269100579d 100644 --- a/src/components/home/HomepageLanding.module.css +++ b/src/components/home/HomepageLanding.module.css @@ -12,17 +12,17 @@ .hero { align-items: center; background: - linear-gradient(90deg, rgba(255, 112, 1, 0.055), transparent 32%), - linear-gradient(180deg, var(--ifm-background-color), #f9fafb); + linear-gradient(90deg, rgba(255, 112, 1, 0.04), transparent 34%), + linear-gradient(180deg, var(--ifm-background-color), #fafbfc); display: grid; - gap: 2rem; - grid-template-columns: minmax(0, 0.9fr) minmax(440px, 0.82fr); - min-height: 560px; - padding: 4rem max(2rem, calc((100vw - 1180px) / 2)) 4rem; + gap: 3rem; + grid-template-columns: minmax(0, 1fr) minmax(430px, 0.78fr); + min-height: 520px; + padding: 4.25rem max(2rem, calc((100vw - var(--fory-marketing-width, 1240px)) / 2)) 4.5rem; } .heroContent { - max-width: 690px; + max-width: 730px; } .eyebrow, @@ -41,7 +41,7 @@ .sectionHeader h2, .performanceCopy h2, .ecosystem h2 { - font-size: 3.65rem; + font-size: 3.75rem; line-height: 1.02; margin: 0; } @@ -50,8 +50,8 @@ color: var(--ifm-color-emphasis-800); font-size: 1.2rem; line-height: 1.72; - margin: 1.35rem 0 0; - max-width: 650px; + margin: 1.2rem 0 0; + max-width: 690px; } .heroActions { @@ -130,14 +130,14 @@ .surfacePanel { justify-self: end; - max-width: 540px; + max-width: 520px; min-width: 0; width: 100%; } .surfaceOptions { display: grid; - gap: 0.85rem; + gap: 0.95rem; grid-template-columns: repeat(2, minmax(0, 1fr)); } @@ -156,8 +156,8 @@ color: var(--ifm-font-color-base); display: grid; gap: 0.7rem; - min-height: 136px; - padding: 1rem; + min-height: 128px; + padding: 1.05rem; text-decoration: none; transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; } diff --git a/src/components/home/HomepageLanding.tsx b/src/components/home/HomepageLanding.tsx index 1770c9e56b..762b3c2895 100644 --- a/src/components/home/HomepageLanding.tsx +++ b/src/components/home/HomepageLanding.tsx @@ -29,7 +29,6 @@ type RuntimeExample = { }; type Copy = { - heroEyebrow: string; heroTitle: string; heroSubtitle: string; heroPrimary: string; @@ -60,7 +59,6 @@ type Copy = { const copies: Record<"en" | "zh", Copy> = { en: { - heroEyebrow: "Apache Fory™ - Blazingly-Fast Multi-language Serialization", heroTitle: "Apache Fory™", heroSubtitle: "A blazingly-fast multi-language serialization framework for idiomatic domain objects, Schema IDL, and cross-language data exchange.", @@ -96,7 +94,6 @@ const copies: Record<"en" | "zh", Copy> = { "Choose the wire mode for each boundary, promote shared models into Fory IDL when contracts need to last, then validate the exact path with per-language benchmarks.", }, zh: { - heroEyebrow: "Apache Fory™ - 高性能多语言序列化", heroTitle: "Apache Fory™", heroSubtitle: "一个面向原生领域对象、Schema IDL 和跨语言数据交换的高性能多语言序列化框架。", @@ -666,7 +663,6 @@ function HomepageLanding(): JSX.Element { <main className={styles.homepage}> <section className={styles.hero}> <div className={styles.heroContent}> - <div className={styles.eyebrow}>{copy.heroEyebrow}</div> <h1>{copy.heroTitle}</h1> <p className={styles.heroSubtitle}>{copy.heroSubtitle}</p> <div className={styles.heroActions}> diff --git a/src/css/custom.css b/src/css/custom.css index de2b646a46..98d24b3830 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -6,7 +6,8 @@ /* You can override the default Infima variables here. */ :root { - --fory-layout-width: 1180px; + --fory-layout-width: 1280px; + --fory-marketing-width: 1240px; --ifm-navbar-height: 4rem; --ifm-color-primary: #ff6f01d2; --ifm-color-primary-dark: #FF7001; @@ -33,8 +34,8 @@ @media (min-width: 997px) { .navbar { - padding-left: 2rem; - padding-right: 2rem; + padding-left: 1.5rem; + padding-right: 1.5rem; } .navbar__inner { @@ -43,8 +44,8 @@ max-width: var(--fory-layout-width); } -.navbar__brand { - margin-right: 1.5rem; + .navbar__brand { + margin-right: 1.75rem; } } @@ -73,8 +74,8 @@ .navbar__link { color: var(--ifm-navbar-link-color); font-size: .9375rem; - padding-left: .55rem; - padding-right: .55rem; + padding-left: .65rem; + padding-right: .65rem; } .navbar__items--right .dropdown > .navbar__link { @@ -173,16 +174,16 @@ /* Docs reading surface */ :root { - --fory-doc-content-width: 860px; - --fory-doc-shell-width: 908px; - --fory-doc-wide-width: 860px; - --fory-doc-gutter-width: 24px; - --fory-doc-sidebar-inset: 2.75rem; - --fory-doc-toc-right-inset: 5.5rem; + --fory-doc-content-width: 940px; + --fory-doc-shell-width: 988px; + --fory-doc-wide-width: 988px; + --fory-doc-gutter-width: 18px; + --fory-doc-sidebar-inset: 2rem; + --fory-doc-toc-right-inset: 1.5rem; } html:root { - --doc-sidebar-width: 310px; + --doc-sidebar-width: 300px; } .theme-doc-breadcrumbs, @@ -250,7 +251,21 @@ html:root { margin-left: auto; margin-right: auto; max-width: none; - width: calc(100% - 4rem); + width: 100%; + } + + html body [class*="docItemCol_"] { + flex: 0 0 80% !important; + max-width: 80% !important; + min-width: 0; + width: 80% !important; + } + + html body [class*="docItemCol_"] + .col.col--3 { + --ifm-col-width: 20%; + flex: 0 0 20% !important; + max-width: 20% !important; + width: 20% !important; } .theme-doc-breadcrumbs, @@ -330,7 +345,7 @@ html:root { @media (min-width: 997px) { .theme-doc-sidebar-menu { - padding-left: max(.75rem, calc((100vw - var(--fory-layout-width)) / 2 - .5rem)); + padding-left: max(.75rem, calc((100vw - var(--fory-layout-width)) / 2)); } } --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
