From e384063af0ae61439e9d309514eb6bf5b3dc2654 Mon Sep 17 00:00:00 2001 From: "Evgeny @ SimpleX Chat" <259188159+evgeny-simplex@users.noreply.github.com> Date: Thu, 17 Sep 2026 13:05:00 +0100 Subject: [PATCH] website: update crowdfunding page (#7528) --- website/src/crowdfunding.html | 95 +++----------- website/src/css/livestream.css | 221 +-------------------------------- website/src/js/livestream.js | 91 -------------- website/src/livestream.html | 112 +---------------- 4 files changed, 31 insertions(+), 488 deletions(-) diff --git a/website/src/crowdfunding.html b/website/src/crowdfunding.html index 53d23ab6c4..1f87477b3c 100644 --- a/website/src/crowdfunding.html +++ b/website/src/crowdfunding.html @@ -218,7 +218,6 @@ templateEngineOverride: njk color: #dfeaff; } - .cf-hero .cf-live-link { display: inline-block; margin-top: calc(var(--sec-vhu) * 5); font-size: calc(var(--sec-vwu) * 2.2); position: relative; top: calc(var(--sec-vhu) * 1.5); } /* ---- close: same left-aligned layout as the hero ---- */ .cf-close .area { position: relative; display: flex; align-items: flex-end; padding: 0 calc(var(--sec-vwu) * 7.5) calc(var(--sec-vhu) * 22) 0; } @@ -261,7 +260,6 @@ templateEngineOverride: njk width: fit-content; } .cf-close .cf-hero-cta { margin-top: calc(var(--sec-vhu) * 7); } - .cf-close .cf-live-link { display: inline-block; margin-top: calc(var(--sec-vhu) * 4.5); font-size: calc(var(--sec-vwu) * 2.2); position: relative; top: 0; } .cf-phone { position: absolute; @@ -315,10 +313,9 @@ templateEngineOverride: njk background: linear-gradient(180deg, #00F0FF 0%, #00C7FF 38%, #008FFF 100%); color: #ffffff; } - .cf-hero-invest-link { + .cf-cta-link { display: flex; align-items: center; - gap: calc(var(--sec-vwu) * 0.7); font-family: "Manrope", sans-serif; font-weight: 400; font-size: calc(var(--sec-vwu) * 1.5); @@ -329,10 +326,8 @@ templateEngineOverride: njk -webkit-text-fill-color: transparent; background-clip: text; color: transparent; - --wf-capital-nav-logo-fill: #64fdff; } - .cf-hero-invest-link svg { height: calc(var(--sec-vwu) * 2.1); width: auto; display: block; transform: translateY(calc(var(--sec-vwu) * -0.25)); } - .cf-hero-invest-link:focus-visible { outline: 2px solid #ffffff; outline-offset: 4px; border-radius: 4px; } + .cf-cta-link:focus-visible { outline: 2px solid #ffffff; outline-offset: 4px; border-radius: 4px; } /* the same link twice: beside the button (desktop), in the hero's top right corner (mobile). Only one of the two is ever displayed. */ .cf-hero-corner { display: none; } @@ -370,7 +365,6 @@ templateEngineOverride: njk .cf-pill:active { transform: translateY(1px); } .cf-top { top: 30px; } - .cf-bottom { bottom: 30px; } .cf-primary { background: linear-gradient(90deg, #019bfe 0%, #2e3fa0 100%); @@ -380,39 +374,16 @@ templateEngineOverride: njk .cf-primary:hover { filter: brightness(1.07); } .cf-primary:focus-visible { outline-color: #ffffff; } - .cf-secondary { - background: #ffffff; - color: #006cd7; - border: 1px solid rgba(2, 55, 137, .15); - --wf-capital-nav-logo-fill: #006cd7; - } - .cf-secondary:hover { box-shadow: 0 0 0 1px #80b6eb; } - .cf-pill svg { height: 30px; width: auto; display: block; transform: translateY(-3.5px); } @media screen and (min-width: 960px) { .cf-pill { width: 252px; justify-content: center; } } - .cf-live-link { - font-family: "Manrope", sans-serif; - font-weight: 300; - font-size: calc(var(--sec-vwu) * 1.9); - background: linear-gradient(90deg, #019bfe 0%, #64fdff 58%, #c8feff 100%); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - background-clip: text; - color: transparent; - text-decoration: none; - } - .cf-live-link:focus-visible { outline: 2px solid #019bfe; outline-offset: 2px; } - .cf-pill, - .cf-live-link, - .cf-hero-invest-link, + .cf-cta-link, .cf .text-container a.gradient-text { transition: none; } - .cf-live-link:hover, - .cf-hero-invest-link:hover, + .cf-cta-link:hover, .cf .text-container a.gradient-text:hover { filter: brightness(1.12); } @media screen and (min-width: 960px) { @@ -599,10 +570,8 @@ templateEngineOverride: njk .cf-hero h1, .cf-hero .lead, .cf-hero .cf-stats, - .cf-hero .cf-live-link, .cf-close h1, - .cf-close .cf-close-call, - .cf-close .cf-live-link { + .cf-close .cf-close-call { padding-left: var(--cf-text-inset); padding-right: var(--cf-text-inset); } @@ -653,8 +622,7 @@ templateEngineOverride: njk .cf-close .cf-hero-text { display: contents; } .cf-hero h1, .cf-hero .lead, - .cf-hero .cf-stats, - .cf-hero .cf-live-link { position: relative; z-index: 4; } + .cf-hero .cf-stats { position: relative; z-index: 4; } .cf-hero h1 { font-size: calc(var(--sec-vwu) * 9.7); } .cf-hero .lead { font-size: calc(var(--sec-vwu) * 3.55); max-width: none; margin-top: calc(var(--sec-vhu) * 2); } .cf-close .area { padding: calc(var(--cf-top) + var(--sec-vhu) * 14) var(--cf-gutter) 0; } @@ -664,8 +632,7 @@ templateEngineOverride: njk } /* centred like the home page, the two heading lines set apart */ .cf-close h1, - .cf-close .cf-close-call, - .cf-close .cf-live-link { text-align: center; } + .cf-close .cf-close-call { text-align: center; } /* the heading rides up with the arc; nothing below it moves */ .cf-close h1 { font-size: calc(var(--sec-vwu) * 8.7); font-weight: 700; position: relative; top: -32px; } .cf-close-l1 { font-size: calc(var(--sec-vwu) * 11.745); } @@ -684,12 +651,10 @@ templateEngineOverride: njk padding: calc(var(--sec-vhu) * 2.5) calc(var(--sec-vwu) * 5); } .cf-close-offer p { font-size: calc(var(--sec-vwu) * 3.6); } - .cf-close .cf-live-link { display: block; font-size: calc(var(--sec-vwu) * 5); margin-top: calc(var(--sec-vhu) * 2.5); top: 0; } .cf-stats { top: 0; gap: calc(var(--sec-vwu) * 8); margin-top: calc(var(--sec-vhu) * 3); } .cf-stat img { width: calc(var(--sec-vwu) * 8); } .cf-stat b { font-size: calc(var(--sec-vwu) * 6.5); } .cf-stat span { font-size: calc(var(--sec-vwu) * 3.4); } - .cf-hero .cf-live-link { margin-top: calc(var(--sec-vhu) * 2); top: 0; font-size: calc(var(--sec-vwu) * 5); } /* the pill sits on the bottom edge and rides with the chrome: dvh tracks the visible bottom, svh the box the area is sized from */ .cf-hero .cf-hero-cta, @@ -702,17 +667,16 @@ templateEngineOverride: njk } /* over the phone and the gradient covering it */ .cf-hero .cf-hero-cta { z-index: 5; } - .cf-hero-cta .cf-pill { width: 100%; height: 48px; font-size: 16px; } + .cf-hero-cta .cf-pill { width: 100%; height: 48px; font-size: 16px; gap: 9px; } + .cf-hero-cta .cf-pill svg { height: 30px; transform: translateY(-3.5px); } /* one link, two placements: the top right corner of the hero, and its own button-sized target above the pill on the closing section */ - .cf-hero-invest-link { + .cf-cta-link { height: 48px; font-size: calc(var(--sec-vwu) * 4.6); - gap: calc(var(--sec-vwu) * 1.9); } - .cf-hero-invest-link svg { height: calc(var(--sec-vwu) * 6.5); transform: translateY(calc(var(--sec-vwu) * -0.7)); } - .cf-close .cf-hero-invest-link { justify-content: center; } - .cf-hero .cf-hero-cta .cf-hero-invest-link { display: none; } + .cf-close .cf-cta-link { justify-content: center; } + .cf-hero .cf-hero-cta .cf-cta-link { display: none; } /* a child of the section, so its reference is the section's top edge, which the band raises by --cf-band-shift, as with the arc. z-index clears .area, which is 11 and covers this corner. */ @@ -752,9 +716,7 @@ templateEngineOverride: njk } .cf-pill { font-size: 16px; } - .cf-bottom { top: calc(5px + var(--cf-nav-shift)); right: 16px; bottom: auto; padding: 0 18px; } .cf-top { top: auto; left: 16px; right: 16px; bottom: var(--cf-cta-bottom); height: 48px; justify-content: center; } - .cf-live-link { font-size: calc(var(--sec-vwu) * 4.2); } .cf .text-container a.gradient-text { font-weight: 400; } } @@ -794,11 +756,9 @@ templateEngineOverride: njk .cf-hero h1 { font-size: calc(var(--sec-vwu) * 9.3); } } - /* narrow phones: keep the corner link and the pill clear of the logo */ + /* narrow phones: keep the corner link clear of the logo */ @media screen and (max-width: 389px) { header#navbar > a.logo img { height: 24px; } - .cf-bottom { font-size: 12px; padding: 0 12px; height: 40px; } - .cf-bottom svg { height: 22px; transform: translateY(-2.5px); } .cf-hero-corner { height: 40px; } .cf-tag .v { font-size: 2.96cqh; line-height: 1.4; } } @@ -986,10 +946,10 @@ templateEngineOverride: njk
SimpleX Chat is building a messaging network unlike every major platform — without phone numbers, usernames, emails, or any user identifiers.
-
- Invest on {{ wfLogo() }}
-
+ Subscribe for updates
@@ -1118,12 +1075,11 @@ templateEngineOverride: njk
We are building a network that people own.
We invite you to invest and become part of it.
Invest $500+ by September 22 and get a SimpleX public name for your channel or business for 7 years, ahead of public launch.
@@ -1146,8 +1102,7 @@ templateEngineOverride: njk