update 4page
This commit is contained in:
+47
-4
@@ -1,5 +1,3 @@
|
||||
/* AIFO Footer — Figma ref: temp/底部栏20260610 Footer */
|
||||
|
||||
.aifo-foot {
|
||||
--foot-bg: #070400;
|
||||
--foot-accent: #f98715;
|
||||
@@ -8,9 +6,12 @@
|
||||
--foot-muted-60: rgba(255, 255, 255, 0.6);
|
||||
--foot-border: rgba(255, 255, 255, 0.16);
|
||||
--foot-chip-bg: rgba(255, 255, 255, 0.2);
|
||||
--foot-glow-overlap: clamp(72px, 11vw, 200px);
|
||||
position: relative;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
/* margin-top: calc(var(--foot-glow-overlap) * -1);
|
||||
padding-top: var(--foot-glow-overlap); */
|
||||
background: var(--foot-bg);
|
||||
color: var(--foot-text);
|
||||
font-family: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
||||
@@ -18,10 +19,43 @@
|
||||
|
||||
.aifo-foot__glow {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
transform: translateX(-50%);
|
||||
width: max(100%, 1920px);
|
||||
height: clamp(560px, 72vw, 960px);
|
||||
pointer-events: none;
|
||||
z-index: 0;
|
||||
background: url("/assets/images/backgrounds/footer_bg.png") center bottom / cover no-repeat;
|
||||
background: url("../images/backgrounds/footer_bg.png") center bottom / 100% auto no-repeat;
|
||||
/* PNG 顶部为纯黑 #000,与 --foot-bg #070400 在宽屏下会形成硬边;顶部渐隐后与页面底色融合 */
|
||||
-webkit-mask-image: linear-gradient(
|
||||
to bottom,
|
||||
transparent 0%,
|
||||
rgba(0, 0, 0, 0.25) 14%,
|
||||
rgba(0, 0, 0, 0.72) 28%,
|
||||
#000 42%,
|
||||
#000 100%
|
||||
);
|
||||
mask-image: linear-gradient(
|
||||
to bottom,
|
||||
transparent 0%,
|
||||
rgba(0, 0, 0, 0.25) 14%,
|
||||
rgba(0, 0, 0, 0.72) 28%,
|
||||
#000 42%,
|
||||
#000 100%
|
||||
);
|
||||
}
|
||||
|
||||
.aifo-foot::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: var(--foot-glow-overlap);
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
background: linear-gradient(to bottom, var(--foot-bg) 0%, rgba(7, 4, 0, 0.55) 55%, transparent 100%);
|
||||
}
|
||||
|
||||
.aifo-foot__inner {
|
||||
@@ -139,6 +173,15 @@
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.aifo-foot__contact-label .icon-dianhua,
|
||||
.aifo-foot__contact-label .icon-youxiang,
|
||||
.aifo-foot__contact-label .icon-dizhi {
|
||||
flex-shrink: 0;
|
||||
font-size: 14px;
|
||||
line-height: 14px;
|
||||
color: #f98715;
|
||||
}
|
||||
|
||||
.aifo-foot__contact-value {
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
|
||||
Reference in New Issue
Block a user