style(site): enlarge banner and tighten spacing

This commit is contained in:
david
2026-07-31 16:30:47 +08:00
parent 88c61b9be4
commit 5f85d53bed
2 changed files with 14 additions and 13 deletions

View File

@@ -42,12 +42,13 @@ a {
.site-shell {
display: grid;
grid-template-rows: auto clamp(230px, 32vh, 300px) auto;
gap: clamp(18px, 2.4vh, 28px);
grid-template-rows: auto clamp(420px, 58vh, 540px) auto;
align-content: start;
gap: clamp(8px, 1.2vh, 12px);
width: min(100%, 1440px);
margin: 0 auto;
padding: clamp(22px, 3.2vh, 38px) clamp(24px, 4.5vw, 68px)
clamp(24px, 3.4vh, 40px);
padding: clamp(16px, 2.2vh, 26px) clamp(24px, 4.5vw, 68px)
clamp(18px, 2.4vh, 28px);
}
.site-header {
@@ -104,7 +105,7 @@ a {
.banner {
position: relative;
min-height: 230px;
min-height: 420px;
overflow: hidden;
background: #dfe8f4;
border: 1px solid rgba(103, 126, 154, 0.14);
@@ -121,7 +122,7 @@ a {
.banner__slide {
position: relative;
min-width: 100%;
min-height: 230px;
min-height: 420px;
overflow: hidden;
}
@@ -150,7 +151,7 @@ a {
display: flex;
width: min(54%, 650px);
height: 100%;
min-height: 230px;
min-height: 420px;
flex-direction: column;
justify-content: center;
padding: clamp(34px, 5vw, 74px);
@@ -217,7 +218,7 @@ a {
.site-footer {
display: grid;
gap: 14px;
gap: 8px;
}
.footer-heading {
@@ -345,7 +346,7 @@ a {
@media (max-width: 980px) {
.site-shell {
grid-template-rows: auto clamp(240px, 34vh, 310px) auto;
grid-template-rows: auto clamp(380px, 52vh, 480px) auto;
}
.banner__copy {
@@ -366,8 +367,8 @@ a {
display: flex;
min-height: 100dvh;
flex-direction: column;
gap: 18px;
padding: 20px 16px 24px;
gap: 10px;
padding: 16px 16px 20px;
}
.brand img {
@@ -395,7 +396,7 @@ a {
.banner,
.banner__slide,
.banner__copy {
min-height: 310px;
min-height: 460px;
}
.banner {