diff --git a/assets/css/aifo-section-glow.css b/assets/css/aifo-section-glow.css index 682a0cd..eab74a1 100644 --- a/assets/css/aifo-section-glow.css +++ b/assets/css/aifo-section-glow.css @@ -6,7 +6,8 @@ :root { --aifo-glow-right-image: url("../images/backgrounds/new-user-promo-welcome-side-glow.png"); - --aifo-glow-left-image: url("../images/backgrounds/new-user-promo-corner-glow.png"); + --aifo-glow-left-top-image: url("../images/backgrounds/new-user-promo-corner-glow.png"); + --aifo-glow-left-image: url("../images/backgrounds/bg_left_academy_section.webp"); --aifo-glow-right-width: min(82vw, 720px); --aifo-glow-left-top: 106px; --aifo-glow-left-offset: -2vw; @@ -47,6 +48,28 @@ mix-blend-mode: screen; } +.aifo-glow-left { + position: absolute; + top: 50%; + right: auto; + left: calc((100% - 100vw) / 2); + bottom: auto; + transform: translateY(-50%); + width: var(--aifo-glow-right-width); + height: 100vh; + height: 100dvh; + max-height: 100svh; + z-index: 0; + pointer-events: none; + background-color: transparent; + background-image: var(--aifo-glow-left-image); + background-repeat: no-repeat; + background-position: left center; + background-size: auto 100%; + mix-blend-mode: screen; +} + + /* Left — from #special-offer-50::before */ .left_bg_light { position: absolute; @@ -57,9 +80,10 @@ max-height: var(--aifo-glow-left-max-height); z-index: 0; pointer-events: none; - background: var(--aifo-glow-left-image) no-repeat left top / cover; + background: var(--aifo-glow-left-top-image) no-repeat left top / cover; } + /* Page-level host (left glow on full page) */ .aifo-page-glow-host { position: relative; @@ -74,3 +98,11 @@ position: relative; z-index: 1; } + +@media (max-width: 768px) { + + .aifo-glow-left + { + width: 127%; + } +} \ No newline at end of file diff --git a/assets/css/partnership.css b/assets/css/partnership.css index 2b4cb05..28a5eb0 100644 --- a/assets/css/partnership.css +++ b/assets/css/partnership.css @@ -316,6 +316,7 @@ grid-template-columns: 1fr; gap: 20px; width: 100%; + } @media (min-width: 640px) { @@ -331,19 +332,38 @@ } #partnership-page .partnership-step { - display: flex; + /* display: flex; */ flex-direction: column; - gap: 40px; + /* gap: 40px; */ padding: 24px; border-radius: 20px; - border: 1px solid rgba(255, 255, 255, 0.16); - background: var(--bg-card); + /* border: 1px solid rgba(255, 255, 255, 0.16); */ + /* background: var(--bg-card); */ + position: relative; + background-size: 100% 100%; +} + +/* 第一个步骤 - 背景1 */ +#partnership-page .partnership-step:nth-child(1) { + background-image: url('../images/partnership/h-1-bg.png'); +} + +/* 第二个和第三个步骤 - 背景2 */ +#partnership-page .partnership-step:nth-child(2), +#partnership-page .partnership-step:nth-child(3) { + background-image: url('../images/partnership/h-2-bg.png'); +} + +/* 最后一个步骤 - 背景3 */ +#partnership-page .partnership-step:nth-child(4) { + background-image: url('../images/partnership/h-3-bg.png'); } #partnership-page .partnership-step__top { display: flex; align-items: center; justify-content: space-between; + margin-bottom: 40px; } #partnership-page .partnership-step__num { @@ -511,6 +531,8 @@ } } + + #partnership-page .partnership-faq__glow { position: absolute; top: 50%; @@ -610,3 +632,52 @@ line-height: 22px; color: var(--text-secondary); } + + +.arrow-circle { + width: 40px; + height: 40px; + border-radius: 50%; + display: flex; + justify-content: center; + flex-shrink: 0; + color: #fff; + transition: all 0.3s ease; + position: absolute; + right: -30px; + top: 50%; + transform: translateY(-50%); + z-index: 999; +} +.arrow-circle svg{ + width: 100%; + height: 100%; +} + +@media (max-width: 1024px) { + #partnership-page .partnership-step { + border: 1px solid rgba(255, 255, 255, 0.16); + background: var(--bg-card); + + } + + /* 第一个步骤 - 背景1 */ + #partnership-page .partnership-step:nth-child(1) { + background-image: unset; + } + + /* 第二个和第三个步骤 - 背景2 */ + #partnership-page .partnership-step:nth-child(2), + #partnership-page .partnership-step:nth-child(3) { + background-image: unset; + } + + /* 最后一个步骤 - 背景3 */ + #partnership-page .partnership-step:nth-child(4) { + background-image: unset; + } + + .arrow-circle { + display: none; + } +} diff --git a/assets/images/partnership/Component 126.png b/assets/images/partnership/Component 126.png new file mode 100644 index 0000000..baa2c9a Binary files /dev/null and b/assets/images/partnership/Component 126.png differ diff --git a/assets/images/partnership/Component 134.png b/assets/images/partnership/Component 134.png new file mode 100644 index 0000000..d50bb71 Binary files /dev/null and b/assets/images/partnership/Component 134.png differ diff --git a/assets/images/partnership/h-1-bg.png b/assets/images/partnership/h-1-bg.png new file mode 100644 index 0000000..5c31a2d Binary files /dev/null and b/assets/images/partnership/h-1-bg.png differ diff --git a/assets/images/partnership/h-2-bg.png b/assets/images/partnership/h-2-bg.png new file mode 100644 index 0000000..97e247c Binary files /dev/null and b/assets/images/partnership/h-2-bg.png differ diff --git a/assets/images/partnership/h-3-bg.png b/assets/images/partnership/h-3-bg.png new file mode 100644 index 0000000..ded49ad Binary files /dev/null and b/assets/images/partnership/h-3-bg.png differ diff --git a/assets/images/partnership/h-icon-1.svg b/assets/images/partnership/h-icon-1.svg new file mode 100644 index 0000000..75ea10e --- /dev/null +++ b/assets/images/partnership/h-icon-1.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/assets/images/partnership/h-icon-2.svg b/assets/images/partnership/h-icon-2.svg new file mode 100644 index 0000000..548eaa7 --- /dev/null +++ b/assets/images/partnership/h-icon-2.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/images/partnership/h-icon-3.svg b/assets/images/partnership/h-icon-3.svg new file mode 100644 index 0000000..d7fd93b --- /dev/null +++ b/assets/images/partnership/h-icon-3.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/assets/images/partnership/h-icon-4.svg b/assets/images/partnership/h-icon-4.svg new file mode 100644 index 0000000..dedb1bb --- /dev/null +++ b/assets/images/partnership/h-icon-4.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + diff --git a/assets/images/partnership/right-arraw.svg b/assets/images/partnership/right-arraw.svg new file mode 100644 index 0000000..da2ff68 --- /dev/null +++ b/assets/images/partnership/right-arraw.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/pages/partnership.html b/pages/partnership.html index 8a0099d..f59b0ed 100644 --- a/pages/partnership.html +++ b/pages/partnership.html @@ -12,11 +12,12 @@ + -
+
@@ -31,6 +32,7 @@
+

Commission Tiers

@@ -86,6 +88,7 @@
+

Why become AIFO partner

@@ -128,31 +131,55 @@
- 1 + Step 1

Apply

Filled out our partnership application

+
+ + + + + + +
- 2 + Step 2

Review

Partnership applications are subject to team review

+
+ + + + + + +
- 3 + Step 3

Launch

Register your AIFO account, get your links, dashboard and start promoting.

+
+ + + + + + +
- 4 + Step 4

Track & Get Paid

@@ -162,6 +189,7 @@
+

Who This Is For