xinyouhe/hesu-JT
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

调整

Browse Source
This commit is contained in:
浅念
2026-09-02 14:24:54 +08:00
parent f4fb024e98
commit 9d9e57d7f4
16 changed files with 60 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files
css/business.css
+26 -13
View File
@@ -1,5 +1,5 @@
/* ============================================================
business.css — shared components for the 4 business sub-pages
business.css — shared components for the 4 business sub-pages
(auto-export / after-sales / building-materials / global-logistics)
Loaded AFTER style.css, BEFORE each page's own *.css.
Prefix: .bp-* | hooks: body.is-bp, main.bp
@@ -12,6 +12,10 @@ body.is-bp { background: #ffffff; color: var(--text-dark); font-family: var(--fo
/* ---------- scroll reveal (driven by each page's JS / main.js) ---------- */
[data-reveal] { opacity: 0; transform: translateY(32px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
[data-reveal].in { opacity: 1; transform: none; }
.bp-intro__text{
height: 100%;
position: relative;
}
.bp-intro__text [data-reveal]:nth-child(3),
.bp-intro__text [data-reveal]:nth-child(4) { transition-delay: .08s; }
@@ -42,9 +46,9 @@ body.is-bp { background: #ffffff; color: var(--text-dark); font-family: var(--fo
position: relative;
min-height: 70vh;
display: flex;
align-items: stretch; /* copy fills hero height — enables split layout */
align-items: stretch; /* copy fills hero height — enables split layout */
overflow: hidden;
margin-top: var(--header-h); /* banner starts BELOW the fixed nav — image not covered */
margin-top: var(--header-h); /* banner starts BELOW the fixed nav — image not covered */
}
.bp-hero__scene { position: absolute; inset: 0; z-index: 0; background: #060a12; overflow: hidden; }
.bp-hero__bg {
@@ -68,8 +72,8 @@ body.is-bp { background: #ffffff; color: var(--text-dark); font-family: var(--fo
position: relative; z-index: 3;
text-align: left;
display: flex; flex-direction: column; align-items: flex-start;
padding-top: 16vh; /* title block position — single knob (raise/lower the title) */
padding-bottom: 13vh; /* button's distance from the bottom — single knob */
padding-top: 16vh; /* title block position — single knob (raise/lower the title) */
padding-bottom: 13vh; /* button's distance from the bottom — single knob */
}
.bp-hero--center .bp-hero__copy { text-align: center; align-items: center; }
@@ -106,14 +110,14 @@ body.is-bp { background: #ffffff; color: var(--text-dark); font-family: var(--fo
.bp-hero .btn-explore { margin-top: auto; }
/* ============================================================
BUSINESS INTRODUCTION — 2-col text + image
BUSINESS INTRODUCTION — 2-col text + image
============================================================ */
.bp-intro { padding: 130px 0 110px; }
.bp-intro__grid {
display: grid;
grid-template-columns: 1.15fr 0.85fr;
gap: 50px;
align-items: center;
/* align-items: center; */
}
.bp-intro__text .bp-h2 { margin-bottom: 34px; }
.bp-intro__text .bp-body + .bp-body { margin-top: 22px; }
@@ -130,14 +134,23 @@ body.is-bp { background: #ffffff; color: var(--text-dark); font-family: var(--fo
/* ---------- caps row (auto-export + after-sales): icon + label ---------- */
.bp-caps {
display: grid;
grid-template-columns: repeat(4, 1fr);
/* display: grid; */
/* grid-template-columns: repeat(4, 1fr); */
gap: 14px;
margin-top: 50px;
/* margin-top: 50px; */
position: absolute;
bottom: 0;
width: 100%;
justify-content: space-between;
display: flex;
align-items: center;
}
.bp-cap {
display: flex; flex-direction: column; align-items: center; gap: 16px;
padding: 8px 12px;
display: flex;
flex-direction: column;
align-items: center;
gap: 16px;
/* padding: 8px 12px; */
}
.bp-cap__label {
font-family: var(--font-display);
@@ -149,7 +162,7 @@ body.is-bp { background: #ffffff; color: var(--text-dark); font-family: var(--fo
}
/* ============================================================
VIEW MORE — centered orange link
VIEW MORE — centered orange link
============================================================ */
.bp-viewmore { padding: 64px 0 130px; text-align: center; }
.bp-viewmore__link {