From 7a858695bf0b4a30fd99dded88a5e5db90aeaa88 Mon Sep 17 00:00:00 2001 From: Evgeny Date: Tue, 28 Oct 2025 22:09:17 +0000 Subject: [PATCH] new website (#6412) * website: started new design (#6279) * upload assets & change font to gt-walsheim * fix language issue in learn-more page * design cover for desktop * website: home page sections (#6285) * upload assets & change font to gt-walsheim * fix language issue in learn-more page * design cover for desktop * add section 2, 3 & 4 for desktop --------- Co-authored-by: Evgeny Poberezkin * website: more sections (#6289) * upload assets & change font to gt-walsheim * fix language issue in learn-more page * design cover for desktop * add section 2, 3 & 4 for desktop * website: directory page (#6283) * website: directory page * core: use markdown in directory entries * render markdown on directory page * update markdown * toggle secrets on click * update listings asynchronously * add group links to the listing * cleanup * better directory layout with pagination * script to run website * update page navigation * search * readable markdown colors, better "read less" * core: atomic update of directory listings, to avoid files unavailable * fix symlink, sort entries on page with new first * update listings every 15 min, add activeAt time * fix sorting in the page and listing url * replace simplex:/ links on desktop * website: fix search in directory * add section 5 for Desktop * android, desktop: update dependency * website(directory): add bot address, open simplex links in new tab, improve error handling * made cover responsive * directory: show only recent groups in active/new tabs, page improvements (#6290) * directory: show only recent groups as active or new * round times * sorting order * fix links * improve * directory: disable search autocomplete * directory: show approximate activity/creation time * scripts: suffix deb packages with distribution codename (#6273) * directory: show default image in case of loading error (can happen when group is delisted) * website: add directory to nav bar, fixes (#6293) * website: add directory to nav bar, fixes * docs: update readme * add responsiveness * add socials * remove white redundent line --------- Co-authored-by: Evgeny Poberezkin Co-authored-by: sh <37271604+shumvgolove@users.noreply.github.com> * website: navbar (#6307) * add navbar for desktop * website: complete navbar (#6313) * website: desktop layout for section 2 3 4 5 (#6317) * desktop layout for section 2 3 4 5 * improve mobile layout * resolve navbar issues * delete unwanted svg * cover layout * update section 5 for mobile * section 5 desktop * website: improve layout & section 6 (#6321) * improve layout * add section 6 * website: promoted groups on home page (#6323) * website: promoted groups on home page * use local images when fallback listing is used, replace image on download error with group icon * welcome message * more links * rename CSS classes * website: adding footer (#6326) * adding footer * add footer * update nav * improve spaces in .group-images * quick fix * add community vouchers page * fix footer problem * disable pull to refresh * address bar now hide in safari * website: fallback group images (#6342) * website: new things (#6344) * add learn_more.md section in /learn-more page * fix cover swiping bug & improve gradient * fix click bug of group-images * website: improve layout (#6361) * website: improve layout * fix footer for iphone * add light mode (#6368) * website: important updates (#6375) * design improvements for desktop * design improvements for mobile * same navbar for all pages * add comparison table * update z-index * quick fix * add glassy effect to nav * quick improvement * favicon * quick fix * update nav glassy effect * quick nav update * improve mobile layout * improve mobile layout * improve mobile layout * rotate gradients for mobile * safearea * almost remove background from nav --------- Co-authored-by: Evgeny Poberezkin * website: cover updates (#6380) * remove background from nav * add publications * add security btns * quick fixes * quick fixes * add all btns & made them responsive * add hash & update pages * Revert "remove background from nav" This reverts commit ee27d17484dd4f58f7ff34022a6d303810c017ae. * fix web.sh --------- Co-authored-by: Evgeny Poberezkin * website: translation strings (#6384) * add translation strings for home page * add translation strings for comparison table * update strings * website: update text (#6387) * website: update text * website: additional translation strings * comparison table * update colors * update glossary * website: fix glossary capitalize issue (#6388) * fix glossary capitalize issue * fix gradient scroll issue * fix gradient scroll issue * website: community vouchers and token (#6389) * website: community vouchers and token * website: change translation string * update name * website: update translations, fonts, fix language navigation (#6395) * website: update translations * website: update fonts, fix language navigation * website: update texts (#6404) * website: update texts * website: update texts * update the text * website: update texts * update * web: mobile layout / safe area (#6408) * improve status bar / safe area coloring * improve status coloring * website: popup to mint nft (WIP) (#6410) * website: popup to mint nft (WIP) * update dApp * minting works * update dApp * update * update app * improve * update network to arbitrum * update copyright * website: layout fixes, token button (#6415) * update images, add note about arbitrum * update colors * website: update tokens, switch dApp to Ethereum --------- Co-authored-by: M. Sarmad Qadeer Co-authored-by: sh <37271604+shumvgolove@users.noreply.github.com> --- .gitignore | 1 + README.md | 2 + docs/GLOSSARY.md | 10 +- website/.eleventy.js | 14 +- website/README.md | 9 + website/langs/bg.json | 2 +- website/langs/cs.json | 2 +- website/langs/de.json | 2 +- website/langs/en.json | 3 +- website/langs/es.json | 2 +- website/langs/fi.json | 2 +- website/langs/fr.json | 2 +- website/langs/he.json | 2 +- website/langs/hu.json | 2 +- website/langs/id.json | 2 +- website/langs/it.json | 2 +- website/langs/ja.json | 2 +- website/langs/nl.json | 2 +- website/langs/pl.json | 2 +- website/langs/pt_BR.json | 2 +- website/langs/ro.json | 2 +- website/langs/ru.json | 2 +- website/langs/tr.json | 2 +- website/langs/uk.json | 2 +- website/langs/zh_Hans.json | 2 +- website/langs/zh_Hant.json | 2 +- website/package.json | 1 + website/src/_data/docs_dropdown.json | 4 +- website/src/_data/glossary.json | 4 + website/src/_data/languages.json | 25 +- website/src/_includes/footer.html | 2 +- website/src/_includes/hero.html | 2 +- website/src/_includes/layouts/article.html | 7 +- website/src/_includes/layouts/doc.html | 11 +- website/src/_includes/layouts/jobs.html | 9 +- website/src/_includes/layouts/main.html | 9 +- website/src/_includes/layouts/privacy.html | 5 +- website/src/_includes/layouts/token.html | 809 +++++++++ website/src/_includes/navbar.html | 346 ++-- website/src/_includes/sections/messaging.md | 21 + website/src/_includes/simplex_explained.html | 6 +- website/src/blog.html | 6 +- website/src/css/blog.css | 20 +- website/src/css/design3-nav.css | 644 ++++++++ website/src/css/design3.css | 1461 +++++++++++++++++ website/src/css/doc.css | 10 +- website/src/css/style.css | 351 ++-- website/src/directory.html | 16 +- .../GT-Walsheim-LC-Bold-Oblique.woff2 | Bin 0 -> 63496 bytes .../GT-Walsheim/GT-Walsheim-LC-Bold.woff2 | Bin 0 -> 60160 bytes .../GT-Walsheim-LC-Light-Oblique.woff2 | Bin 0 -> 60612 bytes .../GT-Walsheim/GT-Walsheim-LC-Light.woff2 | Bin 0 -> 57304 bytes .../GT-Walsheim-LC-Medium-Oblique.woff2 | Bin 0 -> 60156 bytes .../GT-Walsheim/GT-Walsheim-LC-Medium.woff2 | Bin 0 -> 56048 bytes .../GT-Walsheim-LC-Regular-Oblique.woff2 | Bin 0 -> 61376 bytes .../GT-Walsheim/GT-Walsheim-LC-Regular.woff2 | Bin 0 -> 57516 bytes website/src/fonts/GT-Walsheim/README.md | 1 + website/src/fonts/Manrope/Manrope-Bold.ttf | Bin 0 -> 96800 bytes .../src/fonts/Manrope/Manrope-ExtraBold.ttf | Bin 0 -> 97524 bytes .../src/fonts/Manrope/Manrope-ExtraLight.ttf | Bin 0 -> 96700 bytes website/src/fonts/Manrope/Manrope-Light.ttf | Bin 0 -> 96728 bytes website/src/fonts/Manrope/Manrope-Medium.ttf | Bin 0 -> 96904 bytes website/src/fonts/Manrope/Manrope-Regular.ttf | Bin 0 -> 96832 bytes .../src/fonts/Manrope/Manrope-SemiBold.ttf | Bin 0 -> 96936 bytes website/src/img/design_3/android-dark.png | Bin 0 -> 1407 bytes .../img/design_3/community_vouchers_dark.jpg | Bin 0 -> 68301 bytes .../img/design_3/community_vouchers_light.jpg | Bin 0 -> 69214 bytes website/src/img/design_3/cover-light.jpg | Bin 0 -> 307757 bytes website/src/img/design_3/cover-light.webp | Bin 0 -> 866098 bytes website/src/img/design_3/cover.jpg | Bin 0 -> 252470 bytes website/src/img/design_3/cover.webp | Bin 0 -> 430550 bytes website/src/img/design_3/green-tick.svg | 11 + website/src/img/design_3/logo-light.png | Bin 0 -> 6448 bytes .../src/img/design_3/publications/heise.png | Bin 0 -> 36191 bytes .../img/design_3/publications/kuketz-blog.png | Bin 0 -> 45727 bytes .../src/img/design_3/publications/optout.png | Bin 0 -> 67093 bytes .../design_3/publications/privacy-guides.png | Bin 0 -> 69021 bytes .../design_3/publications/trail-of-bits.png | Bin 0 -> 69152 bytes .../src/img/design_3/publications/whonix.png | Bin 0 -> 43512 bytes website/src/img/design_3/red-x.svg | 9 + .../img/design_3/section-2-desktop-light.webp | Bin 0 -> 414642 bytes .../src/img/design_3/section-2-desktop.webp | Bin 0 -> 380844 bytes .../img/design_3/section-2-mobile-light.webp | Bin 0 -> 375812 bytes .../src/img/design_3/section-2-mobile.webp | Bin 0 -> 356148 bytes .../img/design_3/section-3-desktop-light.webp | Bin 0 -> 131714 bytes .../src/img/design_3/section-3-desktop.webp | Bin 0 -> 131982 bytes .../img/design_3/section-3-mobile-light.webp | Bin 0 -> 154430 bytes .../src/img/design_3/section-3-mobile.webp | Bin 0 -> 154090 bytes .../img/design_3/section-4-desktop-light.webp | Bin 0 -> 215458 bytes .../src/img/design_3/section-4-desktop.webp | Bin 0 -> 206424 bytes .../img/design_3/section-4-mobile-light.webp | Bin 0 -> 176788 bytes .../src/img/design_3/section-4-mobile.webp | Bin 0 -> 163056 bytes .../img/design_3/section-5-desktop-light.webp | Bin 0 -> 210490 bytes .../src/img/design_3/section-5-desktop.webp | Bin 0 -> 206614 bytes .../img/design_3/section-5-mobile-light.webp | Bin 0 -> 167638 bytes .../src/img/design_3/section-5-mobile.webp | Bin 0 -> 164294 bytes .../img/design_3/secure_messaging_dark.jpg | Bin 0 -> 77903 bytes .../img/design_3/secure_messaging_light.jpg | Bin 0 -> 72370 bytes website/src/img/design_3/simplex_nft_smpx.jpg | Bin 0 -> 101634 bytes website/src/img/design_3/socials/apple.png | Bin 0 -> 63039 bytes website/src/img/design_3/socials/linux.png | Bin 0 -> 157913 bytes website/src/img/design_3/socials/windows.png | Bin 0 -> 217179 bytes website/src/img/design_3/testflight-dark.png | Bin 0 -> 18988 bytes website/src/img/design_3/yellow-tick.svg | 11 + website/src/img/flags/id.svg | 4 + .../groups/images/478ec86_izoJb95VXKWEhg.jpg | Bin 0 -> 8783 bytes .../groups/images/5QzoN8PNFD2dkButszPu5g.png | Bin 0 -> 5928 bytes .../groups/images/9aT7qRY_JbSJsW4qDaIHEg.jpg | Bin 0 -> 9099 bytes .../groups/images/AXalaTZ4HsgGtEkaGFbclg.png | Bin 0 -> 9333 bytes .../groups/images/B3xza7zUzYi3dHiRsg6Afg.jpg | Bin 0 -> 9279 bytes .../groups/images/BD6FXuHO-eKOnYCAzkRfmA.jpg | Bin 0 -> 9226 bytes .../groups/images/CX-1MPD3r3a7NYBvW7de6g.jpg | Bin 0 -> 7039 bytes .../groups/images/ESomaJp7MlFlThqcoj3Ycg.png | Bin 0 -> 1014 bytes .../groups/images/F4hPy5IGO6G9QUH6-nM_-A.jpg | Bin 0 -> 9177 bytes .../groups/images/HylzOLARvIhUR1wiq0fnJA.png | Bin 0 -> 8094 bytes .../groups/images/NvmOInofh4RSB2fHdN0zQA.jpg | Bin 0 -> 9068 bytes .../groups/images/PPTLdveOyb9Wsg3bm6Y_IQ.png | Bin 0 -> 8326 bytes .../groups/images/TwaN96DcV2OCMfUo6oJ4LQ.png | Bin 0 -> 7301 bytes .../groups/images/Wsdcf731ufbEOYpHc2rqrg.jpg | Bin 0 -> 9252 bytes .../groups/images/YLLz-47eBnAoIH1PKYJ75g.jpg | Bin 0 -> 8947 bytes .../groups/images/YhyznG68PNewCNjoD_ceOg.png | Bin 0 -> 9342 bytes .../groups/images/eb2RINRsdEBI0a06ghzqVg.jpg | Bin 0 -> 8933 bytes .../groups/images/gqyRO21CwqK3huZ2zbkOqQ.jpg | Bin 0 -> 9094 bytes .../groups/images/n3VLCEBWhqU9rVtlEAKUhQ.jpg | Bin 0 -> 9198 bytes .../groups/images/t1RmI4AhKgelVoWeSBTqUA.jpg | Bin 0 -> 9136 bytes .../groups/images/uZU6Cn1przsjVJ-DBm1-eA.jpg | Bin 0 -> 9316 bytes .../groups/images/zIotMF8Zoe85k956B48N9g.jpg | Bin 0 -> 8826 bytes website/src/img/messengers/briar.svg | 4 + website/src/img/messengers/cwtch.png | Bin 0 -> 51791 bytes website/src/img/messengers/element.svg | 14 + website/src/img/messengers/session.svg | 1 + website/src/img/messengers/signal.png | Bin 0 -> 6815 bytes website/src/img/new/arrow-left-dark.svg | 2 +- website/src/img/new/arrow-right-dark.svg | 2 +- website/src/img/new/tab-video.svg | 2 +- website/src/index.html | 534 +++--- website/src/js/design3.js | 309 ++++ website/src/js/directory.js | 74 +- website/src/messaging.html | 331 ++++ website/src/token.md | 74 + website/tailwind.config.js | 14 +- website/web.sh | 5 +- 142 files changed, 4557 insertions(+), 693 deletions(-) create mode 100644 website/README.md create mode 100644 website/src/_includes/layouts/token.html create mode 100644 website/src/_includes/sections/messaging.md create mode 100644 website/src/css/design3-nav.css create mode 100644 website/src/css/design3.css create mode 100644 website/src/fonts/GT-Walsheim/GT-Walsheim-LC-Bold-Oblique.woff2 create mode 100644 website/src/fonts/GT-Walsheim/GT-Walsheim-LC-Bold.woff2 create mode 100644 website/src/fonts/GT-Walsheim/GT-Walsheim-LC-Light-Oblique.woff2 create mode 100644 website/src/fonts/GT-Walsheim/GT-Walsheim-LC-Light.woff2 create mode 100644 website/src/fonts/GT-Walsheim/GT-Walsheim-LC-Medium-Oblique.woff2 create mode 100644 website/src/fonts/GT-Walsheim/GT-Walsheim-LC-Medium.woff2 create mode 100644 website/src/fonts/GT-Walsheim/GT-Walsheim-LC-Regular-Oblique.woff2 create mode 100644 website/src/fonts/GT-Walsheim/GT-Walsheim-LC-Regular.woff2 create mode 100644 website/src/fonts/GT-Walsheim/README.md create mode 100644 website/src/fonts/Manrope/Manrope-Bold.ttf create mode 100644 website/src/fonts/Manrope/Manrope-ExtraBold.ttf create mode 100644 website/src/fonts/Manrope/Manrope-ExtraLight.ttf create mode 100644 website/src/fonts/Manrope/Manrope-Light.ttf create mode 100644 website/src/fonts/Manrope/Manrope-Medium.ttf create mode 100644 website/src/fonts/Manrope/Manrope-Regular.ttf create mode 100644 website/src/fonts/Manrope/Manrope-SemiBold.ttf create mode 100644 website/src/img/design_3/android-dark.png create mode 100644 website/src/img/design_3/community_vouchers_dark.jpg create mode 100644 website/src/img/design_3/community_vouchers_light.jpg create mode 100644 website/src/img/design_3/cover-light.jpg create mode 100644 website/src/img/design_3/cover-light.webp create mode 100644 website/src/img/design_3/cover.jpg create mode 100644 website/src/img/design_3/cover.webp create mode 100644 website/src/img/design_3/green-tick.svg create mode 100644 website/src/img/design_3/logo-light.png create mode 100644 website/src/img/design_3/publications/heise.png create mode 100644 website/src/img/design_3/publications/kuketz-blog.png create mode 100644 website/src/img/design_3/publications/optout.png create mode 100644 website/src/img/design_3/publications/privacy-guides.png create mode 100644 website/src/img/design_3/publications/trail-of-bits.png create mode 100644 website/src/img/design_3/publications/whonix.png create mode 100644 website/src/img/design_3/red-x.svg create mode 100644 website/src/img/design_3/section-2-desktop-light.webp create mode 100644 website/src/img/design_3/section-2-desktop.webp create mode 100644 website/src/img/design_3/section-2-mobile-light.webp create mode 100644 website/src/img/design_3/section-2-mobile.webp create mode 100644 website/src/img/design_3/section-3-desktop-light.webp create mode 100644 website/src/img/design_3/section-3-desktop.webp create mode 100644 website/src/img/design_3/section-3-mobile-light.webp create mode 100644 website/src/img/design_3/section-3-mobile.webp create mode 100644 website/src/img/design_3/section-4-desktop-light.webp create mode 100644 website/src/img/design_3/section-4-desktop.webp create mode 100644 website/src/img/design_3/section-4-mobile-light.webp create mode 100644 website/src/img/design_3/section-4-mobile.webp create mode 100644 website/src/img/design_3/section-5-desktop-light.webp create mode 100644 website/src/img/design_3/section-5-desktop.webp create mode 100644 website/src/img/design_3/section-5-mobile-light.webp create mode 100644 website/src/img/design_3/section-5-mobile.webp create mode 100644 website/src/img/design_3/secure_messaging_dark.jpg create mode 100644 website/src/img/design_3/secure_messaging_light.jpg create mode 100644 website/src/img/design_3/simplex_nft_smpx.jpg create mode 100644 website/src/img/design_3/socials/apple.png create mode 100644 website/src/img/design_3/socials/linux.png create mode 100644 website/src/img/design_3/socials/windows.png create mode 100644 website/src/img/design_3/testflight-dark.png create mode 100644 website/src/img/design_3/yellow-tick.svg create mode 100644 website/src/img/flags/id.svg create mode 100644 website/src/img/groups/images/478ec86_izoJb95VXKWEhg.jpg create mode 100644 website/src/img/groups/images/5QzoN8PNFD2dkButszPu5g.png create mode 100644 website/src/img/groups/images/9aT7qRY_JbSJsW4qDaIHEg.jpg create mode 100644 website/src/img/groups/images/AXalaTZ4HsgGtEkaGFbclg.png create mode 100644 website/src/img/groups/images/B3xza7zUzYi3dHiRsg6Afg.jpg create mode 100644 website/src/img/groups/images/BD6FXuHO-eKOnYCAzkRfmA.jpg create mode 100644 website/src/img/groups/images/CX-1MPD3r3a7NYBvW7de6g.jpg create mode 100644 website/src/img/groups/images/ESomaJp7MlFlThqcoj3Ycg.png create mode 100644 website/src/img/groups/images/F4hPy5IGO6G9QUH6-nM_-A.jpg create mode 100644 website/src/img/groups/images/HylzOLARvIhUR1wiq0fnJA.png create mode 100644 website/src/img/groups/images/NvmOInofh4RSB2fHdN0zQA.jpg create mode 100644 website/src/img/groups/images/PPTLdveOyb9Wsg3bm6Y_IQ.png create mode 100644 website/src/img/groups/images/TwaN96DcV2OCMfUo6oJ4LQ.png create mode 100644 website/src/img/groups/images/Wsdcf731ufbEOYpHc2rqrg.jpg create mode 100644 website/src/img/groups/images/YLLz-47eBnAoIH1PKYJ75g.jpg create mode 100644 website/src/img/groups/images/YhyznG68PNewCNjoD_ceOg.png create mode 100644 website/src/img/groups/images/eb2RINRsdEBI0a06ghzqVg.jpg create mode 100644 website/src/img/groups/images/gqyRO21CwqK3huZ2zbkOqQ.jpg create mode 100644 website/src/img/groups/images/n3VLCEBWhqU9rVtlEAKUhQ.jpg create mode 100644 website/src/img/groups/images/t1RmI4AhKgelVoWeSBTqUA.jpg create mode 100644 website/src/img/groups/images/uZU6Cn1przsjVJ-DBm1-eA.jpg create mode 100644 website/src/img/groups/images/zIotMF8Zoe85k956B48N9g.jpg create mode 100644 website/src/img/messengers/briar.svg create mode 100644 website/src/img/messengers/cwtch.png create mode 100644 website/src/img/messengers/element.svg create mode 100644 website/src/img/messengers/session.svg create mode 100644 website/src/img/messengers/signal.png create mode 100644 website/src/js/design3.js create mode 100644 website/src/messaging.html create mode 100644 website/src/token.md diff --git a/.gitignore b/.gitignore index 4560272980..bf565453a5 100644 --- a/.gitignore +++ b/.gitignore @@ -54,6 +54,7 @@ website/translations.json website/src/img/images/ website/src/images/ website/src/js/lottie.min.js +website/src/js/ethers* website/src/privacy.md # Generated files website/package/generated* diff --git a/README.md b/README.md index 4aa0860af1..f2641cd06d 100644 --- a/README.md +++ b/README.md @@ -425,6 +425,8 @@ Please do NOT report security vulnerabilities via GitHub issues. This software is licensed under the GNU Affero General Public License version 3 (AGPLv3). See the [LICENSE](./LICENSE) file for details. The SimpleX and SimpleX Chat name, logo, and associated branding materials are not covered by this license and are subject to the terms outlined in the [TRADEMARK](./docs/TRADEMARK.md) file. +Graphic designs, artworks and layouts are not licensed for re-use. If you want to use them in your publications, please ask for permission. Texts can be used as direct quotes, referencing the source. + [iOS app](https://apps.apple.com/us/app/simplex-chat/id1605771084)   [![Android app](https://github.com/simplex-chat/.github/blob/master/profile/images/google_play.svg)](https://play.google.com/store/apps/details?id=chat.simplex.app) diff --git a/docs/GLOSSARY.md b/docs/GLOSSARY.md index 0cb855d729..fe0bd107ed 100644 --- a/docs/GLOSSARY.md +++ b/docs/GLOSSARY.md @@ -4,6 +4,10 @@ Choosing a private messenger requires the understanding of many technical terms, While this glossary aims to be factual and objective, it is not completely unbiased. We designed SimpleX to be the most private, secure and resilient communication network, and some definitions reflect this view. +## 2-factor key exchange + +The ability of communication service to ensure the security of the [key agreement protocol](#key-agreement-protocol) against [man-in-the-middle](#man-in-the-middle-attack). + ## Address portability Similarly to [phone number portability](https://en.wikipedia.org/wiki/Local_number_portability) (the ability of the customer to transfer the service to another provider without changing the number), the address portability means the ability of a communication service customer to change the service provider without changing the service address. Many [federated networks](#federated-network) support SRV records to provide address portability, but allowing service users to set up their own domains for the addresses is not as commonly supported by the available server and client software as for email. @@ -89,7 +93,7 @@ Also known as perfect forward secrecy, it is a feature of a [key agreement proto ## Key agreement protocol -Also known as key exchange, it is a process of agreeing cryptographic keys between the sender and the recipient(s) of the message. It is required for [end-to-end encryption](#end-to-end-encryption) to work. +Also known as key exchange, it is a process of agreeing cryptographic keys between the sender and the recipient(s) of the message. It is required for [end-to-end encryption](#end-to-end-encryption) to work. Unless it is possible to secure the key exchange via [some second factor](#2-factor-key-exchange), e.g. security code verification, it can be vulnerable to [man-in-the-middle attack](#man-in-the-middle-attack). [Wikipedia](https://en.wikipedia.org/wiki/Key-agreement_protocol) @@ -169,11 +173,11 @@ The advantage is that the participants do not depend on any servers. There are [ ## Post-compromise security -Also known as break-in recovery, it is the quality of the end-to-end encryption scheme allowing to recover security against a passive attacker who observes encrypted messages after compromising one (or both) of the parties. Also known as recovery from compromise or break-in recovery. [Double-ratchet algorithm](#double-ratchet-algorithm) has this quality. +The quality of the end-to-end encryption scheme allowing to recover security against a passive attacker who observes encrypted messages after compromising one (or both) of the parties. Also known as recovery from compromise or break-in recovery. [Double-ratchet algorithm](#double-ratchet-algorithm) has this quality. ## Post-quantum cryptography -Any of the proposed cryptographic systems or algorithms that are thought to be secure against an attack by a quantum computer. It appears that as of 2023 there is no system or algorithm that is proven to be secure against such attacks, or even to be secure against attacks by massively parallel conventional computers, so a general recommendation is to use post-quantum cryptographic systems in combination with the traditional cryptographic systems. +Any of the proposed cryptographic systems or algorithms that are thought to be secure against an attack by a quantum computer. It appears that as of 2025 there is no system or algorithm that is *proven* to be secure against such attacks, or even to be secure against attacks by massively parallel conventional computers, so a general recommendation is to use post-quantum hybrid cryptography - combining post-quantum and traditional algorigthms. [Wikipedia](https://en.wikipedia.org/wiki/Post-quantum_cryptography) diff --git a/website/.eleventy.js b/website/.eleventy.js index a0a35f3366..aa5b03a567 100644 --- a/website/.eleventy.js +++ b/website/.eleventy.js @@ -53,7 +53,7 @@ const globalConfig = { } const translationsDirectoryPath = './langs' -const supportedRoutes = ["blog", "contact", "invitation", "docs", "fdroid", ""] +const supportedRoutes = ["blog", "contact", "invitation", "messaging", "docs", "fdroid", ""] let supportedLangs = [] fs.readdir(translationsDirectoryPath, (err, files) => { if (err) { @@ -69,6 +69,13 @@ fs.readdir(translationsDirectoryPath, (err, files) => { const translations = require("./translations.json") module.exports = function (ty) { + // Add this after your markdownLib definition + ty.addShortcode("mdInclude", function (filepath) { + const fullPath = path.join(__dirname, 'src/_includes', filepath); + const content = fs.readFileSync(fullPath, 'utf8'); + return markdownLib.render(content); + }); + ty.addShortcode("cfg", (name) => globalConfig[name]) ty.addFilter("getlang", (path) => { @@ -106,9 +113,10 @@ module.exports = function (ty) { allContentNodes.forEach((node) => { const regex = new RegExp(`(?${term.term}` const beforeContent = node.innerHTML - node.innerHTML = node.innerHTML.replace(regex, replacement) + node.innerHTML = node.innerHTML.replace(regex, (match) => { + return `${match}` + }) if (beforeContent !== node.innerHTML && !changeNoted) { changeNoted = true } diff --git a/website/README.md b/website/README.md new file mode 100644 index 0000000000..5a5155a917 --- /dev/null +++ b/website/README.md @@ -0,0 +1,9 @@ +# SimpleX Chat website + +## License + +SimpleX Chat website code is licensed under the GNU Affero General Public License version 3 (AGPLv3). See the [LICENSE](../LICENSE) file for details. + +The SimpleX and SimpleX Chat name, logo, and associated branding materials are not covered by this license and are subject to the terms outlined in the [TRADEMARK](./docs/TRADEMARK.md) file. + +Graphic designs, artworks and layouts are not licensed for re-use. If you want to use them in your publications, please ask for permission. Texts can be used as direct quotes, referencing the source. diff --git a/website/langs/bg.json b/website/langs/bg.json index fe70e244d9..7661d916a3 100644 --- a/website/langs/bg.json +++ b/website/langs/bg.json @@ -21,7 +21,7 @@ "smp-protocol": "СМП Протокол", "chat-protocol": "Чат протокол", "donate": "Дарете", - "copyright-label": "© 2020-2025 SimpleX | Проект с отворен код", + "copyright-label": "© 2020-2025 SimpleX Chat | Проект с отворен код", "simplex-chat-protocol": "SimpleX Чат протокол", "terminal-cli": "Системна конзола", "terms-and-privacy-policy": "Политика за поверителност", diff --git a/website/langs/cs.json b/website/langs/cs.json index 5a7b03616b..fc609128bf 100644 --- a/website/langs/cs.json +++ b/website/langs/cs.json @@ -25,7 +25,7 @@ "smp-protocol": "SMP protokol", "chat-protocol": "Chat protokol", "donate": "Darovat", - "copyright-label": "© 2020-2025 SimpleX | Projekt s otevřeným zdrojovým kódem", + "copyright-label": "© 2020-2025 SimpleX Chat | Projekt s otevřeným zdrojovým kódem", "simplex-chat-protocol": "SimpleX Chat protokol", "terminal-cli": "Terminálové rozhraní příkazového řádku", "terms-and-privacy-policy": "Ochrana soukromí", diff --git a/website/langs/de.json b/website/langs/de.json index 05c205858b..4c5925a7b8 100644 --- a/website/langs/de.json +++ b/website/langs/de.json @@ -21,7 +21,7 @@ "smp-protocol": "SMP-Protokoll", "chat-bot-example": "Beispiel für einen Chatbot", "donate": "Spenden", - "copyright-label": "© 2020-2025 SimpleX | Open-Source-Projekt", + "copyright-label": "© 2020-2025 SimpleX Chat | Open-Source-Projekt", "chat-protocol": "Chat-Protokoll", "simplex-chat-protocol": "SimpleX-Chat-Protokoll", "terminal-cli": "Terminal-Kommandozeilen-Schnittstelle", diff --git a/website/langs/en.json b/website/langs/en.json index 52d47254a6..02f370f2cc 100644 --- a/website/langs/en.json +++ b/website/langs/en.json @@ -5,6 +5,7 @@ "reference": "Reference", "blog": "Blog", "features": "Features", + "navbar-token": "Token", "why-simplex": "Why SimpleX", "simplex-privacy": "SimpleX privacy", "simplex-network": "SimpleX network", @@ -22,7 +23,7 @@ "smp-protocol": "SMP protocol", "chat-protocol": "Chat protocol", "donate": "Donate", - "copyright-label": "© 2020-2025 SimpleX | Open-Source Project", + "copyright-label": "© 2020-2025 SimpleX Chat | Open-Source Project", "simplex-chat-protocol": "SimpleX Chat protocol", "terminal-cli": "Terminal CLI", "about-and-contact-us": "About & Contact us", diff --git a/website/langs/es.json b/website/langs/es.json index dff59342cc..9ab62eade5 100644 --- a/website/langs/es.json +++ b/website/langs/es.json @@ -10,7 +10,7 @@ "simplex-explained-tab-3-p-2": "El usuario puede mejorar aún más la privacidad de sus metadatos, haciendo uso de la red Tor para acceder a los servidores, evitando así la correlación por dirección IP.", "smp-protocol": "Protocolo SMP", "donate": "Donación", - "copyright-label": "© 2020-2025 SimpleX | Proyecto de Código Abierto", + "copyright-label": "© 2020-2025 SimpleX Chat | Proyecto de Código Abierto", "simplex-chat-protocol": "Protocolo SimpleX Chat", "terms-and-privacy-policy": "Política de Privacidad", "hero-header": "Privacidad redefinida", diff --git a/website/langs/fi.json b/website/langs/fi.json index 460aa7989b..d30c465222 100644 --- a/website/langs/fi.json +++ b/website/langs/fi.json @@ -112,7 +112,7 @@ "simplex-explained-tab-1-p-1": "Voit luoda yhteyshenkilöitä ja ryhmiä sekä käydä kaksisuuntaisia keskusteluja kuten missä tahansa muussa viestisovelluksessa.", "simplex-explained-tab-3-p-1": "Palvelimilla on erilliset anonyymit tunnistetiedot kullekin jonolle, eivätkä ne tiedä, mille käyttäjille ne kuuluvat.", "donate": "Lahjoita", - "copyright-label": "© 2020-2025 SimpleX | Avoin projekti", + "copyright-label": "© 2020-2025 SimpleX Chat | Avoin projekti", "hero-p-1": "Muissa sovelluksissa on käyttäjätunnuksia: Signal, Matrix, Session, Briar, Jami, Cwtch, jne.
SimpleX ei käytä niitä, ei edes satunnaisia numeroita.
Tämä parantaa yksityisyyttäsi radikaalisti.", "simplex-private-1-title": "2 kerrosta päästä päähän salattua viestintää", "simplex-private-2-title": "Lisäkerros palvelimen salaukselle", diff --git a/website/langs/fr.json b/website/langs/fr.json index b3613bc3da..8ff71af8dc 100644 --- a/website/langs/fr.json +++ b/website/langs/fr.json @@ -21,7 +21,7 @@ "smp-protocol": "Protocole SMP", "chat-protocol": "Protocole de chat", "donate": "Faire un don", - "copyright-label": "© 2020-2025 SimpleX | Projet Open-Source", + "copyright-label": "© 2020-2025 SimpleX Chat | Projet Open-Source", "simplex-chat-protocol": "Protocole SimpleX Chat", "terminal-cli": "Terminal CLI", "terms-and-privacy-policy": "Politique de confidentialité", diff --git a/website/langs/he.json b/website/langs/he.json index 9673bea871..03dc671919 100644 --- a/website/langs/he.json +++ b/website/langs/he.json @@ -53,7 +53,7 @@ "smp-protocol": "פרוטוקול SMP", "chat-protocol": "פרוטוקול צ'אט", "donate": "תרומה", - "copyright-label": "© 2020-2025 SimpleX | פרויקט קוד פתוח", + "copyright-label": "© 2020-2025 SimpleX Chat | פרויקט קוד פתוח", "hero-p-1": "לאפליקציות אחרות יש מזהי משתמש: Signal, Matrix, Session, Briar, Jami, Cwtch וכו'.
ל-SimpleX אין, אפילו לא מספרים אקראיים.
זה משפר באופן קיצוני את הפרטיות שלך.", "hero-overlay-2-title": "מדוע מזהי משתמש מזיקים לפרטיות?", "feature-6-title": "שיחות שמע ווידאו
מוצפנות מקצה לקצה", diff --git a/website/langs/hu.json b/website/langs/hu.json index cfe88e0ad0..85876c8b92 100644 --- a/website/langs/hu.json +++ b/website/langs/hu.json @@ -20,7 +20,7 @@ "smp-protocol": "SMP-protokoll", "chat-protocol": "Csevegési protokoll", "donate": "Adományozás", - "copyright-label": "© 2020-2025 SimpleX | Nyílt forráskódú projekt", + "copyright-label": "© 2020-2025 SimpleX Chat | Nyílt forráskódú projekt", "simplex-chat-protocol": "A SimpleX Chat protokoll", "terminal-cli": "Terminál CLI", "terms-and-privacy-policy": "Adatvédelmi irányelvek", diff --git a/website/langs/id.json b/website/langs/id.json index 51bd14f976..4c3320c204 100644 --- a/website/langs/id.json +++ b/website/langs/id.json @@ -30,7 +30,7 @@ "simplex-explained-tab-2-text": "2. Bagaimana cara kerjanya", "simplex-chat-protocol": "Protokol SimpleX Chat", "hero-overlay-2-title": "Mengapa ID pengguna buruk untuk privasi?", - "copyright-label": "© 2020-2025 SimpleX | Open-Source Project", + "copyright-label": "© 2020-2025 SimpleX Chat | Open-Source Project", "simplex-explained-tab-3-text": "3. Apa yang dilihat server", "smp-protocol": "Protokol SMP", "please-use-link-in-mobile-app": "Mohon gunakan tautan di aplikasi seluler", diff --git a/website/langs/it.json b/website/langs/it.json index c7578f84d1..b4db5e2399 100644 --- a/website/langs/it.json +++ b/website/langs/it.json @@ -10,7 +10,7 @@ "simplex-explained-tab-3-p-1": "I server hanno credenziali anonime separate per ogni coda e non sanno a quali utenti appartengano.", "chat-protocol": "Protocollo di chat", "donate": "Dona", - "copyright-label": "© 2020-2025 SimpleX | Progetto Open-Source", + "copyright-label": "© 2020-2025 SimpleX Chat | Progetto Open-Source", "simplex-chat-protocol": "Protocollo di SimpleX Chat", "terminal-cli": "Terminale CLI", "terms-and-privacy-policy": "Informativa sulla privacy", diff --git a/website/langs/ja.json b/website/langs/ja.json index 1f71aad624..31ef2669ef 100644 --- a/website/langs/ja.json +++ b/website/langs/ja.json @@ -52,7 +52,7 @@ "chat-protocol": "チャットプロトコル", "chat-bot-example": "チャットボットの例", "donate": "寄付", - "copyright-label": "© 2020-2025 SimpleX | Open-Source Project", + "copyright-label": "© 2020-2025 SimpleX Chat | Open-Source Project", "hero-p-1": "他のアプリにはユーザー ID があります: Signal、Matrix、Session、Briar、Jami、Cwtch など。
SimpleX にはありません。乱数さえもありません。
これにより、プライバシーが大幅に向上します。", "copy-the-command-below-text": "以下のコマンドをコピーしてチャットで使用します：", "simplex-private-card-9-point-1": "各メッセージ キューは、異なる送信アドレスと受信アドレスを使用してメッセージを一方向に渡します。", diff --git a/website/langs/nl.json b/website/langs/nl.json index 1cdffc6ae5..f8297e2841 100644 --- a/website/langs/nl.json +++ b/website/langs/nl.json @@ -17,7 +17,7 @@ "chat-bot-example": "Chatbot voorbeeld", "smp-protocol": "SMP protocol", "donate": "Doneer", - "copyright-label": "© 2020-2025 SimpleX | Open-sourceproject", + "copyright-label": "© 2020-2025 SimpleX Chat | Open-sourceproject", "simplex-chat-protocol": "SimpleX Chat protocol", "terminal-cli": "Terminal CLI", "terms-and-privacy-policy": "Privacybeleid", diff --git a/website/langs/pl.json b/website/langs/pl.json index e3c8fa6059..54a552685f 100644 --- a/website/langs/pl.json +++ b/website/langs/pl.json @@ -15,7 +15,7 @@ "smp-protocol": "Protokół SMP", "chat-protocol": "Protokół czatu", "donate": "Darowizna", - "copyright-label": "© 2020-2025 SimpleX | Projekt Open-Source", + "copyright-label": "© 2020-2025 SimpleX Chat | Projekt Open-Source", "simplex-chat-protocol": "Protokół SimpleX Chat", "terminal-cli": "Terminal CLI", "terms-and-privacy-policy": "Polityka prywatności", diff --git a/website/langs/pt_BR.json b/website/langs/pt_BR.json index b1a1f2decd..3b7cc23703 100644 --- a/website/langs/pt_BR.json +++ b/website/langs/pt_BR.json @@ -25,7 +25,7 @@ "smp-protocol": "Protocolo SMP", "chat-protocol": "Protocolo de bate-papo", "donate": "Doar", - "copyright-label": "© 2020-2025 SimpleX | Projeto de Código Livre", + "copyright-label": "© 2020-2025 SimpleX Chat | Projeto de Código Livre", "simplex-chat-protocol": "Protocolo Chat SimpleX", "terminal-cli": "CLI Terminal", "hero-header": "Privacidade redefinida", diff --git a/website/langs/ro.json b/website/langs/ro.json index d129c1a7d1..cfe489967f 100644 --- a/website/langs/ro.json +++ b/website/langs/ro.json @@ -20,7 +20,7 @@ "smp-protocol": "Protocolul SMP", "chat-protocol": "Protocol de chat", "donate": "Donează", - "copyright-label": "© 2020-2025 SimpleX | Proiect Open-Source", + "copyright-label": "© 2020-2025 SimpleX Chat | Proiect Open-Source", "simplex-chat-protocol": "Protocolul SimpleX Chat", "terminal-cli": "Terminal CLI", "terms-and-privacy-policy": "Politică de confidențialitate", diff --git a/website/langs/ru.json b/website/langs/ru.json index 40d58a8722..5c59c3e848 100644 --- a/website/langs/ru.json +++ b/website/langs/ru.json @@ -1,6 +1,6 @@ { "copy-the-command-below-text": "скопируйте приведенную ниже команду и используйте ее в чате:", - "copyright-label": "© 2020-2025 SimpleX | Проект с открытым исходным кодом", + "copyright-label": "© 2020-2025 SimpleX Chat | Проект с открытым исходным кодом", "chat-bot-example": "Пример Чат бота", "simplex-private-card-9-point-1": "Каждая очередь сообщений передает сообщения в одном направлении с разными адресами отправки и получения.", "simplex-private-card-1-point-2": "NaCL cryptobox в каждой очереди для предотвращения корреляции трафика между очередями сообщений, в случае компрометированного TLS.", diff --git a/website/langs/tr.json b/website/langs/tr.json index c6f6d24c93..ad8914fa18 100644 --- a/website/langs/tr.json +++ b/website/langs/tr.json @@ -21,7 +21,7 @@ "smp-protocol": "SMP Protokolü", "chat-protocol": "Sohbet Protokolü", "donate": "Bağış Yap", - "copyright-label": "© 2020-2025 SimpleX | Açık Kaynak Projesi", + "copyright-label": "© 2020-2025 SimpleX Chat | Açık Kaynak Projesi", "simplex-chat-protocol": "SimpleX Sohbet Protokolü", "terminal-cli": "Terminal Komut Satırı Arayüzü", "terms-and-privacy-policy": "Gizlilik Politikası", diff --git a/website/langs/uk.json b/website/langs/uk.json index 1c1780edb3..c2b02d7cf2 100644 --- a/website/langs/uk.json +++ b/website/langs/uk.json @@ -78,7 +78,7 @@ "smp-protocol": "Протокол SMP", "chat-protocol": "Протокол чату", "donate": "Пожертвувати", - "copyright-label": "© 2020-2025 SimpleX | Проект з відкритим кодом", + "copyright-label": "© 2020-2025 SimpleX Chat | Проект з відкритим кодом", "simplex-chat-protocol": "Протокол чату SimpleX", "terminal-cli": "Термінал CLI", "hero-header": "Приватність переосмислена", diff --git a/website/langs/zh_Hans.json b/website/langs/zh_Hans.json index 45943270b3..6ac8bdf833 100644 --- a/website/langs/zh_Hans.json +++ b/website/langs/zh_Hans.json @@ -57,7 +57,7 @@ "simplex-chat-protocol": "SimpleX 聊天协议", "smp-protocol": "SMP协议", "chat-protocol": "聊天协议", - "copyright-label": "© 2020-2025 SimpleX | 开源项目", + "copyright-label": "© 2020-2025 SimpleX Chat | 开源项目", "terminal-cli": "命令行程式", "simplex-explained-tab-1-p-1": "您可以创建联系人和群组，并进行双向对话，就像是任何其他即时通讯软件一样。", "hero-p-1": "其他应用——如Signal、Matrix、Session、Briar、Jami、Cwtch 等——都需要用户 ID。
而SimpleX 不需要用户ID，连随机生成的也不需要。
这从根本上改善了您的隐私。", diff --git a/website/langs/zh_Hant.json b/website/langs/zh_Hant.json index 1896fa3478..88dbdf107b 100644 --- a/website/langs/zh_Hant.json +++ b/website/langs/zh_Hant.json @@ -19,7 +19,7 @@ "simplex-explained-tab-2-p-2": "伺服器僅單向傳遞消息，無法全面瞭解使用者的對話記錄或連接。", "simplex-explained-tab-2-p-1": "對於每個連接，您可以使用兩個單獨的消息佇列通過不同的伺服器發送和接收消息。", "chat-protocol": "聊天協定", - "copyright-label": "© 2020-2025 SimpleX |開源專案", + "copyright-label": "© 2020-2025 SimpleX Chat |開源專案", "donate": "捐助", "simplex-explained-tab-1-p-1": "你可以建立聯絡人和群組，並進行雙向對話，就像在任何其他即時通訊軟件中一樣。", "simplex-explained-tab-1-p-2": "它如何在沒有使用者個人檔案識別符的情況下使用單向佇列？", diff --git a/website/package.json b/website/package.json index bbe3a17a68..4192563164 100644 --- a/website/package.json +++ b/website/package.json @@ -20,6 +20,7 @@ "@11ty/eleventy-plugin-rss": "^1.2.0", "@simplex-chat/webrtc": "^0.1.1", "common-tags": "^1.8.2", + "ethers": "^6.15.0", "fast-uri": "^2.1.0", "markdown-it-anchor": "^8.6.4", "markdown-it-replace-link": "^1.1.0", diff --git a/website/src/_data/docs_dropdown.json b/website/src/_data/docs_dropdown.json index f97c2aeff2..94bc69f8f3 100644 --- a/website/src/_data/docs_dropdown.json +++ b/website/src/_data/docs_dropdown.json @@ -13,8 +13,8 @@ "url": "/docs/directory.html" }, { - "title": "docs-dropdown-3", - "url": "/docs/sql.html" + "title": "docs-dropdown-2", + "url": "/docs/android.html" }, { "title": "docs-dropdown-4", diff --git a/website/src/_data/glossary.json b/website/src/_data/glossary.json index a16c2b9541..155b732c52 100644 --- a/website/src/_data/glossary.json +++ b/website/src/_data/glossary.json @@ -103,6 +103,10 @@ "term": "Post-quantum cryptography", "definition": "Post-quantum cryptography" }, + { + "term": "Post-quantum hybrid crypto", + "definition": "Post-quantum cryptography" + }, { "term": "Proxied peer-to-peer", "definition": "Proxied peer-to-peer" diff --git a/website/src/_data/languages.json b/website/src/_data/languages.json index 340cc59da9..0736597953 100644 --- a/website/src/_data/languages.json +++ b/website/src/_data/languages.json @@ -4,7 +4,8 @@ "label": "en", "name": "English", "flag": "/img/flags/en.svg", - "enabled": true + "enabled": true, + "home": true }, { "label": "ar", @@ -25,13 +26,15 @@ "label": "de", "name": "Deutsch", "flag": "/img/flags/de.svg", - "enabled": true + "enabled": true, + "home": true }, { "label": "es", "name": "Español", "flag": "/img/flags/es.svg", - "enabled": true + "enabled": true, + "home": true }, { "label": "fi", @@ -56,13 +59,22 @@ "label": "hu", "name": "Magyar", "flag": "/img/flags/hu.svg", - "enabled": true + "enabled": true, + "home": true + }, + { + "label": "id", + "name": "Indonesia", + "flag": "/img/flags/id.svg", + "enabled": true, + "home": true }, { "label": "it", "name": "Italiano", "flag": "/img/flags/it.svg", - "enabled": true + "enabled": true, + "home": true }, { "label": "ja", @@ -110,7 +122,8 @@ "label": "ru", "name": "Русский", "flag": "/img/flags/ru.svg", - "enabled": true + "enabled": true, + "home": true } ] } \ No newline at end of file diff --git a/website/src/_includes/footer.html b/website/src/_includes/footer.html index 7f86200fb0..01b22d8b97 100644 --- a/website/src/_includes/footer.html +++ b/website/src/_includes/footer.html @@ -1,5 +1,5 @@ {% set lang = page.url | getlang %} -
+
diff --git a/website/src/_includes/hero.html b/website/src/_includes/hero.html index 6ebfb883ef..4a25764428 100644 --- a/website/src/_includes/hero.html +++ b/website/src/_includes/hero.html @@ -76,7 +76,7 @@

PLAY

#}
-
+
diff --git a/website/src/_includes/layouts/article.html b/website/src/_includes/layouts/article.html index 783b6ece7c..628a1a4e05 100644 --- a/website/src/_includes/layouts/article.html +++ b/website/src/_includes/layouts/article.html @@ -27,17 +27,18 @@ + - + {% include "navbar.html" %} -
+
< Back to list
-
+
{{ content | safe }}
diff --git a/website/src/_includes/layouts/doc.html b/website/src/_includes/layouts/doc.html index 091f98bdc7..f26d3296e0 100644 --- a/website/src/_includes/layouts/doc.html +++ b/website/src/_includes/layouts/doc.html @@ -19,15 +19,14 @@ + - -
- {% include "navbar.html" %} -
+ + {% include "navbar.html" %} -
+
{% endif %} -
+
+ + {% if ('blog' not in page.url) and ('about' not in page.url) and ('privacy' not in page.url) and ('directory' not in page.url) and ('token' not in page.url) %} +
+ {% for language in languages.languages %} {% if language.label == page.url | getlang %} - {% if language.flag %} - - {% else %} -
-

{{ language.iconText }}

-
- {% endif %} +

{{ language.label }}

+ + + {% endif %} {% endfor %} -
    - {% if ("docs" in page.url) or ('downloads' in page.url) %} +
{% endif %} - - -
+
+ + + + +
- +}); + \ No newline at end of file diff --git a/website/src/_includes/sections/messaging.md b/website/src/_includes/sections/messaging.md new file mode 100644 index 0000000000..a02bccd8cd --- /dev/null +++ b/website/src/_includes/sections/messaging.md @@ -0,0 +1,21 @@ +# The World's Most Secure Messaging + + + + + +**Ultimate security**: SimpleX network uses the most secure end-to-end encryption, with continuous post-quantum key exchange to protect all messages and metadata. + +**Unique privacy**: SimpleX network has no user profile IDs, not even random numbers or keys. It provides better privacy of your contacts, protecting who you talk with from network servers. + +**No spam**: nobody can contact you unless you share 1-time link or long-term address. + +**Data ownership**: only your device stores your profiles, contacts and messages. You can securely move your data to another device. Servers store encrypted messages only while your device is offline. + +**Secure decentralization**: you control which servers to connect to. For security 4 different servers are used in each chat — they can't observe which IP addresses talk to each other. + +#### How to connect to others + +- Tap new chat button in the corner, then create 1-time link. +- Share the link with your contact via any other messenger or email - it is secure. +- Ask your contact to use the link in the app - click it after the app is installed or paste into the search field in the app. diff --git a/website/src/_includes/simplex_explained.html b/website/src/_includes/simplex_explained.html index 6ba20fb323..802db309f3 100644 --- a/website/src/_includes/simplex_explained.html +++ b/website/src/_includes/simplex_explained.html @@ -11,7 +11,7 @@ } .dark .tab-button{ color: #fff; - background: linear-gradient(#0C0B13, #0C0B13) padding-box, + background: linear-gradient(#000832, #000832) padding-box, linear-gradient(to bottom, #01F1FF, transparent) border-box; } .tab-button.active { @@ -127,7 +127,7 @@ window.addEventListener("load", function () { targetFrame = 0; animateToTarget(); } - }else if(index === 1){ + }else if(index === 1){ if (currentFrame !== 35) { targetFrame = 35; animateToTarget(); @@ -144,7 +144,7 @@ window.addEventListener("load", function () { }); } }); - }); + }); const targetNode = document.querySelector(".simplex-explained-swiper .swiper-pagination"); observer.observe(targetNode, { attributes: true }); diff --git a/website/src/blog.html b/website/src/blog.html index 4a0460511a..6ae4795baa 100644 --- a/website/src/blog.html +++ b/website/src/blog.html @@ -41,14 +41,14 @@ active_blog: true
-

Latest news

+

Latest news

{% for blog in collections.blogs %} {% if not(blog.data.draft) %}
+ class="w-full flex flex-col items-start md:flex-row rounded-[4px] overflow-hidden shadow-[0px_20px_30px_rgba(0,0,0,0.12)] dark:shadow-none bg-white dark:bg-[#0B2A59] mb-8">
+ class="min-h-[200px] h-[inherit] self-stretch md:w-[168px] bg-[#DBEEFF] dark:bg-[#071C46] flex items-center justify-center flex-[1] relative">
{% if blog.data.image %} {% if blog.data.imageBottom %} diff --git a/website/src/css/blog.css b/website/src/css/blog.css index f92998f301..5e86e7fb5d 100644 --- a/website/src/css/blog.css +++ b/website/src/css/blog.css @@ -1,3 +1,4 @@ +h1, #article h1 { font-size: 38px; font-weight: 700; @@ -19,9 +20,10 @@ } } +.dark h1, .dark #article h1 { - background: -webkit-linear-gradient(to bottom, #70F0F9 100%, #70F0F9 100%); - background: linear-gradient(to bottom, #70F0F9 100%, #70F0F9 100%); + background: -webkit-linear-gradient(to bottom, #70F0F9 0%, #70F0F9 33%, #50D8F1 100%); + background: linear-gradient(to bottom, #70F0F9 0%, #70F0F9 33%, #50D8F1 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; @@ -190,12 +192,12 @@ h3::before { outline: none; } -h1, -h2, -h3, -h4, -h5, -h6 { +#article h1, +#article h2, +#article h3, +#article h4, +#article h5, +#article h6 { clear: both; } @@ -220,7 +222,7 @@ h6 { } @media (max-width:768px) { - img { + #article img { width: 100%; } } diff --git a/website/src/css/design3-nav.css b/website/src/css/design3-nav.css new file mode 100644 index 0000000000..8a72c7fd17 --- /dev/null +++ b/website/src/css/design3-nav.css @@ -0,0 +1,644 @@ +:root { + --nav-color: #001796; +} + +:root.dark { + --nav-color: #ffffff; +} + +body.change-nav-color { + --nav-color: #001796; +} + +@media screen and (min-width: 960px) { + .logo { + background: rgba(255, 255, 255, 0.05); + backdrop-filter: blur(10px); + -webkit-backdrop-filter: blur(10px); + border-bottom-right-radius: 12px; + padding-right: 24px; + transition: all 0.3s ease; + } + + .dark .logo { + background: rgba(19, 29, 73, 0.005); + } + + nav#menu { + background: rgba(255, 255, 255, 0.05); + backdrop-filter: blur(10px); + -webkit-backdrop-filter: blur(10px); + padding: 0px 50px; + border-bottom-right-radius: 12px; + border-bottom-left-radius: 12px; + transition: all 0.3s ease; + } + + .dark nav#menu { + background: rgba(19, 29, 73, 0.005); + } + + .right-links { + background: rgba(255, 255, 255, 0.05); + backdrop-filter: blur(10px); + -webkit-backdrop-filter: blur(10px); + border-bottom-left-radius: 12px; + padding-left: 24px; + transition: all 0.3s ease; + } + + .dark .right-links { + background: rgba(19, 29, 73, 0.005); + } +} + +/* NavBar */ +header#navbar { + position: fixed; + top: 0; + left: 0; + width: 100%; + z-index: 50000; + background: none; + + display: flex; + align-items: center; + justify-content: center; + height: 54px; +} + +header#navbar>a.logo { + position: absolute; + left: 0px; + padding-left: 30px; + padding-top: 2px; + height: 100%; + /* display: flex; */ + align-items: center; +} + +header#navbar>a.logo img { + height: 40px; + width: auto; +} + +header#navbar nav#menu>ul>hr { + display: none; +} + +header#navbar nav#menu ul.sub-menu hr { + border-top-width: 1px; + height: 1px; + width: 100%; + color: #000; + opacity: 0.2; +} + +.dark header#navbar nav#menu ul.sub-menu hr { + color: #fff; +} + +header#navbar ul { + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + gap: 60px; + list-style: none; +} + +@media screen and (max-width: 1279px) { + header#navbar ul { + gap: 48px; + } +} + +@media screen and (max-width: 1024px) { + header#navbar ul { + gap: 40px; + } +} + +header#navbar ul a { + font-family: "Manrope", sans-serif; + color: white; + text-decoration: none; + font-size: 16px; + font-weight: 500; + padding: 8px 0; + + display: flex; + align-items: center; + justify-content: center; + gap: 6px; + white-space: nowrap; +} + +@media screen and (min-width: 960px) { + header#navbar ul .nav-link a, + header#navbar ul .nav-link-text { + font-size: 18px; + } + + header#navbar ul .nav-link .sub-menu a { + font-size: 16px; + } +} + +.box-btn { + height: 36px; + padding: 0 11px; + display: flex; + align-items: center; + justify-content: center; + font-size: 21px !important; + font-family: 'Manrope', sans-serif !important; + font-weight: 700 !important; + letter-spacing: -0.25px !important; + border-radius: 6px !important; +} + +.box-btn.btn-1 { + background-color: #639bd9; +} + +.dark .box-btn.btn-1 { + background-color: #44547D; +} + +.box-btn.token { + height: 34px; + font-size: 17px !important; + font-weight: 500 !important; + background: linear-gradient(90deg, #019bfe 0%, #2e3fa0 100%); + color: white; +} + +.box-btn.gold-gradient, +.dark .box-btn.token { + background: linear-gradient(90deg, + #ffb55d 0%, + #fff494 50%, + #fbffdd 100%); + color: black; +} + +.change-nav-color .box-btn.token { + background: linear-gradient(90deg, #019bfe 0%, #2e3fa0 100%); + color: white; +} + +header#navbar ul a span { + display: flex; + height: 100%; + align-items: center; + justify-content: center; +} + +header#navbar ul a>span:first-child { + transform: translateY(-1.5px); +} + +header#navbar ul a span svg { + fill: #001796; + width: 10px; + height: auto; + transition: all 0.5s ease; +} + +.dark header#navbar ul a span svg { + fill: #fff; +} + +@media screen and (min-width: 960px) { + header#navbar nav#menu>ul>li>a { + color: var(--nav-color); + } + + header#navbar nav#menu>ul>li>a svg { + fill: var(--nav-color); + } + + header#navbar nav#menu li.nav-link:hover span svg { + transform: rotate(180deg); + } +} + +header#navbar ul.sub-menu { + display: flex; + flex-direction: column; + align-items: flex-start; + justify-content: flex-start; + gap: 0.5rem; + max-height: calc(100vh - 70px); + position: absolute; + background: #fff; + border: solid 1px #f2f2f7; + top: calc(100% + 8px); + padding: 16px 0; + min-width: 180px; + border-radius: 8px; + transition: all .3s ease !important; + overflow: auto; + visibility: hidden; + opacity: 0; +} + +.dark header#navbar ul.sub-menu { + background: #181e43; + border: none; +} + +header#navbar ul.sub-menu li a { + padding: 3px 20px; + font-weight: 400; + white-space: nowrap; + display: flex; + align-items: center; + gap: 4px; + color: #001796; +} + +.dark header#navbar ul.sub-menu li a { + color: #ffffff; +} + +header#navbar ul.sub-menu li a img { + height: 1rem; +} + +header#navbar .nav-link.flag-container ul.sub-menu li a { + display: flex; + align-items: center; + gap: 16px; + white-space: nowrap; +} + +header#navbar nav#menu, +header#navbar nav#menu>ul { + height: 100%; +} + +header#navbar .nav-link { + position: relative; +} + +header#navbar .nav-link:hover .sub-menu, +header#navbar .nav-link:focus-within .sub-menu { + visibility: visible; + opacity: 1; + margin-top: 0; +} + +.flag-container>a { + background-color: transparent; + display: flex; + align-items: center; + justify-content: center; + gap: 4px; + color: #001796; + text-decoration: none; +} + +.dark .flag-container>a { + color: white; +} + +.flag-container>a svg { + fill: #001796; + width: 10px; + height: auto; +} + +.dark .flag-container>a svg { + fill: white; +} + +@media screen and (min-width: 960px) { + .flag-container>a { + color: var(--nav-color) !important; + } + + .flag-container>a svg { + fill: var(--nav-color) !important; + } +} + +.flag-container>a p { + font-size: 14px; + font-family: "Manrope", sans-serif; + font-weight: 500; + user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + line-height: 1rem; + letter-spacing: 0.05em; + text-transform: uppercase; +} + +.flag-container .sub-menu a div { + display: flex; + align-items: center; + justify-content: center; +} + +.flag-container .sub-menu { + top: 100%; + right: 0; +} + +header#navbar button.theme-switch-btn { + display: flex; + align-items: center; + justify-content: center; + background-color: transparent; + border: none; +} + +header#navbar button.theme-switch-btn svg { + width: 20px; + height: auto; +} + +header#navbar button.theme-switch-btn svg path { + fill: #001796; + transition: all 0.3s ease; +} + +.dark header#navbar button.theme-switch-btn svg path { + fill: white; +} + +@media screen and (min-width: 960px) { + header#navbar button.theme-switch-btn svg path { + fill: var(--nav-color) !important; + transition: all 0.3s ease; + } +} + +.right-links { + position: absolute; + top: 0; + right: 0px; + padding-right: 20px; + height: 54px; + display: flex; + align-items: center; + gap: 1.5rem; +} + +button#cross-btn { + background-color: transparent; + border: none; + display: none; + align-items: center; + justify-content: center; + cursor: pointer; +} + +#cross { + fill: #001796; + width: 13px; + height: auto; +} + +.dark #cross { + fill: #ffffff; +} + +#mobile-header { + display: none; + padding: 0 1rem; +} + +#mobile-header a.logo img { + height: 32px; +} + +#mobile-header button#hamburger { + height: 36px; + background-color: transparent; + border: none; + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; +} + +#mobile-header button#hamburger svg { + fill: var(--nav-color) !important; + width: 20px; + height: auto; +} + +@media (max-width: 959px) { + #mobile-header { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 54px; + background: transparent; + + display: flex; + align-items: center; + justify-content: space-between; + z-index: 50000; + } + + header#navbar { + height: 100%; + width: 100%; + background: #fff; + visibility: hidden; + opacity: 0; + transition: all .3s ease; + transform: translateX(-100%); + } + + .dark header#navbar { + background: #0a0f2b; + } + + header#navbar.open { + visibility: visible; + opacity: 1; + transform: translateX(0); + z-index: 60000; + } + + header#navbar>a.logo { + height: fit-content; + top: 16px; + } + + header#navbar>a.logo img { + height: 28px; + } + + .right-links { + top: 0px; + } + + header#navbar ul a span svg { + width: 18px; + } + + header#navbar nav#menu>ul { + flex-direction: column; + justify-content: flex-start; + gap: 0; + } + + header#navbar nav#menu { + position: fixed !important; + top: 54px; + left: 0; + width: 100%; + height: calc(100% - 54px); + overflow: auto; + padding: 0.5rem 0; + } + + header#navbar nav#menu .nav-link { + width: 100%; + } + + header#navbar nav#menu .nav-link a { + font-family: "Manrope", "GT-Walsheim", sans-serif; + font-weight: 300; + font-size: 18px; + width: 100%; + justify-content: space-between; + justify-content: flex-start; + gap: 10px; + padding: 0px; + padding: 6px 2rem; + color: #001796; + } + + .dark header#navbar nav#menu .nav-link a { + color: #ffffff; + } + + header#navbar nav#menu .nav-link>a { + font-size: 28px; + padding: 1rem 2rem; + } + + header#navbar nav#menu ul.sub-menu hr { + width: 100%; + } + + header#navbar nav#menu ul.sub-menu hr { + margin: 1rem 2rem; + width: calc(100% - 4rem); + } + + header#navbar nav#menu ul.sub-menu { + position: static; + } + + header#navbar nav#menu .sub-menu { + max-height: 0; + opacity: 0; + visibility: hidden; + transform: translateY(-10px); + transition: all .7s ease !important; + overflow: hidden; + border-radius: 0; + background-color: transparent; + margin-top: 0; + padding: 0rem 1.5rem; + gap: 0; + } + + header#navbar nav#menu .sub-menu li { + width: 100%; + } + + header#navbar nav#menu .sub-menu li a { + font-family: "Manrope", "GT-Walsheim", sans-serif; + font-weight: 300; + width: 100%; + } + + .dark header#navbar nav#menu .sub-menu li a { + font-weight: 200; + } + + header#navbar nav#menu .active .sub-menu { + max-height: 1000px; + transform: translateY(0px); + padding: 0.5rem 1.5rem; + opacity: 1; + visibility: visible; + margin-top: 0; + } + + button#cross-btn { + display: flex; + cursor: pointer; + } +} + +/* underline animation on hover */ +@media (min-width:950px) { + .nav-link-text { + display: inline-block; + position: relative; + } + + .nav-link-text::before, + .active .nav-link-text::before { + content: ""; + position: absolute; + width: 0; + height: 1px; + bottom: 0; + right: 0; + background-color: var(--nav-color); + transition: width 0.25s ease-out; + } + + .nav-link:hover .nav-link-text::before, + .active .nav-link-text::before { + width: 100%; + left: 0; + right: auto; + } +} + +#mobile-header.cover { + background: #d7fbfe09; +} + +.dark #mobile-header.cover { + background: #283b630a; +} + +#mobile-header.main { + background: #ffefd60e; +} + +.dark #mobile-header.main { + background: #fff6e00a; +} + +#mobile-header.nav-open { + background: #ffffff0c; +} + +.dark #mobile-header.nav-open { + background: #0a0f2b0f; +} + +#mobile-header.footer { + background: #d3e9ff11; +} + +.dark #mobile-header.footer { + background: #080d250e; + --nav-color: #ffffff; +} \ No newline at end of file diff --git a/website/src/css/design3.css b/website/src/css/design3.css new file mode 100644 index 0000000000..6b63c769a9 --- /dev/null +++ b/website/src/css/design3.css @@ -0,0 +1,1461 @@ +/* ======================= + GT-Walsheim (WOFF2) + Family: "GT-Walsheim" + Weights mapped: Thin(100), Ultra-Light(200), Light(300), Regular(400), + Medium(500), Bold(700), Ultra-Bold(800), Black(900) +======================= */ + +/* Light */ +@font-face { + font-family: "GT-Walsheim"; + src: url("/fonts/GT-Walsheim/GT-Walsheim-LC-Light.woff2") format("woff2"); + font-weight: 300; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "GT-Walsheim"; + src: url("/fonts/GT-Walsheim/GT-Walsheim-LC-Light-Oblique.woff2") format("woff2"); + font-weight: 300; + font-style: oblique; + font-display: swap; +} + +/* Regular */ +@font-face { + font-family: "GT-Walsheim"; + src: url("/fonts/GT-Walsheim/GT-Walsheim-LC-Regular.woff2") format("woff2"); + font-weight: 400; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "GT-Walsheim"; + src: url("/fonts/GT-Walsheim/GT-Walsheim-LC-Regular-Oblique.woff2") format("woff2"); + font-weight: 400; + font-style: oblique; + font-display: swap; +} + +/* Medium */ +@font-face { + font-family: "GT-Walsheim"; + src: url("/fonts/GT-Walsheim/GT-Walsheim-LC-Medium.woff2") format("woff2"); + font-weight: 500; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "GT-Walsheim"; + src: url("/fonts/GT-Walsheim/GT-Walsheim-LC-Medium-Oblique.woff2") format("woff2"); + font-weight: 500; + font-style: oblique; + font-display: swap; +} + +/* Bold */ +@font-face { + font-family: "GT-Walsheim"; + src: url("/fonts/GT-Walsheim/GT-Walsheim-LC-Bold.woff2") format("woff2"); + font-weight: 700; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "GT-Walsheim"; + src: url("/fonts/GT-Walsheim/GT-Walsheim-LC-Bold-Oblique.woff2") format("woff2"); + font-weight: 700; + font-style: oblique; + font-display: swap; +} + +/* ======================= + Manrope (TTF) + Family: "Manrope" + Weights mapped per name +======================= */ + +@font-face { + font-family: "Manrope"; + src: url("/fonts/Manrope/Manrope-ExtraLight.ttf") format("truetype"); + font-weight: 200; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "Manrope"; + src: url("/fonts/Manrope/Manrope-Light.ttf") format("truetype"); + font-weight: 300; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "Manrope"; + src: url("/fonts/Manrope/Manrope-Regular.ttf") format("truetype"); + font-weight: 400; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "Manrope"; + src: url("/fonts/Manrope/Manrope-Medium.ttf") format("truetype"); + font-weight: 500; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "Manrope"; + src: url("/fonts/Manrope/Manrope-SemiBold.ttf") format("truetype"); + font-weight: 600; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "Manrope"; + src: url("/fonts/Manrope/Manrope-Bold.ttf") format("truetype"); + font-weight: 700; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "Manrope"; + src: url("/fonts/Manrope/Manrope-ExtraBold.ttf") format("truetype"); + font-weight: 800; + font-style: normal; + font-display: swap; +} + +:root { + --bg-grad: linear-gradient(10deg, + #e8f3ff 0%, + #c0e2ff 40%, + #e9ffff 80%, + #ffefd6 90%); + + /* Compute cover drawn size and inner safe frame (60% of full image on each axis) */ + /* --cover-bg-w: calc(min((3200 / 1920) * 100vw, (3200 / 1080) * 100vh)); + --cover-bg-h: calc(min((1800 / 1920) * 100vw, (1800 / 1080) * 100vh)); + --cover-safe-w: calc(var(--cover-bg-w) * 0.6); + --cover-safe-h: calc(var(--cover-bg-h) * 0.6); + --cover-vw: calc(var(--cover-safe-w) / 100); + --cover-vh: calc(var(--cover-safe-h) / 100); */ + /* 1920/3200 */ + /* 1080/1800 */ + + --cover-bg-w: calc(min((3200 / 1920) * 100vw, (3200 / 1080) * 100vh)); + --cover-bg-h: calc(min((1800 / 1920) * 100vw, (1800 / 1080) * 100vh)); + + /* Drawn background size derived from viewport — no cropping (contain-like) */ + --sec-w: calc(min((1920 / 1920) * 100vw, (1920 / 1080) * 100vh)); + --sec-h: calc(min((1080 / 1920) * 100vw, (1080 / 1080) * 100vh)); + --sec-vwu: calc(var(--sec-w) / 100); + --sec-vhu: calc(var(--sec-h) / 100); +} + +:root.dark { + --bg-grad: linear-gradient(9.2deg, + #000000 0%, + #131d49 52%, + #3f5598 65%, + #c3faff 85%, + #fff6e0 90%); +} + +@media screen and (max-width: 959px) { + :root { + --bg-grad: linear-gradient(30deg, + #e8f3ff 0%, + #c0e2ff 40%, + #e9ffff 80%, + #ffefd6 90%); + + /* Cover background for mobile */ + --cover-bg-w: calc(min((3200 / 620) * 100vw, (3200 / 1080) * 100vh)); + --cover-bg-h: calc(min((1800 / 620) * 100vw, (1800 / 1080) * 100vh)); + + /* Drawn background size for mobile */ + --sec-w: calc(min((620 / 620) * 100vw, (620 / 1080) * 100vh)); + --sec-h: calc(min((1080 / 620) * 100vw, (1080 / 1080) * 100vh)); + --sec-vwu: calc(var(--sec-w) / 100); + --sec-vhu: calc(var(--sec-h) / 100); + } + + :root.dark { + --bg-grad: linear-gradient(30deg, + #000000 0%, + #131d49 52%, + #3f5598 65%, + #c3faff 85%, + #fff6e0 90%); + } +} + +* { + box-sizing: border-box; + margin: 0; + padding: 0; + border-color: #000; +} + +.dark * { + border-color: #fff; +} + +html { + scroll-behavior: smooth; + font-family: GT-Walsheim, Gilroy, Helvetica, sans-serif; +} + +html, +body { + background: #ffffff; +} + +.dark html, +.dark body { + background: #0a0f2b; +} + +@media screen and (min-width: 960px) { + html { + overscroll-behavior: none; + } +} + +/* .hidden { + display: none !important; + visibility: hidden !important; + opacity: 0 !important; +} + +:is(.dark .dark\:hidden) { + display: none !important; + visibility: hidden !important; + opacity: 0 !important; +} */ + +.lock-scroll { + overflow: hidden !important; +} + +img { + user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; +} + +a, +p { + word-wrap: break-word; +} + +.gradient-text { + background: linear-gradient(100deg, + #ffb55d 0%, + #fff494 50%, + #fbffdd 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; + color: transparent; +} + +.page .text-container a.gradient-text { + background: linear-gradient(90deg, + #001aa7 0%, + #0095e7 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; + color: transparent; +} + +.dark .gradient-text, +.dark .page .text-container a.gradient-text { + background: linear-gradient(90deg, + #019bfe 0%, + #64fdff 58%, + #c8feff 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; + color: transparent; +} + +/* Let the PAGE (body) scroll so Safari collapses the address bar. + Keep .screen as a regular wrapper (no own scrolling). */ +.screen { + height: auto; + overflow: visible; +} + +/* Make the viewport the scroll snap container (works in iOS Safari) */ +html { + scroll-snap-type: y mandatory; + scroll-behavior: smooth; + -webkit-overflow-scrolling: touch; +} + +html.lock-scroll { + scroll-snap-type: none !important; +} + +.lock-scroll body { + overflow: hidden !important; + height: 100svh; +} + +section.page { + min-height: 100svh; + /* fallback */ + height: 100svh; + scroll-snap-align: start; + scroll-snap-stop: always; + /* requires a full swipe/scroll to leave */ + position: relative; + + display: flex; + justify-content: center; + align-items: center; + z-index: 2; +} + +.chrome-ios section.page, +.safari-ios section.page { + min-height: 110lvh; + /* fallback */ + height: 110lvh; + padding-bottom: calc(110lvh - 100svh); +} + +.chrome-android section.page { + min-height: 100lvh; + /* fallback */ + height: 100lvh; + padding-bottom: calc(100lvh - 100svh); + z-index: 10; +} + +section.page .area { + width: var(--sec-w); + height: var(--sec-h); + z-index: 11; + /* border: 2px solid red; */ +} + +#directory .area { + position: relative; +} + +/* --- COVER --- */ +section.cover { + background-image: url("/img/design_3/cover-light.webp"); + background-size: var(--cover-bg-w) var(--cover-bg-h); + background-position: center; + background-repeat: no-repeat; + z-index: 12; +} + +.dark section.cover { + background-image: url("/img/design_3/cover.webp"); +} + +.chrome-ios section.cover, +.safari-ios section.cover { + background-position: center calc(50% - calc(110lvh - 100svh) / 2); +} + +.chrome-android section.cover { + background-position: center calc(50% - calc(100lvh - 100svh) / 2); +} + +section.cover div.content { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + text-align: center; + gap: calc(var(--sec-vhu) * 3.5); + width: var(--sec-w); + height: var(--sec-h); +} + +section.cover div.content h1 { + font-family: "GT-Walsheim", "Manrope", sans-serif; + font-weight: 600; + font-size: calc(var(--sec-vwu) * 11.7); + line-height: 0.9; + letter-spacing: -0.025em; + color: #ffffff; + text-align: center; +} + +section.cover div.content h1 .small { + font-size: calc(var(--sec-vwu) * 8); +} + +section.cover div.content h1 .medium { + font-size: calc(var(--sec-vwu) * 10); +} + +section.cover div.content h2 { + font-family: "GT-Walsheim", "Manrope", sans-serif; + font-weight: 300; + font-size: calc(var(--sec-vwu) * 2.7); + letter-spacing: -0.025em; + line-height: 1.2; +} + +section.cover div.content p { + font-family: "Manrope", "GT-Walsheim", sans-serif; + font-weight: 200; + font-size: calc(var(--sec-vwu) * 1.6); + align-items: center; + color: #ffffff; + max-width: calc(var(--sec-vwu) * 25); +} + +.publications-btns { + position: absolute; + bottom: 24px; + left: 30px; + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: center; + gap: 12px; +} + +.publications-btns img { + width: 32px; +} + +.publications-btns img.kuketz { + width: 38px; +} + +.publications-btns img.whonix { + width: 30px; +} + +.security-btns { + position: absolute; + bottom: 24px; + left: 0; + transform: translateX(calc((100vw / 2) - 50%)); + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: center; + gap: 12px; +} + +.security-btns img { + height: 36px; +} + +.security-audits { + font-size: 14px !important; + font-family: 'Manrope', 'GT-Walsheim', sans-serif !important; + font-weight: 300 !important; + text-align: left; + color: white; + line-height: 1.2; +} + +@media screen and (max-width: 1279px) { + .publications-btns { + display: none; + visibility: hidden; + } + + .security-btns { + transform: translateX(0); + left: 16px; + } +} + +.socials { + position: absolute; + bottom: 22px; + right: 30px; + display: flex; + align-items: center; + justify-content: center; + gap: 10px; + flex-wrap: wrap; +} + +.socials a img { + width: auto; + height: 40px; + border: #4f4f4f 1px solid; + border-radius: 6px; +} + +.socials a img.no-border { + border: none; +} + +.desktop-app-btn .btn-content { + height: 40px; + background-color: #000; + border: #4f4f4f 1px solid; + border-radius: 6px; + padding: 6px 10px; + + display: flex; + align-items: center; + justify-content: center; + gap: 10px; +} + +.desktop-app-btn .btn-content p { + margin: 0; + font-size: 11px !important; + font-family: 'Manrope', 'GT-Walsheim', sans-serif !important; + font-weight: 300 !important; + line-height: 1.2 !important; + text-align: left; + color: #fff; +} + +.desktop-app-btn .btn-content img { + height: 24px !important; + width: auto; +} + +.desktop-app-btn .btn-content>div { + display: flex; + align-items: center; + justify-content: center; + gap: 6px; +} + +@media screen and (max-width: 959px) { + + .publications-btns, + .security-btns, + .socials { + position: static; + } +} + +/* --- MAIN SECTIONS --- */ +main { + position: relative; + isolation: isolate; +} + +main .section-bg { + position: sticky; + top: 0; + inset: 0; + height: 100lvh; + margin-bottom: -100lvh; + /* cancel own layout height */ + width: 100%; + background-image: var(--bg-grad); + background-position: center; + background-size: 102% 102%; + background-repeat: no-repeat; + z-index: -1; + pointer-events: none; +} + +.chrome-ios main .section-bg, +.safari-ios main .section-bg { + height: 110lvh; + margin-bottom: -110lvh; +} + +.page-2 { + background-image: url("/img/design_3/section-2-desktop-light.webp"); + background-size: var(--cover-bg-w) var(--cover-bg-h); + background-position: center; + background-repeat: no-repeat; +} + +.dark .page-2 { + background-image: url("/img/design_3/section-2-desktop.webp"); +} + +.page-3 { + background-image: url("/img/design_3/section-3-desktop-light.webp"); + background-size: var(--cover-bg-w) var(--cover-bg-h); + background-position: center; + background-repeat: no-repeat; +} + +.dark .page-3 { + background-image: url("/img/design_3/section-3-desktop.webp"); +} + +.page-4 { + background-image: url("/img/design_3/section-4-desktop-light.webp"); + background-size: var(--cover-bg-w) var(--cover-bg-h); + background-position: center; + background-repeat: no-repeat; +} + +.dark .page-4 { + background-image: url("/img/design_3/section-4-desktop.webp"); +} + +.page-5 { + background-image: url("/img/design_3/section-5-desktop-light.webp"); + background-size: var(--cover-bg-w) var(--cover-bg-h); + background-position: center; + background-repeat: no-repeat; +} + +.dark .page-5 { + background-image: url("/img/design_3/section-5-desktop.webp"); +} + +@media screen and (max-width: 959px) { + .page-2 { + background-image: url("/img/design_3/section-2-mobile-light.webp"); + background-size: auto calc(var(--cover-bg-h) * 0.84); + background-position: 51.5% calc(50% - calc(var(--sec-vhu) * 2)) !important; + } + + .chrome-ios .page-2, + .safari-ios .page-2 { + background-position: 51.5% calc(50% - (calc(var(--sec-vhu) * 2) + (calc(110lvh - 100svh) / 2))) !important; + } + + .chrome-android .page-2 { + background-position: 51.5% calc(50% - (calc(var(--sec-vhu) * 2) + (calc(100lvh - 100svh) / 2))) !important; + } + + .dark .page-2 { + background-image: url("/img/design_3/section-2-mobile.webp"); + } + + .page-3 { + background-image: url("/img/design_3/section-3-mobile-light.webp"); + background-size: auto calc(var(--cover-bg-h) * 0.8); + background-position: 50% calc(50% - calc(var(--sec-vhu) * 4.5)) !important; + } + + .chrome-ios .page-3, + .safari-ios .page-3 { + background-position: 50% calc(50% - (calc(var(--sec-vhu) * 4.5) + (calc(110lvh - 100svh) / 2))) !important; + } + + .chrome-android .page-3 { + background-position: 50% calc(50% - (calc(var(--sec-vhu) * 4.5) + (calc(100lvh - 100svh) / 2))) !important; + } + + .dark .page-3 { + background-image: url("/img/design_3/section-3-mobile.webp"); + } + + .page-4 { + background-image: url("/img/design_3/section-4-mobile-light.webp"); + background-size: auto calc(var(--cover-bg-h) * 0.84); + background-position: 50% calc(50% - calc(var(--sec-vhu) * 2)) !important; + } + + .chrome-ios .page-4, + .safari-ios .page-4 { + background-position: 50% calc(50% - (calc(var(--sec-vhu) * 2) + (calc(110lvh - 100svh) / 2))) !important; + } + + .chrome-android .page-4 { + background-position: 50% calc(50% - (calc(var(--sec-vhu) * 2) + (calc(100lvh - 100svh) / 2))) !important; + } + + .dark .page-4 { + background-image: url("/img/design_3/section-4-mobile.webp"); + } + + .page-5 { + background-image: url("/img/design_3/section-5-mobile-light.webp"); + background-size: auto calc(var(--cover-bg-h) * 0.84); + background-position: 50% calc(50% - calc(var(--sec-vhu) * 3)) !important; + } + + .chrome-ios .page-5, + .safari-ios .page-5 { + background-position: 50% calc(50% - (calc(var(--sec-vhu) * 3) + (calc(110lvh - 100svh) / 2))) !important; + } + + .chrome-android .page-5 { + background-position: 50% calc(50% - (calc(var(--sec-vhu) * 3) + (calc(100lvh - 100svh) / 2))) !important; + } + + .dark .page-5 { + background-image: url("/img/design_3/section-5-mobile.webp"); + } +} + +.page .text-container { + position: relative; + color: white; + height: 100%; + display: flex; + flex-direction: column; + justify-content: center; + align-items: flex-start; + gap: calc(var(--sec-vhu) * 3.25); + margin-right: calc(var(--sec-vwu)*7.5); + margin-left: calc(var(--sec-vwu)*7.5); + width: fit-content; + z-index: 1; +} + +.page .text-container h2 { + font-family: "GT-Walsheim", "Manrope", sans-serif; + font-weight: 300; + font-size: calc(var(--sec-vwu)*4.94); + letter-spacing: -0.025em; + line-height: 1.05; + max-width: calc(var(--sec-vwu)*26); + color: #023789; +} + +.dark .page .text-container h2 { + color: #ffffff; +} + +.page .text-container p { + font-family: "Manrope", "GT-Walsheim", sans-serif; + font-weight: 200; + font-size: calc(var(--sec-vwu)*1.62); + max-width: calc(var(--sec-vwu)*23); + color: #000000; +} + +.dark .page .text-container p { + color: #ffffff; +} + +.page .text-container p span { + font-weight: 500; +} + +.page .text-container a { + font-family: "Manrope", "GT-Walsheim", sans-serif; + font-weight: 200; + font-size: calc(var(--sec-vwu)*1.62); + text-decoration: underline; + text-decoration-line: underline; + text-decoration-thickness: 0.5px; + text-underline-offset: 4px; + max-width: calc(var(--sec-vwu)*14); +} + +.page-2 .text-container h2 { + max-width: calc(var(--sec-vwu)*26) !important; +} + +.page-2 .text-container p { + max-width: calc(var(--sec-vwu)*23) !important; +} + +.page-3 .text-container h2 { + max-width: calc(var(--sec-vwu)*29) !important; +} + +.page-3 .text-container p { + max-width: calc(var(--sec-vwu)*31) !important; +} + +.page-3 .text-container, +.page-4 .text-container { + margin-left: auto; +} + +.page-4 .text-container h2 { + max-width: calc(var(--sec-vwu)*26) !important; +} + +.page-4 .text-container p { + max-width: calc(var(--sec-vwu)*30) !important; +} + +.page-4 .text-container a { + max-width: calc(var(--sec-vwu)*30) !important; +} + +.page-5 .text-container h2 { + max-width: calc(var(--sec-vwu)*23) !important; +} + +.page-5 .text-container p { + max-width: calc(var(--sec-vwu)*30) !important; +} + +.page-6 .text-container p { + max-width: calc(var(--sec-vwu)*21) !important; +} + +.page-6 .text-container a { + max-width: calc(var(--sec-vwu)*21) !important; +} + +.roadmap p:first-of-type, +.roadmap>p:first-of-type { + font-weight: 500; + color: #009df7; +} + +.dark .roadmap p:first-of-type, +.dark .roadmap>p:first-of-type { + color: #64fdff; +} + +/* .dark .roadmap>p:first-child {} */ + +.roadmap>p:nth-child(2) { + font-weight: 500; +} + +.roadmap>p:nth-child(3) { + font-weight: 200; +} + +.roadmap p { + max-width: 30vw; +} + +.roadmap p.title span { + display: none; +} + +@media (max-width: 959px) { + section.cover div.content { + gap: calc(var(--sec-vhu) * 2.5); + transform: translateY(calc(var(--sec-vhu) * 5)); + } + + .publications-btns, + .security-btns, + .socials { + margin-top: calc(var(--sec-vhu) * 2); + } + + section.cover div.content h1 { + line-height: 0.85; + font-weight: 700; + font-size: calc(var(--sec-vwu) * 30); + } + + section.cover div.content h1 .small { + font-size: calc(var(--sec-vwu) * 16); + } + + section.cover div.content h1 .medium { + font-size: calc(var(--sec-vwu) * 24); + } + + section.cover div.content h2 { + font-weight: 400; + font-size: calc(var(--sec-vwu) * 7); + } + + section.cover div.content p { + font-weight: 400; + font-size: calc(var(--sec-vwu) * 4.3); + max-width: calc(var(--sec-vwu) * 65); + } + + + /* --- MAIN SECTIONS --- */ + .page .text-container { + justify-content: flex-end; + align-items: flex-start; + gap: calc(var(--sec-vhu) * 2); + margin-right: calc(var(--sec-vwu) * 7) !important; + margin-left: calc(var(--sec-vwu) * 7) !important; + padding-bottom: calc(var(--sec-vwu) * 8); + max-width: fit-content !important; + } + + .page .text-container h2 { + font-weight: 400; + font-size: calc(var(--sec-vwu) * 13.6); + max-width: calc(var(--sec-vwu) * 80) !important; + line-height: 1; + } + + .page .text-container p { + font-weight: 300; + font-size: calc(var(--sec-vwu) * 4.2); + max-width: calc(var(--sec-vwu) * 80) !important; + } + + .page .text-container p span { + font-weight: 700; + } + + .page .text-container a { + font-weight: 300; + font-size: calc(var(--sec-vwu) * 4.2); + max-width: calc(var(--sec-vwu) * 80) !important; + } + + .page-3 .text-container, + .page-4 .text-container { + margin-left: 0; + } + + .page-2 .text-container h2 { + max-width: calc(var(--sec-vwu) * 72) !important; + } + + .roadmap { + width: calc(var(--sec-vwu) * 85) !important; + } + + .roadmap>p:first-child { + float: left; + } + + .roadmap p.title span { + display: inline; + } + + .roadmap p.title { + max-width: calc(var(--sec-vwu) * 85) !important; + color: #009df7; + } + + .dark .roadmap p.title { + color: #64fdff; + } + + .roadmap>p { + font-weight: 400; + max-width: calc(var(--sec-vwu) * 90) !important; + } +} + +.page-6 .group-images { + position: absolute; + top: 0; + right: 0; + bottom: 0; + width: calc(var(--sec-vwu) * 65); + padding: calc(var(--sec-vhu) * 10.5) calc(var(--sec-vwu) * 2.5); + z-index: 0; + + display: grid; + grid-template-columns: repeat(8, 1fr); + grid-template-rows: repeat(6, 1fr); + gap: calc(var(--sec-vwu) * 2.1); + z-index: 2; +} + +.page-6 .group-images img { + width: 100%; + height: auto; + border-radius: calc(var(--sec-vhu) * 1.8); +} + +@media screen and (max-width: 959px) { + .page-6 .group-images { + width: 100%; + height: 10%; + padding: calc(var(--sec-vhu) * 4) calc(var(--sec-vwu) * 3); + top: 0; + right: 0; + grid-template-columns: repeat(8, 1fr); + grid-template-rows: repeat(7, 1fr); + gap: calc(var(--sec-vwu) * 2.8); + } + + .page-6 .group-images img { + border-radius: calc(var(--sec-vhu) * 0.8); + } +} + +/* + Utility: position an image on the grid using CSS vars + Usage example: + + places the image starting at column 3, row 2, spanning 2 columns × 2 rows. +*/ +.page-6 .group-images>a.group-image:nth-child(1) { + --c: 2; + --r: 1; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(2) { + --c: 4; + --r: 1; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(3) { + --c: 5; + --r: 1; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(4) { + --c: 7; + --r: 1; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(5) { + --c: 1; + --r: 2; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(6) { + --c: 3; + --r: 2; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(7) { + --c: 4; + --r: 2; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(8) { + --c: 5; + --r: 2; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(9) { + --c: 6; + --r: 2; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(10) { + --c: 8; + --r: 2; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(11) { + --c: 2; + --r: 3; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(12) { + --c: 3; + --r: 3; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(14) { + --c: 6; + --r: 3; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(15) { + --c: 7; + --r: 3; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(16) { + --c: 1; + --r: 4; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(17) { + --c: 3; + --r: 4; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(18) { + --c: 6; + --r: 4; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(19) { + --c: 8; + --r: 4; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(20) { + --c: 2; + --r: 5; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(21) { + --c: 4; + --r: 5; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(22) { + --c: 5; + --r: 5; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(23) { + --c: 6; + --r: 5; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(24) { + --c: 7; + --r: 5; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(25) { + --c: 3; + --r: 6; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(26) { + --c: 4; + --r: 6; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.group-image:nth-child(27) { + --c: 6; + --r: 6; + --w: 1; + --h: 1 +} + +.page-6 .group-images>a.simplex-image { + --c: 4; + --r: 3; + --w: 2; + --h: 2; + margin: calc(var(--sec-vhu) * 2); +} + +@media screen and (max-width: 959px) { + .page-6 .group-images>a.group-image:nth-child(1) { + --c: 3; + --r: 1; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(2) { + --c: 6; + --r: 1; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(3) { + --c: 2; + --r: 2; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(4) { + --c: 4; + --r: 2; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(5) { + --c: 5; + --r: 2; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(6) { + --c: 7; + --r: 2; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(7) { + --c: 3; + --r: 3; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(8) { + --c: 4; + --r: 3; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(9) { + --c: 5; + --r: 3; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(10) { + --c: 6; + --r: 3; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(11) { + --c: 8; + --r: 3; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(12) { + --c: 2; + --r: 4; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(14) { + --c: 3; + --r: 4; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(15) { + --c: 6; + --r: 4; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(16) { + --c: 7; + --r: 4; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(17) { + --c: 1; + --r: 5; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(18) { + --c: 3; + --r: 5; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(19) { + --c: 6; + --r: 5; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(20) { + --c: 7; + --r: 5; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(21) { + --c: 2; + --r: 6; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(22) { + --c: 4; + --r: 6; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(23) { + --c: 5; + --r: 6; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(24) { + --c: 6; + --r: 6; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(25) { + --c: 3; + --r: 7; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(26) { + --c: 4; + --r: 7; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.group-image:nth-child(27) { + --c: 6; + --r: 7; + --w: 1; + --h: 1 + } + + .page-6 .group-images>a.simplex-image { + --c: 4; + --r: 4; + --w: 2; + --h: 2; + margin: calc(var(--sec-vhu) * 1); + } +} + +.page-6 .group-images a { + grid-column: var(--c) / span var(--w, 1); + grid-row: var(--r) / span var(--h, 1); +} + + +/* FOOTER STYLES */ +section.page.footer { + height: fit-content; + min-height: fit-content; +} + +@media screen and (max-width: 959px) { + section.page.footer { + height: 100lvh; + min-height: 100lvh; + } + + .chrome-ios section.page, + .safari-ios section.page { + min-height: 110lvh; + height: 110lvh; + padding-bottom: calc(110lvh - 100svh); + } +} + +.footer .container, +.footer .container-fluid, +.footer .container-xxl, +.footer .container-xl, +.footer .container-lg, +.footer .container-md, +.footer .container-sm { + width: 100%; + /* padding: 0 20px; */ + margin-right: auto; + margin-left: auto; +} + +@media (min-width: 576px) { + + .footer .container-sm, + .footer .container { + max-width: 540px; + } +} + +@media (min-width: 960px) { + + .footer .container-md, + .footer .container-sm, + .footer .container { + max-width: 720px; + } +} + +@media (min-width: 992px) { + + .footer .container-lg, + .footer .container-md, + .footer .container-sm, + .footer .container { + max-width: 960px; + } +} + +@media (min-width: 1200px) { + + .footer .container-xl, + .footer .container-lg, + .footer .container-md, + .footer .container-sm, + .footer .container { + max-width: 1140px; + } +} + +@media (min-width: 1400px) { + + .footer .container-xxl, + .footer .container-xl, + .footer .container-lg, + .footer .container-md, + .footer .container-sm, + .footer .container { + max-width: 1320px; + } +} \ No newline at end of file diff --git a/website/src/css/doc.css b/website/src/css/doc.css index 002d6bae0f..937268b166 100644 --- a/website/src/css/doc.css +++ b/website/src/css/doc.css @@ -87,8 +87,8 @@ header { } .dark #doc h1 { - background: -webkit-linear-gradient(to bottom, #70F0F9 100%, #70F0F9 100%); - background: linear-gradient(to bottom, #70F0F9 100%, #70F0F9 100%); + background: -webkit-linear-gradient(to bottom, #70F0F9 0%, #70F0F9 33%, #50D8F1 100%); + background: linear-gradient(to bottom, #70F0F9 0%, #70F0F9 33%, #50D8F1 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; @@ -235,7 +235,7 @@ header { } .dark #doc main aside { - background-color: #17203D; + background-color: #000832; } #doc main aside ul { @@ -305,13 +305,13 @@ header { left: 0; right: 0; bottom: 0; - background-color: #F3F6F7; + background-color: #F3FAFF; opacity: 0.9; z-index: 99; } .dark #doc main.overlay::after { - background-color: #0C0B13; + background-color: #000832; } #doc main article { diff --git a/website/src/css/style.css b/website/src/css/style.css index 475eddc404..4b9f5c34c0 100644 --- a/website/src/css/style.css +++ b/website/src/css/style.css @@ -1,3 +1,130 @@ +/* ======================= + GT-Walsheim (WOFF2) + Family: "GT-Walsheim" + Weights mapped: Thin(100), Ultra-Light(200), Light(300), Regular(400), + Medium(500), Bold(700), Ultra-Bold(800), Black(900) +======================= */ + +/* Light */ +@font-face { + font-family: "GT-Walsheim"; + src: url("/fonts/GT-Walsheim/GT-Walsheim-LC-Light.woff2") format("woff2"); + font-weight: 300; + font-style: normal; + font-display: swap; +} +@font-face { + font-family: "GT-Walsheim"; + src: url("/fonts/GT-Walsheim/GT-Walsheim-LC-Light-Oblique.woff2") format("woff2"); + font-weight: 300; + font-style: oblique; + font-display: swap; +} + +/* Regular */ +@font-face { + font-family: "GT-Walsheim"; + src: url("/fonts/GT-Walsheim/GT-Walsheim-LC-Regular.woff2") format("woff2"); + font-weight: 400; + font-style: normal; + font-display: swap; +} +@font-face { + font-family: "GT-Walsheim"; + src: url("/fonts/GT-Walsheim/GT-Walsheim-LC-Regular-Oblique.woff2") format("woff2"); + font-weight: 400; + font-style: oblique; + font-display: swap; +} + +/* Medium */ +@font-face { + font-family: "GT-Walsheim"; + src: url("/fonts/GT-Walsheim/GT-Walsheim-LC-Medium.woff2") format("woff2"); + font-weight: 500; + font-style: normal; + font-display: swap; +} +@font-face { + font-family: "GT-Walsheim"; + src: url("/fonts/GT-Walsheim/GT-Walsheim-LC-Medium-Oblique.woff2") format("woff2"); + font-weight: 500; + font-style: oblique; + font-display: swap; +} + +/* Bold */ +@font-face { + font-family: "GT-Walsheim"; + src: url("/fonts/GT-Walsheim/GT-Walsheim-LC-Bold.woff2") format("woff2"); + font-weight: 700; + font-style: normal; + font-display: swap; +} +@font-face { + font-family: "GT-Walsheim"; + src: url("/fonts/GT-Walsheim/GT-Walsheim-LC-Bold-Oblique.woff2") format("woff2"); + font-weight: 700; + font-style: oblique; + font-display: swap; +} + +/* ======================= + Manrope (TTF) + Family: "Manrope" + Weights mapped per name +======================= */ + +@font-face { + font-family: "Manrope"; + src: url("/fonts/Manrope/Manrope-ExtraLight.ttf") format("truetype"); + font-weight: 200; + font-style: normal; + font-display: swap; +} +@font-face { + font-family: "Manrope"; + src: url("/fonts/Manrope/Manrope-Light.ttf") format("truetype"); + font-weight: 300; + font-style: normal; + font-display: swap; +} +@font-face { + font-family: "Manrope"; + src: url("/fonts/Manrope/Manrope-Regular.ttf") format("truetype"); + font-weight: 400; + font-style: normal; + font-display: swap; +} +@font-face { + font-family: "Manrope"; + src: url("/fonts/Manrope/Manrope-Medium.ttf") format("truetype"); + font-weight: 500; + font-style: normal; + font-display: swap; +} +@font-face { + font-family: "Manrope"; + src: url("/fonts/Manrope/Manrope-SemiBold.ttf") format("truetype"); + font-weight: 600; + font-style: normal; + font-display: swap; +} +@font-face { + font-family: "Manrope"; + src: url("/fonts/Manrope/Manrope-Bold.ttf") format("truetype"); + font-weight: 700; + font-style: normal; + font-display: swap; +} +@font-face { + font-family: "Manrope"; + src: url("/fonts/Manrope/Manrope-ExtraBold.ttf") format("truetype"); + font-weight: 800; + font-style: normal; + font-display: swap; +} + @font-face { font-family: Gilroy; src: url("/fonts/GilroyRegular/font.woff2") format("woff2"), url("webFonts/GilroyRegular/font.woff") format("woff"); @@ -35,7 +162,7 @@ html { scroll-behavior: smooth; - font-family: Gilroy, Helvetica, sans-serif;; + font-family: GT-Walsheim, Gilroy, Helvetica, sans-serif;; letter-spacing: 0.003em; } @@ -137,9 +264,18 @@ a{ text-fill-color: transparent; } +.dark .gradient-text { + background: -webkit-linear-gradient(to bottom, #70F0F9 0%, #70F0F9 33%, #50D8F1 100%); + background: linear-gradient(to bottom, #70F0F9 0%, #70F0F9 33%, #50D8F1 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; + text-fill-color: transparent; +} + .dark .border-gradient { background: - linear-gradient(#11182F, #11182F) padding-box, + linear-gradient(#0B2A59, #0B2A59) padding-box, linear-gradient(to bottom, transparent, #01F1FF 58%) border-box; border: 1px solid transparent; } @@ -158,7 +294,7 @@ a{ .dark .unique-swiper .border-gradient{ background: - linear-gradient(#0C0B13, #0C0B13) padding-box, + linear-gradient(#000832, #000832) padding-box, linear-gradient(to bottom, transparent, #01F1FF 58%) border-box; border: 1px solid transparent; } @@ -177,154 +313,6 @@ a{ pointer-events: none; } -.menu-link{ - font-size: 16px; - line-height: 33.42px; - color: #0D0E12; -} -.dark .menu-link{ - color: #fff; -} - -.nav-link ul li a.active{ - color: #0053D0; - -} -.dark .nav-link ul li a.active{ - color: #66D9E2; -} - -@media (min-width:1024px) { - .nav-link-text, - .menu-link { - display: inline-block; - position: relative; - color: #0D0E12; - } - - .nav-link-text::before, - .active .nav-link-text::before, - .menu-link::before { - content: ""; - position: absolute; - width: 0; - height: 1px; - bottom: 0; - right: 0; - /* background-color: initial; */ - transition: width 0.25s ease-out; - } - - .menu-link::before { - background-color: #0D0E12; - } - .dark .menu-link::before { - background-color: #fff; - } - - .active .nav-link-text::before { - width: 100%; - } - - .nav-link:hover .nav-link-text::before, - .menu-link:hover::before { - width: 100%; - left: 0; - right: auto; - } -} - - -.sub-menu { - visibility: hidden; - opacity: 0; - color: #505158; -} - -.sub-menu .no-hover{ - color: #505158 !important; -} - -.dark .sub-menu, -.dark .sub-menu .no-hover { - color: #fff !important; -} - -.dark .sub-menu li:hover { - color: #66D9E2; -} - -.sub-menu li:hover { - color: #0053D0; -} - -.sub-menu { - transition: all .3s ease !important; -} - -.nav-link span svg, -header nav { - transition: all 0.5s ease; -} - -.nav-link:hover span svg { - transform: rotate(180deg); -} - -/* @media (max-width: 1400px) { - .landing-page-header-article-paragraph { - width: 21rem; - } - - .socials { - flex-wrap: nowrap; - } -} */ - -@media (min-width:1024px) { - - .nav-link:hover .sub-menu, - .nav-link:focus-within .sub-menu { - visibility: visible; - opacity: 1; - margin-top: 0; - } -} - -@media (max-width: 1024px) { - .sub-menu { - max-height: 0; - transform: translateY(-10px); - transition: all .7s ease !important; - overflow: hidden; - } - - .active .sub-menu { - max-height: 1000px; - transform: translateY(0px); - opacity: 1; - visibility: visible; - margin-top: 0; - } - - header nav { - visibility: hidden; - opacity: 0; - transform: translateX(100%); - overflow-y: auto; - } - - header nav.open { - visibility: visible; - opacity: 1; - transform: translateX(0); - } - - .flag-container .sub-menu{ - max-height: fit-content; - } -} - .lock-scroll { overflow: hidden; } @@ -496,33 +484,74 @@ header nav { /* comparison */ -#comparison table thead th{ +#comparison table thead th, +#messengers-comparison table thead th{ font-size: 16px; line-height: 36px; font-weight: 500; text-align: center; } -#comparison table tbody td{ +#comparison table tbody td, +#messengers-comparison table tbody td{ font-size: 16px; line-height: 24px; font-weight: 500; } -#comparison table tbody tr > td:first-child{ +#comparison table tbody tr > td:first-child, +#messengers-comparison table tbody tr > td:first-child{ font-size: 16px; line-height: 24px; font-weight: 500; text-align: left; } -[dir="rtl"] #comparison table tbody tr > td:first-child{ +[dir="rtl"] #comparison table tbody tr > td:first-child, +[dir="rtl"] #messengers-comparison table tbody tr > td:first-child{ text-align: right; } @media (min-width: 1024px) { - #comparison table tbody tr > td:first-child{ + #comparison table tbody tr > td:first-child, + #messengers-comparison table tbody tr > td:first-child{ font-size: 18px; line-height: 36px; - } + } +} + +#messengers-comparison table td.criteria { + min-width: 100px; + height: 52px; + text-align: center; +} + +#messengers-comparison table tbody span.criteria-mark { + font-size: 28px; +} + +#messengers-comparison table tbody sup { + font-size: 14px; +} + +@media (min-width: 1024px) { + #messengers-comparison table tbody span.criteria-mark { + font-size: 36px; + } + + #messengers-comparison table tbody sup { + font-size: 18px; + } +} + +#messengers-comparison table .green-check { + color: #1DB100; +} + +#messengers-comparison table .yellow-check { + color: #FFD932; +} + +#messengers-comparison table .red-ballot-x { + color: #EE220C; } /* hero */ @@ -740,7 +769,7 @@ p a{ position: fixed; width: 320px; max-width: 100%; - z-index: 10001; + z-index: 10001; transition: opacity .5s; padding-left: 5px; padding-right: 5px; @@ -810,13 +839,13 @@ p a{ position: absolute; width: 100%; height: 100%; - background-color:#F3F6F7; + background-color:#F3FAFF; opacity: 0.9; } .dark .glossary-overlay::before { content: ''; - background-color: #0C0B13; + background-color: #000832; } .glossary-overlay .overlay-card{ @@ -835,7 +864,7 @@ p a{ } .dark .glossary-overlay .overlay-card{ - background-color: #17203D; + background-color: #071C46; } @media (min-width: 640px) { diff --git a/website/src/directory.html b/website/src/directory.html index 4304fb0559..0235583ece 100644 --- a/website/src/directory.html +++ b/website/src/directory.html @@ -9,7 +9,6 @@ active_directory: true {% set lang = page.url | getlang %} {% block js_scripts %} - {% endblock %}