mirror of
https://github.com/simplex-chat/simplex-chat.git
synced 2026-08-29 03:18:37 +00:00
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 ee27d17484.
* fix web.sh
---------
Co-authored-by: Evgeny Poberezkin <evgeny@poberezkin.com>
This commit is contained in:
M. Sarmad Qadeer
co-authored by
Evgeny Poberezkin
Evgeny Poberezkin
parent
443493c9d2
commit
c2f536806e
+1
-1
@@ -30,7 +30,7 @@
|
||||
<body class="bg-[#F3F6F7] dark:bg-[#0C0B13]">
|
||||
{% include "navbar.html" %}
|
||||
|
||||
<section id="article" class="container mb-[75px] bg-white dark:bg-[#17203D] px-5 mt-10">
|
||||
<section id="article" class="container mb-[75px] bg-white dark:bg-[#17203D] px-5 mt-[66px]">
|
||||
<div class="py-6 md:p-[60px]">{{ content | safe }}</div>
|
||||
</section>
|
||||
|
||||
+145
-21
@@ -404,12 +404,13 @@ section.page {
|
||||
/* fallback */
|
||||
height: 100lvh;
|
||||
padding-bottom: calc(100lvh - 100svh);
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
section.page .area {
|
||||
position: relative;
|
||||
width: var(--sec-w);
|
||||
height: var(--sec-h);
|
||||
z-index: 11;
|
||||
/* border: 2px solid red; */
|
||||
}
|
||||
|
||||
@@ -419,6 +420,7 @@ section.cover {
|
||||
background-size: var(--cover-bg-w) var(--cover-bg-h);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
z-index: 12;
|
||||
}
|
||||
|
||||
.dark section.cover {
|
||||
@@ -473,30 +475,150 @@ section.cover div.content p {
|
||||
max-width: calc(var(--sec-vwu) * 25);
|
||||
}
|
||||
|
||||
section.cover div.socials {
|
||||
.publications-btns {
|
||||
position: absolute;
|
||||
width: var(--sec-w);
|
||||
bottom: calc(var(--sec-vhu) * 3);
|
||||
padding: 0 calc(var(--sec-vwu) * 4);
|
||||
bottom: 24px;
|
||||
left: 16px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.publications-btns img {
|
||||
height: 36px;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.box-btn {
|
||||
height: 36px;
|
||||
padding: 0 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
gap: calc(var(--sec-vwu) * 0.6);
|
||||
justify-content: center;
|
||||
font-size: 16px !important;
|
||||
font-family: 'Manrope', 'GT-Walsheim', sans-serif !important;
|
||||
font-weight: 700 !important;
|
||||
letter-spacing: -0.25px !important;
|
||||
border-radius: 6px !important;
|
||||
}
|
||||
|
||||
.box-btn.btn-1 {
|
||||
background-color: #639bd9;
|
||||
}
|
||||
|
||||
.box-btn.btn-2 {
|
||||
background: linear-gradient(100deg,
|
||||
#ffb55d 0%,
|
||||
#fff494 50%,
|
||||
#fbffdd 100%);
|
||||
}
|
||||
|
||||
.security-audits {
|
||||
font-size: 14px !important;
|
||||
font-family: 'Manrope', 'GT-Walsheim', sans-serif !important;
|
||||
font-weight: 300 !important;
|
||||
text-align: left;
|
||||
color: white;
|
||||
width: 55px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1280px) {
|
||||
.publications-btns {
|
||||
display: none;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.security-btns {
|
||||
transform: translateX(0);
|
||||
left: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.socials {
|
||||
position: absolute;
|
||||
bottom: 22px;
|
||||
right: 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
section.cover div.socials a img {
|
||||
.socials a img {
|
||||
width: auto;
|
||||
height: calc(var(--sec-vhu) * 4.2);
|
||||
height: 40px;
|
||||
border: #4f4f4f 1px solid;
|
||||
border-radius: calc(var(--sec-vhu) * 0.8);
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
section.cover div.socials a img.no-border {
|
||||
.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;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.desktop-app-btn .btn-content p {
|
||||
margin: 0;
|
||||
font-size: 10px !important;
|
||||
font-family: 'Manrope', 'GT-Walsheim', sans-serif !important;
|
||||
font-weight: 300 !important;
|
||||
line-height: 1.2 !important;
|
||||
text-align: left;
|
||||
color: #fff;
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.desktop-app-btn .btn-content img {
|
||||
height: 22px !important;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.desktop-app-btn .btn-content>div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 949px) {
|
||||
|
||||
.publications-btns,
|
||||
.security-btns,
|
||||
.socials {
|
||||
position: static;
|
||||
}
|
||||
}
|
||||
|
||||
/* --- MAIN SECTIONS --- */
|
||||
main {
|
||||
position: relative;
|
||||
@@ -784,7 +906,19 @@ main .section-bg {
|
||||
}
|
||||
|
||||
@media (max-width: 949px) {
|
||||
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);
|
||||
max-width: calc(var(--sec-vwu) * 65);
|
||||
@@ -801,16 +935,6 @@ main .section-bg {
|
||||
max-width: calc(var(--sec-vwu) * 65);
|
||||
}
|
||||
|
||||
section.cover div.socials {
|
||||
bottom: 32px;
|
||||
gap: 10px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
section.cover div.socials a img {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
|
||||
/* --- MAIN SECTIONS --- */
|
||||
.page .text-container {
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 35 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 45 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 66 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 67 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 68 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 42 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 62 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 154 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 212 KiB |
+56
-14
@@ -71,13 +71,55 @@ active_home: true
|
||||
<h1>Be Free</h1>
|
||||
<h2 class="gradient-text">Freedom & Security<br>of Your Communications</h2>
|
||||
<p>The first network where you own your identity, contacts, and groups.</p>
|
||||
</div>
|
||||
<div class="socials">
|
||||
<a class="apple-store-btn hidden" href="https://apps.apple.com/us/app/simplex-chat/id1605771084" target="_blank"><img src="/img/new/apple_store.svg" /></a>
|
||||
<a class="google-play-btn hidden" href="https://play.google.com/store/apps/details?id=chat.simplex.app" target="_blank" title="Public iOS preview on TestFlight"><img src="/img/new/google_play.svg" /></a>
|
||||
<a class="f-droid-btn hidden" href="{{ '' if lang == 'en' else '/' ~ lang }}/fdroid" title="SimpleX F-Droid Repository"><img src="/img/new/f_droid.svg" /></a>
|
||||
<a class="testflight-btn hidden" href="https://testflight.apple.com/join/DWuT2LQu" target="_blank"><img class="no-border" src="/img/design_3/testflight-dark.png" /></a>
|
||||
<a class="android-btn hidden" href="https://github.com/simplex-chat/simplex-chat/releases/latest/download/simplex.apk" target="_blank"><img src="/img/design_3/android-dark.png" /></a>
|
||||
|
||||
<div class="socials">
|
||||
<a href="/downloads" class="desktop-app-btn hidden" title="Download SimpleX Desktop App">
|
||||
<div class="btn-content">
|
||||
<div>
|
||||
<img class="no-border" src="/img/design_3/socials/linux.png" />
|
||||
<img class="no-border" src="/img/design_3/socials/apple.png" alt="">
|
||||
<img class="no-border" src="/img/design_3/socials/windows.png" alt="">
|
||||
</div>
|
||||
<p>Download Desktop App</p>
|
||||
</div>
|
||||
</a>
|
||||
<a class="apple-store-btn hidden" href="https://apps.apple.com/us/app/simplex-chat/id1605771084" target="_blank"><img src="/img/new/apple_store.svg" /></a>
|
||||
<a class="google-play-btn hidden" href="https://play.google.com/store/apps/details?id=chat.simplex.app" target="_blank" title="Public iOS preview on TestFlight"><img src="/img/new/google_play.svg" /></a>
|
||||
<a class="f-droid-btn hidden" href="{{ '' if lang == 'en' else '/' ~ lang }}/fdroid" title="SimpleX F-Droid Repository"><img src="/img/new/f_droid.svg" /></a>
|
||||
<a class="testflight-btn hidden" href="https://testflight.apple.com/join/DWuT2LQu" target="_blank"><img class="no-border" src="/img/design_3/testflight-dark.png" /></a>
|
||||
<a class="android-btn hidden" href="https://github.com/simplex-chat/simplex-chat/releases/latest/download/simplex.apk" target="_blank"><img src="/img/design_3/android-dark.png" /></a>
|
||||
</div>
|
||||
<div class="security-btns">
|
||||
<a title="security assessment" href="https://www.trailofbits.com/about" target="_blank">
|
||||
<img src="/img/design_3/publications/trail-of-bits.png" alt="Trail of Bits">
|
||||
</a>
|
||||
<a class="box-btn btn-1" title="Security Review 2022" href="/blog/20221108-simplex-chat-v4.2-security-audit-new-website.html">
|
||||
2022
|
||||
</a>
|
||||
<a class="box-btn btn-2" title="Security Review 2024" href="/blog/20241014-simplex-network-v6-1-security-review-better-calls-user-experience.html">
|
||||
2024
|
||||
</a>
|
||||
<p class="security-audits">
|
||||
Security Audits
|
||||
</p>
|
||||
</div>
|
||||
<div class="publications-btns">
|
||||
<a title="messenger recommendations" href="https://www.privacyguides.org/en/real-time-communication/#simplex-chat" target="_blank">
|
||||
<img src="/img/design_3/publications/privacy-guides.png" alt="Privacy Guides">
|
||||
</a>
|
||||
<a title="Whonix messenger recommendations" href="https://www.whonix.org/wiki/Chat#Recommendation" target="_blank">
|
||||
<img src="/img/design_3/publications/whonix.png" alt="Whonix">
|
||||
</a>
|
||||
<a title="publication" href="https://www.heise.de/suche/?q=simplex+chat&sort_by=date&rm=search" target="_blank">
|
||||
<img src="/img/design_3/publications/heise.png" alt="Heise">
|
||||
</a>
|
||||
<a title="review" href="https://www.kuketz-blog.de/simplex-eindruecke-vom-messenger-ohne-identifier/" target="_blank">
|
||||
<img src="/img/design_3/publications/kuketz-blog.png" alt="Kuketz Blog">
|
||||
</a>
|
||||
<a title="podcast interview" href="https://optoutpod.com/episodes/s3e02-simplexchat/" target="_blank">
|
||||
<img src="/img/design_3/publications/optout.png" alt="Opt Out">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -85,18 +127,18 @@ active_home: true
|
||||
<main>
|
||||
<div class="section-bg"></div>
|
||||
|
||||
<section class="page-2 page">
|
||||
<section id="messaging" class="page-2 page">
|
||||
<div class="area">
|
||||
<div class="text-container">
|
||||
<h2>World's Most Secure Messaging</h2>
|
||||
<p>SimpleX messaging has cutting-edge end-to-end encryption.</p>
|
||||
<p>For your security, servers can’t see your messages <span>or who you talk to.</span></p>
|
||||
<a class="gradient-text" href="/learn-more">Learn more about SimpleX messaging</a>
|
||||
<a class="gradient-text" href="/messaging">Learn more about SimpleX messaging</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="page-3 page">
|
||||
<section id="nextweb" class="page-3 page">
|
||||
<div class="area">
|
||||
<div class="text-container">
|
||||
<h2>You Own<br>The Next Web</h2>
|
||||
@@ -106,18 +148,18 @@ active_home: true
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="page-4 page">
|
||||
<section id="token" class="page-4 page">
|
||||
<div class="area">
|
||||
<div class="text-container">
|
||||
<h2>Communities That Last</h2>
|
||||
<p>You will support your favorite groups with future Community vouchers.</p>
|
||||
<p>Vouchers will pay for servers, to let your communities stay free and independent.</p>
|
||||
<a class="gradient-text" href="/community-vouchers">Learn more about Community Vouchers</a>
|
||||
<a class="gradient-text" href="/token">Learn more about Community Vouchers</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="page-5 page">
|
||||
<section id="roadmap" class="page-5 page">
|
||||
<div class="area">
|
||||
<div class="text-container">
|
||||
<h2>SimpleX Roadmap to Free Internet</h2>
|
||||
@@ -140,7 +182,7 @@ active_home: true
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="page-6 page">
|
||||
<section id="directory" class="page-6 page">
|
||||
<div class="area">
|
||||
<div class="group-images">
|
||||
<a href="/directory" class="group-image" target="_blank"><img src="/img/group.svg"></a>
|
||||
|
||||
@@ -11,8 +11,9 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
const fDroidBtn = document.querySelector('.f-droid-btn');
|
||||
const testflightBtn = document.querySelector('.testflight-btn');
|
||||
const androidBtn = document.querySelector('.android-btn');
|
||||
const desktopAppBtn = document.querySelector('.desktop-app-btn');
|
||||
|
||||
if (!googlePlayBtn || !appleStoreBtn || !fDroidBtn || !testflightBtn || !androidBtn) return;
|
||||
if (!googlePlayBtn || !appleStoreBtn || !fDroidBtn || !testflightBtn || !androidBtn || !desktopAppBtn) return;
|
||||
|
||||
|
||||
if (isMobile.Android()) {
|
||||
@@ -27,9 +28,10 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
else {
|
||||
appleStoreBtn.classList.remove('hidden');
|
||||
googlePlayBtn.classList.remove('hidden');
|
||||
fDroidBtn.classList.remove('hidden');
|
||||
testflightBtn.classList.remove('hidden');
|
||||
androidBtn.classList.remove('hidden');
|
||||
desktopAppBtn.classList.remove('hidden');
|
||||
// fDroidBtn.classList.remove('hidden');
|
||||
// testflightBtn.classList.remove('hidden');
|
||||
// androidBtn.classList.remove('hidden');
|
||||
}
|
||||
|
||||
showPromotedGroups();
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
layout: layouts/community_vouchers.html
|
||||
layout: layouts/token.html
|
||||
title: "Simplex Chat"
|
||||
permalink: "/community-vouchers/index.html"
|
||||
permalink: "/token/index.html"
|
||||
---
|
||||
|
||||
# Community Vouchers
|
||||
+2
-2
@@ -32,7 +32,7 @@ node customize_docs_frontmatter.js
|
||||
for lang in "${langs[@]}"; do
|
||||
mkdir -p src/$lang
|
||||
cp src/index.html src/$lang
|
||||
cp src/learn-more.html src/$lang
|
||||
cp src/messaging.html src/$lang
|
||||
cp src/contact.html src/$lang
|
||||
cp src/invitation.html src/$lang
|
||||
cp src/fdroid.html src/$lang
|
||||
@@ -65,6 +65,6 @@ done
|
||||
# val_json_obj=$(echo "$val_json_obj" | jq ". + {$lang: $val}")
|
||||
# fi
|
||||
# done
|
||||
# main_json_obj=$(echo "$main_json_obj" | jq ". + {\"$key\": $val_json_obj}")
|
||||
# main_json_obj=$(echo "$main_json_obj" | jq ". + {\"$key\": $val_json_obj}")
|
||||
# done
|
||||
# echo "$main_json_obj" > translations.json
|
||||
Reference in New Issue
Block a user