mirror of
https://github.com/simplex-chat/simplex-chat.git
synced 2026-05-26 09:44:55 +00:00
Merge branch 'new-website' into ep/new-site-generate
This commit is contained in:
Evgeny Poberezkin
@@ -27,13 +27,14 @@
|
||||
<link rel="stylesheet" href="/css/blog.css" />
|
||||
<link id="prism-theme" rel="stylesheet" href="/css/prism-light.min.css"/>
|
||||
<link href="/css/style.css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="/css/design3-nav.css">
|
||||
<script async defer src="https://buttons.github.io/buttons.js"></script>
|
||||
</head>
|
||||
|
||||
<body class="bg-[#F3F6F7] dark:bg-[#0C0B13]">
|
||||
{% include "navbar.html" %}
|
||||
|
||||
<div class="container px-5">
|
||||
<div class="container px-5 mt-[66px]">
|
||||
<a class="inline-block text-grey-black dark:text-white my-5 underline underline-offset-2" href="/blog">< Back to list</a>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -23,6 +23,7 @@
|
||||
<link rel="stylesheet" href="/css/blog.css" />
|
||||
<link id="prism-theme" rel="stylesheet" href="/css/prism-light.min.css"/>
|
||||
<link href="/css/style.css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="/css/design3-nav.css">
|
||||
<script async defer src="https://buttons.github.io/buttons.js"></script>
|
||||
</head>
|
||||
|
||||
|
||||
@@ -19,13 +19,12 @@
|
||||
<link id="prism-theme" rel="stylesheet" href="/css/prism-light.min.css"/>
|
||||
<link href="/css/style.css" rel="stylesheet"/>
|
||||
<link rel="stylesheet" href="/css/doc.css"/>
|
||||
<link rel="stylesheet" href="/css/design3-nav.css">
|
||||
<script async defer src="https://buttons.github.io/buttons.js"></script>
|
||||
</head>
|
||||
|
||||
<body class="bg-[#F3F6F7] dark:bg-[#0C0B13]">
|
||||
<section class="w-full bg-transparent fixed top-0 z-50">
|
||||
{% include "navbar.html" %}
|
||||
</section>
|
||||
{% include "navbar.html" %}
|
||||
|
||||
<section id="doc" class="bg-white dark:bg-[#17203D] mt-[66px]">
|
||||
<div>
|
||||
|
||||
@@ -18,13 +18,12 @@
|
||||
<link id="prism-theme" rel="stylesheet" href="/css/prism-light.min.css" />
|
||||
<link href="/css/style.css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="/css/doc.css" />
|
||||
<link rel="stylesheet" href="/css/design3-nav.css">
|
||||
<script async defer src="https://buttons.github.io/buttons.js"></script>
|
||||
</head>
|
||||
|
||||
<body class="bg-[#F3F6F7] dark:bg-[#0C0B13]">
|
||||
<section class="w-full bg-transparent fixed top-0 z-50">
|
||||
{% include "navbar.html" %}
|
||||
</section>
|
||||
{% include "navbar.html" %}
|
||||
|
||||
<section id="doc" class="bg-white dark:bg-[#17203D] mt-[66px]">
|
||||
<main class="container px-4 lg:px-7 py-10 md:py-16">
|
||||
|
||||
@@ -30,14 +30,13 @@
|
||||
<link rel="stylesheet" href="/css/blog.css">
|
||||
<link href="/css/tailwind.css" rel="stylesheet"/>
|
||||
<link rel="stylesheet" href="/css/style.css">
|
||||
<link rel="stylesheet" href="/css/design3-nav.css">
|
||||
<script async defer src="https://buttons.github.io/buttons.js"></script>
|
||||
<script src="/js/flag-anchor.js"></script>
|
||||
{% block js_scripts %}{% endblock %}
|
||||
</head>
|
||||
<body class="bg-white dark:bg-[#0C0B13]">
|
||||
<section class="w-full bg-transparent fixed top-0 z-50">
|
||||
{% include "navbar.html" %}
|
||||
</section>
|
||||
{% include "navbar.html" %}
|
||||
|
||||
{{ content | applyGlossary | safe }}
|
||||
|
||||
|
||||
@@ -26,13 +26,14 @@
|
||||
<link href="/css/tailwind.css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="/css/blog.css" />
|
||||
<link href="/css/style.css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="/css/design3-nav.css">
|
||||
<script async defer src="https://buttons.github.io/buttons.js"></script>
|
||||
</head>
|
||||
|
||||
<body class="bg-[#F3F6F7] dark:bg-[#0C0B13]">
|
||||
{% include "navbar.html" %}
|
||||
|
||||
<section id="article" class="container mt-[25px] mb-[75px] bg-white dark:bg-[#17203D] px-5">
|
||||
<section id="article" class="container mt-[66px] mb-[75px] bg-white dark:bg-[#17203D] px-5">
|
||||
<div class="py-6 md:p-[60px]">{{ content | safe }}</div>
|
||||
</section>
|
||||
|
||||
|
||||
+151
-181
@@ -6,173 +6,156 @@
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
<header class="">
|
||||
<div class="flex items-center flex-row justify-end m-auto px-4 lg:px-7 h-[66px]">
|
||||
<a href="/{{ '' if lang == 'en' else lang }}" class="h-full hidden dark:hidden lg:flex items-center ltr:mr-auto rtl:ml-auto"><img class="w-auto max-h-[50px] pr-10" src="/img/new/logo-light.png" alt="logo" /></a>
|
||||
<a href="/{{ '' if lang == 'en' else lang }}" class="h-full hidden dark:lg:flex items-center ltr:mr-auto rtl:ml-auto"><img class="w-auto max-h-[50px] pr-10" src="/img/new/logo-dark.png" alt="logo" /></a>
|
||||
<a href="/{{ '' if lang == 'en' else lang }}" class="dark:hidden lg:hidden ltr:mr-auto rtl:ml-auto"><img class="h-[32px]" src="/img/new/logo-symbol-light.svg" alt="" srcset=""></a>
|
||||
<a href="/{{ '' if lang == 'en' else lang }}" class="hidden dark:inline-block dark:lg:hidden lg:hidden ltr:mr-auto rtl:ml-auto"><img class="h-[32px]" src="/img/new/logo-symbol-dark.svg" alt="" srcset=""></a>
|
||||
<header id="navbar">
|
||||
<a href="/{{ '' if lang == 'en' else lang }}" class="logo flex dark:hidden ltr:mr-auto rtl:ml-auto"><img src="/img/new/logo-light.png" alt="logo" /></a>
|
||||
<a href="/{{ '' if lang == 'en' else lang }}" class="logo hidden dark:flex ltr:mr-auto rtl:ml-auto"><img src="/img/new/logo-dark.png" alt="logo" /></a>
|
||||
|
||||
<nav class="bg-[#F0F1F2] dark:bg-gradient-radial-mobile dark:lg:bg-none lg:bg-transparent fixed top-[66px] left-0 right-0 bottom-0 h-[calc(100vh-66px)] lg:h-[66px] lg:top-0 lg:relative" id="menu">
|
||||
<div class="flex flex-col lg:flex-row justify-between lg:items-center gap-5 xl:gap-10 px-4 lg:px-0 h-full">
|
||||
<ul class="flex flex-col lg:flex-row lg:items-center gap-3 py-4 lg:py-0 lg:gap-5 xl:gap-8">
|
||||
<nav id="menu">
|
||||
<ul>
|
||||
<li class="nav-link {% if active_home %}active{% endif %}">
|
||||
<a href="/{{ '' if lang == 'en' else lang }}">
|
||||
<span class="nav-link-text">{{ "home" | i18n({}, lang ) | safe }}</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="nav-link relative {% if active_home %}active{% endif %}">
|
||||
<a href="/{{ '' if lang == 'en' else lang }}" class="flex items-center justify-between gap-2 lg:py-5 whitespace-nowrap">
|
||||
<span class="text-[16px] leading-[26px] tracking-[0.01em] nav-link-text text-black dark:text-white before:bg-black dark:before:bg-white">{{ "home" | i18n({}, lang ) | safe }}</span>
|
||||
</a>
|
||||
</li>
|
||||
<hr>
|
||||
|
||||
<hr class="dark:opacity-[0.1]" >
|
||||
<li class="nav-link {% if active_directory %}active{% endif %}">
|
||||
<a href="/directory/">
|
||||
<span class="nav-link-text">{{ "directory" | i18n({}, lang ) | safe }}</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="nav-link relative {% if active_directory %}active{% endif %}">
|
||||
<a href="/directory/" class="flex items-center justify-between gap-2 lg:py-5 whitespace-nowrap">
|
||||
<span class="text-[16px] leading-[26px] tracking-[0.01em] nav-link-text text-black dark:text-white before:bg-black dark:before:bg-white">{{ "directory" | i18n({}, lang ) | safe }}</span>
|
||||
</a>
|
||||
</li>
|
||||
<hr>
|
||||
|
||||
<hr class="dark:opacity-[0.1]" >
|
||||
|
||||
<li class="nav-link relative">
|
||||
<a href="javascript:void(0);" class="flex items-center justify-between gap-2 lg:py-5">
|
||||
<span class="text-[16px] leading-[26px] tracking-[0.01em] text-black dark:text-white before:bg-black dark:before:bg-white">{{ "guide" | i18n({}, lang ) | safe }}</span>
|
||||
<span href="" id="btn-mobile" class="flex items-center justify-center h-[36px] w-[36px] lg:h-auto lg:w-auto mt-1">
|
||||
<svg class="fill-black dark:fill-white" width="10" height="6" viewBox="0 0 10 6" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.50447 0.902966C1.21571 0.627397 0.747525 0.627397 0.458761 0.902966C0.169996 1.17853 0.169996 1.62532 0.458761 1.90089L4.21933 5.48961C4.25543 5.52406 4.29433 5.5542 4.33533 5.58003C4.62234 5.76088 5.01237 5.73074 5.26504 5.48961L9.02561 1.90089C9.31438 1.62532 9.31438 1.17853 9.02561 0.902966C8.73685 0.627397 8.26867 0.627397 7.97991 0.902966L4.74219 3.99273L1.50447 0.902966Z"/>
|
||||
</svg>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<ul class="flex flex-col items-start gap-2 lg:h-fit lg:absolute lg:bg-white dark:lg:bg-black top-full lg:mt-[10px] lg:py-4 min-w-[180px] rounded-md lg:shadow-[0_0_3px_rgb(60_72_88_/_15%)] sub-menu">
|
||||
{% for guide in guide_dropdown.items %}
|
||||
<li><a href="{{ guide.url | url }}" class="{{ "active" if page.url == guide.url | url else '' }} lg:px-[20px] inline-block whitespace-nowrap">{{ guide.title | i18n({}, lang ) | safe }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<hr class="dark:opacity-[0.1]" >
|
||||
|
||||
<li class="nav-link relative">
|
||||
<a href="javascript:void(0);" class="flex items-center justify-between gap-2 lg:py-5">
|
||||
<span class="text-[16px] leading-[26px] tracking-[0.01em] text-black dark:text-white before:bg-black dark:before:bg-white">{{ "reference" | i18n({}, lang ) | safe }}</span>
|
||||
<span href="" id="btn-mobile" class="flex items-center justify-center h-[36px] w-[36px] lg:h-auto lg:w-auto mt-1">
|
||||
<svg class="fill-black dark:fill-white" width="10" height="6" viewBox="0 0 10 6" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.50447 0.902966C1.21571 0.627397 0.747525 0.627397 0.458761 0.902966C0.169996 1.17853 0.169996 1.62532 0.458761 1.90089L4.21933 5.48961C4.25543 5.52406 4.29433 5.5542 4.33533 5.58003C4.62234 5.76088 5.01237 5.73074 5.26504 5.48961L9.02561 1.90089C9.31438 1.62532 9.31438 1.17853 9.02561 0.902966C8.73685 0.627397 8.26867 0.627397 7.97991 0.902966L4.74219 3.99273L1.50447 0.902966Z"/>
|
||||
</svg>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<ul class="flex flex-col items-start gap-2 lg:h-fit lg:absolute lg:bg-white dark:lg:bg-black top-full lg:mt-[10px] lg:py-4 min-w-[180px] rounded-md lg:shadow-[0_0_3px_rgb(60_72_88_/_15%)] sub-menu">
|
||||
<li><a href="https://github.com/simplex-chat/simplexmq/blob/stable/protocol/overview-tjr.md"
|
||||
target="_blank" class="lg:px-[20px] flex items-center gap-1"
|
||||
>Whitepaper
|
||||
<svg class="float-right" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg>
|
||||
</a></li>
|
||||
<li><a href="/privacy" class="lg:px-[20px] inline-block"
|
||||
>{{ "terms-and-privacy-policy" | i18n({}, lang ) | safe }}</a></li>
|
||||
<li><a href="https://github.com/simplex-chat/simplexmq/blob/stable/protocol/simplex-messaging.md"
|
||||
target="_blank" class="lg:px-[20px] flex items-center gap-1"
|
||||
>{{ "smp-protocol" | i18n({}, lang ) | safe }}
|
||||
<svg class="float-right" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg>
|
||||
</a></li>
|
||||
<li><a href="/docs/protocol/simplex-chat.html" class="lg:px-[20px] inline-block"
|
||||
>{{ "chat-protocol" | i18n({}, lang ) | safe }}</a></li>
|
||||
<li><a href="/docs/glossary.html" class="lg:px-[20px] inline-block"
|
||||
>{{ "glossary" | i18n({}, lang ) | safe }}</a></li>
|
||||
|
||||
<hr class=" h-[1px] w-full dark:opacity-[0.1]">
|
||||
|
||||
{% for doc in docs_dropdown.items %}
|
||||
<li><a href="{{ doc.url | url }}" class="{{ "active" if page.url == doc.url | url else '' }} lg:px-[20px] inline-block whitespace-nowrap">{{ doc.title | i18n({}, lang ) | safe }}</a></li>
|
||||
{% endfor %}
|
||||
|
||||
<hr class=" h-[1px] w-full dark:opacity-[0.1]">
|
||||
|
||||
<li><a href="/docs/translations.html"
|
||||
class="lg:px-[20px] flex items-center gap-1"
|
||||
>{{ "docs-dropdown-7" | i18n({}, lang ) | safe }}
|
||||
</a></li>
|
||||
<li><a href="/docs/android.html"
|
||||
class="lg:px-[20px] flex items-center gap-1"
|
||||
>{{ "docs-dropdown-2" | i18n({}, lang ) | safe }}
|
||||
</a></li>
|
||||
<li><a href="https://github.com/simplex-chat/simplex-chat/blob/stable/apps/simplex-bot-advanced/Main.hs"
|
||||
target="_blank" class="lg:px-[20px] flex items-center gap-1"
|
||||
>{{ "chat-bot-example" | i18n({}, lang ) | safe }}
|
||||
<svg class="float-right" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg>
|
||||
</a></li>
|
||||
<li><a href="https://github.com/simplex-chat/simplex-chat/tree/stable/packages/simplex-chat-client/typescript"
|
||||
target="_blank" class="lg:px-[20px] flex items-center gap-1"
|
||||
>TypeScript SDK
|
||||
<svg class="float-right" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg>
|
||||
</a></li>
|
||||
<li><a href="/docs/cli.html" class="lg:px-[20px] inline-block"
|
||||
>{{ "terminal-cli" | i18n({}, lang ) | safe }}</a></li>
|
||||
<li><a href="https://github.com/simplex-chat/simplexmq"
|
||||
target="_blank" class="lg:px-[20px] flex items-center gap-1"
|
||||
>SimpleXMQ
|
||||
<svg class="float-right" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg>
|
||||
</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<hr class="dark:opacity-[0.1]" >
|
||||
|
||||
<li class="nav-link relative {% if active_blog %}active{% endif %}">
|
||||
<a href="/blog" class="flex items-center justify-between gap-2 lg:py-5">
|
||||
<span class="text-[16px] leading-[26px] tracking-[0.01em] nav-link-text text-black dark:text-white before:bg-black dark:before:bg-white">{{ "blog" | i18n({}, lang ) | safe }}</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<a href="https://github.com/simplex-chat/simplex-chat#please-support-us-with-your-donations"
|
||||
target="_blank" class="whitespace-nowrap flex items-center gap-1 self-center text-white dark:text-black text-[16px] font-medium tracking-[0.02em] rounded-[34px] bg-primary-light dark:bg-primary-dark py-3 lg:py-2 px-20 lg:px-5 mb-auto lg:mb-0"
|
||||
>{{ "donate" | i18n({}, lang ) | safe }}
|
||||
<li class="nav-link">
|
||||
<a href="javascript:void(0);">
|
||||
<span class="">{{ "guide" | i18n({}, lang ) | safe }}</span>
|
||||
<span href="" id="btn-mobile">
|
||||
<svg viewBox="0 0 10 6" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.50447 0.902966C1.21571 0.627397 0.747525 0.627397 0.458761 0.902966C0.169996 1.17853 0.169996 1.62532 0.458761 1.90089L4.21933 5.48961C4.25543 5.52406 4.29433 5.5542 4.33533 5.58003C4.62234 5.76088 5.01237 5.73074 5.26504 5.48961L9.02561 1.90089C9.31438 1.62532 9.31438 1.17853 9.02561 0.902966C8.73685 0.627397 8.26867 0.627397 7.97991 0.902966L4.74219 3.99273L1.50447 0.902966Z"/>
|
||||
</svg>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<div class="inline-block dark:hidden self-center mt-[8px]">
|
||||
<a class="github-button" href="https://github.com/simplex-chat/simplex-chat" data-size="large"
|
||||
data-show-count="true" aria-label="Star simplex-chat on GitHub">Star</a>
|
||||
</div>
|
||||
<ul class="sub-menu">
|
||||
{% for guide in guide_dropdown.items %}
|
||||
<li><a href="{{ guide.url | url }}" class="{{ "active" if page.url == guide.url | url else '' }}">{{ guide.title | i18n({}, lang ) | safe }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<div class="hidden dark:inline-block self-center mt-[8px]">
|
||||
<a class="github-button" href="https://github.com/simplex-chat/simplex-chat" data-size="large"
|
||||
data-color-scheme="no-preference: dark; light: dark; dark: dark;"
|
||||
data-show-count="true" aria-label="Star simplex-chat on GitHub">Star</a>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<hr>
|
||||
|
||||
<li class="nav-link">
|
||||
<a href="javascript:void(0);">
|
||||
<span class="">{{ "reference" | i18n({}, lang ) | safe }}</span>
|
||||
<span href="" id="btn-mobile">
|
||||
<svg viewBox="0 0 10 6" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.50447 0.902966C1.21571 0.627397 0.747525 0.627397 0.458761 0.902966C0.169996 1.17853 0.169996 1.62532 0.458761 1.90089L4.21933 5.48961C4.25543 5.52406 4.29433 5.5542 4.33533 5.58003C4.62234 5.76088 5.01237 5.73074 5.26504 5.48961L9.02561 1.90089C9.31438 1.62532 9.31438 1.17853 9.02561 0.902966C8.73685 0.627397 8.26867 0.627397 7.97991 0.902966L4.74219 3.99273L1.50447 0.902966Z"/>
|
||||
</svg>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<ul class="sub-menu">
|
||||
<li><a href="https://github.com/simplex-chat/simplexmq/blob/stable/protocol/overview-tjr.md"
|
||||
target="_blank">Whitepaper
|
||||
<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg>
|
||||
</a></li>
|
||||
<li><a href="/privacy">{{ "terms-and-privacy-policy" | i18n({}, lang ) | safe }}</a></li>
|
||||
<li><a href="https://github.com/simplex-chat/simplexmq/blob/stable/protocol/simplex-messaging.md"
|
||||
target="_blank">{{ "smp-protocol" | i18n({}, lang ) | safe }}
|
||||
<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg>
|
||||
</a></li>
|
||||
<li><a href="/docs/protocol/simplex-chat.html">{{ "chat-protocol" | i18n({}, lang ) | safe }}</a></li>
|
||||
<li><a href="/docs/glossary.html">{{ "glossary" | i18n({}, lang ) | safe }}</a></li>
|
||||
|
||||
<hr>
|
||||
|
||||
{% for doc in docs_dropdown.items %}
|
||||
<li><a href="{{ doc.url | url }}" class="{{ "active" if page.url == doc.url | url else '' }} lg:px-[20px] inline-block whitespace-nowrap">{{ doc.title | i18n({}, lang ) | safe }}</a></li>
|
||||
{% endfor %}
|
||||
|
||||
<hr>
|
||||
|
||||
<li><a href="/docs/translations.html"
|
||||
>{{ "docs-dropdown-7" | i18n({}, lang ) | safe }}
|
||||
</a></li>
|
||||
<li><a href="/docs/android.html"
|
||||
>{{ "docs-dropdown-2" | i18n({}, lang ) | safe }}
|
||||
</a></li>
|
||||
<li><a href="https://github.com/simplex-chat/simplex-chat/blob/stable/apps/simplex-bot-advanced/Main.hs"
|
||||
target="_blank">{{ "chat-bot-example" | i18n({}, lang ) | safe }}
|
||||
<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg>
|
||||
</a></li>
|
||||
<li><a href="https://github.com/simplex-chat/simplex-chat/tree/stable/packages/simplex-chat-client/typescript"
|
||||
target="_blank">TypeScript SDK
|
||||
<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg>
|
||||
</a></li>
|
||||
<li><a href="/docs/cli.html">{{ "terminal-cli" | i18n({}, lang ) | safe }}</a></li>
|
||||
<li><a href="https://github.com/simplex-chat/simplexmq"
|
||||
target="_blank">SimpleXMQ
|
||||
<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg>
|
||||
</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<hr>
|
||||
|
||||
<li class="nav-link {% if active_blog %}active{% endif %}">
|
||||
<a href="/blog">
|
||||
<span class="nav-link-text">{{ "blog" | i18n({}, lang ) | safe }}</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<div class="right-links">
|
||||
<button href="#" class="theme-switch-btn">
|
||||
<svg class="sun" width="469" height="469" viewBox="0 0 469 469" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M225.768 1.44594C220.301 3.84594 214.701 10.6459 213.768 15.9793C213.234 18.3793 213.101 31.7126 213.368 45.7126L213.768 71.1793L217.634 76.1126C226.701 88.1126 242.968 87.5793 252.301 75.0459C254.968 71.5793 255.101 69.5793 255.101 42.2459C255.101 14.9126 254.968 12.9126 252.301 9.44594C250.834 7.44594 248.034 4.51261 246.168 3.17928C241.768 -0.154057 231.101 -1.08739 225.768 1.44594Z"/>
|
||||
<path d="M72.9687 65.3128C63.7687 71.5794 60.1687 81.4461 63.7687 91.1794C65.502 95.4461 98.702 129.446 104.035 132.379C106.035 133.446 110.569 134.246 114.035 134.246C126.035 134.246 134.435 125.846 134.435 113.846C134.435 110.379 133.635 105.846 132.569 103.846C129.635 98.5128 95.6353 65.3128 91.3687 63.5794C85.102 61.3128 77.902 61.9794 72.9687 65.3128Z"/>
|
||||
<path d="M377.102 63.7128C373.102 65.3128 338.969 98.7794 336.302 103.846C335.236 105.846 334.436 110.379 334.436 113.846C334.436 125.846 342.836 134.246 354.836 134.246C358.302 134.246 362.836 133.446 364.836 132.379C370.169 129.446 403.369 95.4461 405.102 91.1794C408.702 81.4461 405.102 71.5794 395.902 65.3128C391.102 61.9794 383.102 61.3128 377.102 63.7128Z"/>
|
||||
<path d="M211.635 108.246C185.635 113.179 163.502 125.046 144.302 144.112C117.902 170.512 104.968 203.579 106.835 240.246C109.768 297.712 149.102 344.912 205.902 359.179C218.568 362.379 250.302 362.379 262.968 359.179C310.435 347.312 345.768 312.646 358.702 265.046C362.435 251.446 362.835 219.446 359.368 205.712C347.368 158.112 312.302 122.379 265.235 110.112C251.768 106.512 225.502 105.579 211.635 108.246Z"/>
|
||||
<path d="M12.4349 214.779C-0.498477 220.379 -4.09848 237.579 5.23486 248.246C11.2349 255.046 15.6349 255.846 45.3682 255.313C74.0349 254.913 75.1015 254.646 81.6349 245.713C85.9015 239.979 85.5015 228.113 80.8349 221.979C74.4349 213.713 71.2349 212.913 42.1682 212.913C23.7682 213.046 15.2349 213.579 12.4349 214.779Z"/>
|
||||
<path d="M396.035 215.179C393.635 216.379 390.035 219.445 388.035 221.979C383.368 228.112 382.968 239.979 387.235 245.712C394.035 254.779 394.301 254.912 426.435 254.912C458.568 254.912 458.835 254.779 465.635 245.712C469.501 240.512 469.501 227.979 465.635 222.779C458.968 213.845 458.301 213.579 428.035 213.179C404.435 212.912 399.768 213.179 396.035 215.179Z"/>
|
||||
<path d="M103.101 336.779C96.7013 340.779 65.368 373.179 63.768 377.313C57.368 394.513 74.168 411.313 91.368 404.913C95.6347 403.179 129.635 369.979 132.568 364.646C135.368 359.446 134.968 349.046 131.768 343.846C126.168 334.646 112.035 331.179 103.101 336.779Z"/>
|
||||
<path d="M344.035 336.912C341.635 338.379 338.569 341.445 337.102 343.845C333.902 349.045 333.502 359.445 336.302 364.645C339.235 369.979 373.235 403.179 377.502 404.912C387.235 408.512 397.102 404.912 403.369 395.712C406.702 390.779 407.369 383.579 405.102 377.312C403.369 373.045 370.169 339.045 364.835 336.112C359.635 333.312 349.235 333.712 344.035 336.912Z"/>
|
||||
<path d="M225.368 385.712C222.968 387.046 219.368 390.112 217.368 392.646L213.768 397.312V426.379C213.768 458.246 213.901 458.779 222.968 465.446C228.168 469.312 240.701 469.312 245.901 465.446C254.834 458.779 255.101 457.979 255.501 428.246C256.034 397.579 255.234 394.379 246.834 387.979C241.101 383.579 231.634 382.512 225.368 385.712Z"/>
|
||||
</svg>
|
||||
|
||||
<svg class="moon" width="469" height="469" viewBox="5 5 20 23" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10.895 7.574c0 7.55 5.179 13.67 11.567 13.67 1.588 0 3.101-0.38 4.479-1.063-1.695 4.46-5.996 7.636-11.051 7.636-6.533 0-11.83-5.297-11.83-11.83 0-4.82 2.888-8.959 7.023-10.803-0.116 0.778-0.188 1.573-0.188 2.39z"></path>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
{% if ('blog' not in page.url) and ('jobs' not in page.url) and ('about' not in page.url) and ('privacy' not in page.url) and ('directory' not in page.url) %}
|
||||
<div class="nav-link relative flag-container">
|
||||
<a href="javascript:void(0);" class="flex items-center justify-end ltr:ml-8 ltr:lg:ml-5 ltr:xl:ml-10 rtl:mr-8 rtl:lg:mr-5 rtl:xl:mr-10 h-6 w-8 whitespace-nowrap">
|
||||
<div class="nav-link flag-container">
|
||||
<a href="javascript:void(0);">
|
||||
{% for language in languages.languages %}
|
||||
{% if language.label == page.url | getlang %}
|
||||
{% if language.flag %}
|
||||
<img src="{{ language.flag }}" alt="" srcset="">
|
||||
{% else %}
|
||||
<div class="flex items-center justify-center" style="background-color:{{ language.iconBg }}; color:{{ language.textColor }}; width:32px; height:24px">
|
||||
<p style="text-align:center; font-size:9px">{{ language.iconText }}</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
<p style="text-align:center;">{{ language.label }}</p>
|
||||
<svg viewBox="0 0 10 6" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.50447 0.902966C1.21571 0.627397 0.747525 0.627397 0.458761 0.902966C0.169996 1.17853 0.169996 1.62532 0.458761 1.90089L4.21933 5.48961C4.25543 5.52406 4.29433 5.5542 4.33533 5.58003C4.62234 5.76088 5.01237 5.73074 5.26504 5.48961L9.02561 1.90089C9.31438 1.62532 9.31438 1.17853 9.02561 0.902966C8.73685 0.627397 8.26867 0.627397 7.97991 0.902966L4.74219 3.99273L1.50447 0.902966Z"/>
|
||||
</svg>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</a>
|
||||
|
||||
<ul class="flex flex-col items-start gap-2 h-fit absolute top-11 -left-10 bg-white dark:bg-black mt-[10px] py-4 min-w-[170px] rounded-md shadow-[0_0_3px_rgb(60_72_88_/_15%)] sub-menu overflow-auto">
|
||||
<ul class="sub-menu">
|
||||
{% if ("docs" in page.url) or ('downloads' in page.url) %}
|
||||
{% for supportedLang in supportedLangsForDoc %}
|
||||
{% for language in languages.languages %}
|
||||
{% if language.label == supportedLang %}
|
||||
<li>
|
||||
{% if language.flag %}
|
||||
<a href="{% completeRoute {url:page.url,lang:language.label} %}" class="px-[20px] flex items-center gap-4 flag-anchor whitespace-nowrap">
|
||||
<img class="h-4" src="{{ language.flag }}" alt="" srcset="">
|
||||
<a href="{% completeRoute {url:page.url,lang:language.label} %}" class="flag-anchor">
|
||||
<img src="{{ language.flag }}" alt="" srcset="">
|
||||
<p>{{ language.name }}</p>
|
||||
</a>
|
||||
{% else %}
|
||||
<a href="{% completeRoute {url:page.url,lang:language.label} %}" class="px-[20px] flex items-center gap-4 flag-anchor whitespace-nowrap">
|
||||
<div class="flex items-center justify-center" style="background-color:{{ language.iconBg }}; color:{{ language.textColor }}; width:21.33px; height:16px">
|
||||
<a href="{% completeRoute {url:page.url,lang:language.label} %}" class="flag-anchor">
|
||||
<div style="background-color:{{ language.iconBg }}; color:{{ language.textColor }}; width:21.33px; height:16px">
|
||||
<p style="text-align:center; font-size:7px">{{ language.iconText }}</p>
|
||||
</div>
|
||||
<p>{{ language.name }}</p>
|
||||
@@ -187,13 +170,13 @@
|
||||
{% if language.enabled %}
|
||||
<li>
|
||||
{% if language.flag %}
|
||||
<a href="{% completeRoute {url:page.url,lang:language.label} %}" class="px-[20px] flex items-center gap-4 flag-anchor whitespace-nowrap">
|
||||
<img class="h-4" src="{{ language.flag }}" alt="" srcset="">
|
||||
<a href="{% completeRoute {url:page.url,lang:language.label} %}" class="flag-anchor">
|
||||
<img src="{{ language.flag }}" alt="" srcset="">
|
||||
<p>{{ language.name }}</p>
|
||||
</a>
|
||||
{% else %}
|
||||
<a href="{% completeRoute {url:page.url,lang:language.label} %}" class="px-[20px] flex items-center gap-4 flag-anchor whitespace-nowrap">
|
||||
<div class="flex items-center justify-center" style="background-color:{{ language.iconBg }}; color:{{ language.textColor }}; width:21.33px; height:16px">
|
||||
<a href="{% completeRoute {url:page.url,lang:language.label} %}" class="flag-anchor">
|
||||
<div style="background-color:{{ language.iconBg }}; color:{{ language.textColor }}; width:21.33px; height:16px">
|
||||
<p style="text-align:center; font-size:7px">{{ language.iconText }}</p>
|
||||
</div>
|
||||
<p>{{ language.name }}</p>
|
||||
@@ -207,22 +190,28 @@
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<button href="#" class="flex items-center justify-center h-[36px] w-[36px] ltr:ml-8 ltr:lg:ml-4 ltr:xl:ml-8 rtl:mr-8 rtl:lg:mr-4 rtl:xl:mr-8 theme-switch-btn">
|
||||
<img src="/img/new/sun.svg" alt="" srcset="" class="sun">
|
||||
<img src="/img/new/moon.svg" alt="" srcset="" class="moon">
|
||||
</button>
|
||||
|
||||
<button href="" id="btn-mobile" class="flex lg:hidden items-center justify-center h-[36px] w-[36px] ltr:ml-8 ltr:lg:ml-5 ltr:xl:ml-10 rtl:mr-8 rtl:lg:mr-5 rtl:xl:mr-10 nav-toggle-btn">
|
||||
<img src="/img/new/hamburger.svg" id="hamburger" alt="" srcset="">
|
||||
<svg class="fill-black dark:fill-white hidden" id="cross" width="13" height="13" viewBox="0 0 13 13" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12.7973 11.5525L7.59762 6.49833L12.7947 1.44675C13.055 1.19371 13.0658 0.771991 12.8188 0.505331C12.5718 0.238674 12.1602 0.227644 11.8999 0.480681L6.65343 5.58028L1.09979 0.182228C0.839522 -0.070157 0.427909 -0.059127 0.18094 0.207531C-0.0660305 0.474191 -0.0552645 0.895911 0.205003 1.14894L5.70862 6.49833L0.20247 11.851C-0.0577975 12.104 -0.0685635 12.5257 0.178407 12.7924C0.306324 12.9306 0.477936 13 0.650181 13C0.811033 13 0.971873 12.9397 1.09726 12.817L6.65343 7.41639L11.9025 12.5186C12.0285 12.6406 12.1893 12.7015 12.3495 12.7015C12.5218 12.7015 12.6934 12.6321 12.8213 12.4939C13.0689 12.2273 13.0582 11.8062 12.7973 11.5525Z" />
|
||||
</svg>
|
||||
<button id="cross-btn" class="nav-toggle-btn">
|
||||
<svg id="cross" viewBox="0 0 13 13" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12.7973 11.5525L7.59762 6.49833L12.7947 1.44675C13.055 1.19371 13.0658 0.771991 12.8188 0.505331C12.5718 0.238674 12.1602 0.227644 11.8999 0.480681L6.65343 5.58028L1.09979 0.182228C0.839522 -0.070157 0.427909 -0.059127 0.18094 0.207531C-0.0660305 0.474191 -0.0552645 0.895911 0.205003 1.14894L5.70862 6.49833L0.20247 11.851C-0.0577975 12.104 -0.0685635 12.5257 0.178407 12.7924C0.306324 12.9306 0.477936 13 0.650181 13C0.811033 13 0.971873 12.9397 1.09726 12.817L6.65343 7.41639L11.9025 12.5186C12.0285 12.6406 12.1893 12.7015 12.3495 12.7015C12.5218 12.7015 12.6934 12.6321 12.8213 12.4939C13.0689 12.2273 13.0582 11.8062 12.7973 11.5525Z" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</header>
|
||||
<div id="mobile-header">
|
||||
<a href="/{{ '' if lang == 'en' else lang }}" class="logo flex dark:hidden ltr:mr-auto rtl:ml-auto"><img src="/img/new/logo-symbol-light.svg" alt="" srcset=""></a>
|
||||
<a href="/{{ '' if lang == 'en' else lang }}" class="logo hidden dark:flex ltr:mr-auto rtl:ml-auto"><img src="/img/new/logo-symbol-dark.svg" alt="" srcset=""></a>
|
||||
|
||||
<button id="hamburger" class="nav-toggle-btn">
|
||||
<svg viewBox="0 0 100 80" width="36" height="36">
|
||||
<rect width="100" height="15"></rect>
|
||||
<rect y="30" width="100" height="15"></rect>
|
||||
<rect y="60" width="100" height="15"></rect>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
||||
<SCript>
|
||||
<script>
|
||||
// switch theme
|
||||
const sunIcon = document.querySelector('.sun');
|
||||
const moonIcon = document.querySelector('.moon');
|
||||
@@ -251,6 +240,7 @@ const themeCheck = () => {
|
||||
}
|
||||
}
|
||||
}
|
||||
themeCheck();
|
||||
|
||||
const themeSwitch = () => {
|
||||
if(document.documentElement.classList.contains('dark')){
|
||||
@@ -271,7 +261,8 @@ const themeSwitch = () => {
|
||||
}
|
||||
}
|
||||
|
||||
const nav = document.querySelector('header nav');
|
||||
const nav = document.querySelector('header#navbar');
|
||||
|
||||
window.addEventListener('click',(e)=>{
|
||||
if(e.target.closest('.nav-link')){
|
||||
if(e.target.closest('.nav-link').classList.contains('active')){
|
||||
@@ -286,34 +277,13 @@ window.addEventListener('click',(e)=>{
|
||||
document.body.classList.toggle('lock-scroll');
|
||||
if(nav.classList.contains('open')){
|
||||
nav.classList.remove('open');
|
||||
document.getElementById('hamburger').classList.remove('hidden');
|
||||
document.getElementById('cross').classList.add('hidden');
|
||||
}
|
||||
else{
|
||||
nav.classList.add('open');
|
||||
document.getElementById('hamburger').classList.add('hidden');
|
||||
document.getElementById('cross').classList.remove('hidden');
|
||||
}
|
||||
}
|
||||
else if(e.target.closest('.theme-switch-btn')){
|
||||
themeSwitch();
|
||||
}
|
||||
})
|
||||
|
||||
themeCheck();
|
||||
|
||||
const changeHeaderBg = ()=>{
|
||||
const header = document.querySelector('header')
|
||||
const scrollValue = window.scrollY
|
||||
if(scrollValue > 5){
|
||||
header.classList.add('bg-primary-bg-light');
|
||||
header.classList.add('dark:bg-primary-bg-dark');
|
||||
}
|
||||
else{
|
||||
header.classList.remove('bg-primary-bg-light');
|
||||
header.classList.remove('dark:bg-primary-bg-dark');
|
||||
}
|
||||
}
|
||||
|
||||
window.addEventListener('scroll',changeHeaderBg);
|
||||
</SCript>
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,541 @@
|
||||
:root {
|
||||
--nav-color: #001796;
|
||||
}
|
||||
|
||||
:root.dark {
|
||||
--nav-color: #ffffff;
|
||||
}
|
||||
|
||||
body.change-nav-color {
|
||||
--nav-color: #001796;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 950px) {
|
||||
.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: 16px;
|
||||
height: 100%;
|
||||
/* display: flex; */
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
header#navbar>a.logo img {
|
||||
height: 32px;
|
||||
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: 49px;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
header#navbar ul a {
|
||||
font-family: "Manrope", "GT-Walsheim", 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;
|
||||
}
|
||||
|
||||
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: 950px) {
|
||||
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;
|
||||
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;
|
||||
}
|
||||
|
||||
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: 950px) {
|
||||
.flag-container>a {
|
||||
color: var(--nav-color) !important;
|
||||
}
|
||||
|
||||
.flag-container>a svg {
|
||||
fill: var(--nav-color) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.flag-container>a p {
|
||||
font-size: 17px;
|
||||
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: 18px;
|
||||
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: 950px) {
|
||||
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: 16px;
|
||||
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: 949px) {
|
||||
#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;
|
||||
}
|
||||
}
|
||||
+203
-653
File diff suppressed because it is too large
Load Diff
+12
-18
@@ -368,7 +368,7 @@ a{
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.menu-link{
|
||||
/* .menu-link{
|
||||
font-size: 16px;
|
||||
line-height: 33.42px;
|
||||
color: #0D0E12;
|
||||
@@ -402,7 +402,6 @@ a{
|
||||
height: 1px;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
/* background-color: initial; */
|
||||
transition: width 0.25s ease-out;
|
||||
}
|
||||
|
||||
@@ -462,16 +461,6 @@ header nav {
|
||||
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,
|
||||
@@ -514,7 +503,7 @@ header nav {
|
||||
.flag-container .sub-menu{
|
||||
max-height: fit-content;
|
||||
}
|
||||
}
|
||||
} */
|
||||
|
||||
.lock-scroll {
|
||||
overflow: hidden;
|
||||
@@ -687,30 +676,35 @@ header nav {
|
||||
|
||||
|
||||
/* comparison */
|
||||
#comparison table thead th{
|
||||
#comparison table thead th,
|
||||
#how-secure-comparison table thead th{
|
||||
font-size: 16px;
|
||||
line-height: 36px;
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
}
|
||||
#comparison table tbody td{
|
||||
#comparison table tbody td,
|
||||
#how-secure-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,
|
||||
#how-secure-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"] #how-secure-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,
|
||||
#how-secure-comparison table tbody tr > td:first-child{
|
||||
font-size: 18px;
|
||||
line-height: 36px;
|
||||
}
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 846 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 534 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 231 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 420 KiB |
@@ -0,0 +1,11 @@
|
||||
<svg width="200" height="200" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||
<!-- Checkmark stroke with painted style -->
|
||||
<path
|
||||
d="M 35 100 L 42 108 L 50 118 L 58 128 L 68 138 L 75 145 L 80 148 L 85 145 L 95 135 L 110 115 L 125 95 L 140 75 L 155 55 L 165 42 L 170 35"
|
||||
stroke="#4CAF50" stroke-width="24" stroke-linecap="round" stroke-linejoin="round" fill="none" />
|
||||
|
||||
<!-- Darker overlay for depth -->
|
||||
<path
|
||||
d="M 35 100 L 42 108 L 50 118 L 58 128 L 68 138 L 75 145 L 80 148 L 85 145 L 95 135 L 110 115 L 125 95 L 140 75 L 155 55 L 165 42 L 170 35"
|
||||
stroke="#388E3C" stroke-width="20" stroke-linecap="round" stroke-linejoin="round" fill="none" opacity="0.6" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 722 B |
@@ -0,0 +1,9 @@
|
||||
<svg width="200" height="200" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||
<!-- First stroke of X -->
|
||||
<path d="M 40 40 Q 50 45 100 100 Q 150 155 160 160" stroke="#E63946" stroke-width="28" stroke-linecap="round"
|
||||
stroke-linejoin="round" fill="none" />
|
||||
|
||||
<!-- Second stroke of X -->
|
||||
<path d="M 160 40 Q 150 45 100 100 Q 50 155 40 160" stroke="#E63946" stroke-width="28" stroke-linecap="round"
|
||||
stroke-linejoin="round" fill="none" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 480 B |
Binary file not shown.
|
Before Width: | Height: | Size: 398 KiB After Width: | Height: | Size: 405 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 220 KiB After Width: | Height: | Size: 372 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 249 KiB After Width: | Height: | Size: 367 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 189 KiB After Width: | Height: | Size: 348 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 196 KiB After Width: | Height: | Size: 204 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 121 KiB After Width: | Height: | Size: 203 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 138 KiB After Width: | Height: | Size: 151 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 132 KiB After Width: | Height: | Size: 150 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 210 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 91 KiB After Width: | Height: | Size: 202 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 173 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 81 KiB After Width: | Height: | Size: 159 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 206 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 149 KiB After Width: | Height: | Size: 202 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 164 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 113 KiB After Width: | Height: | Size: 160 KiB |
@@ -0,0 +1,11 @@
|
||||
<svg width="200" height="200" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
||||
<!-- Checkmark stroke with painted style -->
|
||||
<path
|
||||
d="M 35 100 L 42 108 L 50 118 L 58 128 L 68 138 L 75 145 L 80 148 L 85 145 L 95 135 L 110 115 L 125 95 L 140 75 L 155 55 L 165 42 L 170 35"
|
||||
stroke="#F4C430" stroke-width="24" stroke-linecap="round" stroke-linejoin="round" fill="none" />
|
||||
|
||||
<!-- Darker overlay for depth -->
|
||||
<path
|
||||
d="M 35 100 L 42 108 L 50 118 L 58 128 L 68 138 L 75 145 L 80 148 L 85 145 L 95 135 L 110 115 L 125 95 L 140 75 L 155 55 L 165 42 L 170 35"
|
||||
stroke="#E6B800" stroke-width="20" stroke-linecap="round" stroke-linejoin="round" fill="none" opacity="0.6" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 722 B |
@@ -0,0 +1,4 @@
|
||||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10.8571 0.000366211C9.23419 0.000366211 7.89624 1.36167 7.89624 3.01292V6.84241H15.19V3.01292C15.19 1.36167 13.8683 0.000366211 12.2454 0.000366211H10.8571ZM27.0846 0.000366211C25.4617 0.000366211 24.1237 1.36167 24.1237 3.01292V23.3532H31.4175V3.01292C31.4175 1.36167 30.0958 0.000366211 28.4729 0.000366211H27.0846ZM7.89624 16.6466V36.9869C7.89624 38.6382 9.21795 39.9995 10.8571 39.9995H12.2454C13.8683 39.9995 15.2062 38.6382 15.2062 36.9869V16.6466H7.89624ZM24.1229 33.1574V36.9869C24.1229 38.6382 25.4617 39.9995 27.0838 39.9995H28.4721C30.095 39.9995 31.4329 38.6382 31.4329 36.9869V33.1574C31.4338 33.1574 24.1229 33.1574 24.1229 33.1574Z" fill="#74B816"/>
|
||||
<path d="M2.96092 8.03357C1.33801 8.03357 6.10352e-05 9.37835 6.10352e-05 11.0461V12.4586C6.10352e-05 14.1099 1.32177 15.4712 2.96092 15.4712H22.9522V8.03357H2.96092ZM32.5882 8.03357V15.472H36.352C37.9749 15.472 39.3129 14.1272 39.3129 12.4595V11.0469C39.3129 9.37918 37.9749 8.0344 36.352 8.0344H32.5882V8.03357ZM2.96092 24.5444C1.33801 24.5444 6.10352e-05 25.8891 6.10352e-05 27.5569V28.9694C6.10352e-05 30.6207 1.32177 31.982 2.96092 31.982H6.72472V24.5444H2.96092ZM16.3607 24.5444V31.9828H36.352C37.9749 31.9828 39.3129 30.6207 39.3129 28.9702V27.5577C39.3129 25.89 37.9749 24.5452 36.352 24.5452L16.3607 24.5444Z" fill="#82C91E"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 51 KiB |
@@ -0,0 +1,14 @@
|
||||
<svg fill="none" height="32" viewBox="0 0 32 32" width="32" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1093_84885-720778)">
|
||||
<path clip-rule="evenodd" d="M16 32C24.8365 32 32 24.8365 32 16C32 7.16346 24.8365 0 16 0C7.16346 0 0 7.16346 0 16C0 24.8365 7.16346 32 16 32Z" fill="#0DBD8B" fill-rule="evenodd"></path>
|
||||
<path clip-rule="evenodd" d="M13.0781 7.45456C13.0781 6.8087 13.6028 6.28516 14.25 6.28516C18.6364 6.28516 22.1923 9.83367 22.1923 14.211C22.1923 14.8568 21.6676 15.3804 21.0205 15.3804C20.3733 15.3804 19.8486 14.8568 19.8486 14.211C19.8486 11.1254 17.342 8.62396 14.25 8.62396C13.6028 8.62396 13.0781 8.10039 13.0781 7.45456Z" fill="white" fill-rule="evenodd"></path>
|
||||
<path clip-rule="evenodd" d="M24.5439 13.043C25.1911 13.043 25.7157 13.5665 25.7157 14.2124C25.7157 18.5897 22.1598 22.1382 17.7734 22.1382C17.1262 22.1382 16.6016 21.6147 16.6016 20.9688C16.6016 20.323 17.1262 19.7994 17.7734 19.7994C20.8655 19.7994 23.3721 17.298 23.3721 14.2124C23.3721 13.5665 23.8967 13.043 24.5439 13.043Z" fill="white" fill-rule="evenodd"></path>
|
||||
<path clip-rule="evenodd" d="M18.9423 24.543C18.9423 25.1889 18.4176 25.7124 17.7705 25.7124C13.384 25.7124 9.82812 22.1639 9.82812 17.7866C9.82812 17.1407 10.3528 16.6172 11 16.6172C11.6471 16.6172 12.1718 17.1407 12.1718 17.7866C12.1718 20.8722 14.6784 23.3736 17.7705 23.3736C18.4176 23.3736 18.9423 23.8972 18.9423 24.543Z" fill="white" fill-rule="evenodd"></path>
|
||||
<path clip-rule="evenodd" d="M7.46086 18.9585C6.81369 18.9585 6.28906 18.435 6.28906 17.7891C6.28903 13.4118 9.84495 9.86328 14.2314 9.86328C14.8786 9.86328 15.4032 10.3869 15.4032 11.0327C15.4032 11.6785 14.8786 12.2021 14.2314 12.2021C11.1393 12.2021 8.63269 14.7035 8.63269 17.7891C8.63269 18.435 8.10806 18.9585 7.46086 18.9585Z" fill="white" fill-rule="evenodd"></path>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_1093_84885-720778">
|
||||
<rect fill="currentColor" height="32" width="32"></rect>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.9 KiB |
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 200 200"><path fill="#00f782" d="M150.7 100.7 113.3 80h25.3a40 40 0 0 0 0-80H50.1A50.2 50.2 0 0 0 0 50.1a54.2 54.2 0 0 0 28 47.4l37.3 20.8H40a40 40 0 0 0 0 80h88.5a50.2 50.2 0 0 0 50.1-50.2 54.2 54.2 0 0 0-27.9-47.4zm-116.8-14A41.9 41.9 0 0 1 12.4 51 38.5 38.5 0 0 1 51 12.4h86.8a28.1 28.1 0 0 1 28.4 26.2c.8 15.9-11.9 29-27.5 29h-50a5.6 5.6 0 0 0-5.6 5.6V114L34 86.7zm93.7 99.1H40.8a28.1 28.1 0 0 1-28.4-26.2 27.6 27.6 0 0 1 27.6-29h50c3 0 5.5-2.4 5.5-5.5V84.3l49.2 27.3a41.9 41.9 0 0 1 21.5 35.5 38.5 38.5 0 0 1-38.6 38.7z"/></svg>
|
||||
|
After Width: | Height: | Size: 607 B |
Binary file not shown.
|
After Width: | Height: | Size: 6.7 KiB |
+38
-270
@@ -1,12 +1,43 @@
|
||||
---
|
||||
title: "SimpleX Chat: private and secure messenger without any user IDs (not even random)"
|
||||
description: "SimpleX Chat - a private and encrypted messenger without any user IDs (not even random ones)! Make a private connection via link / QR code to send messages and make calls."
|
||||
templateEngineOverride: njk
|
||||
active_home: true
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html lang="{{ page.url | getlang }}"
|
||||
{% for language in languages.languages %}
|
||||
{% if language.label == page.url | getlang %}
|
||||
dir="{{ "rtl" if language.rtl else "ltr" }}"
|
||||
{% endif %}
|
||||
{% endfor %}>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
|
||||
<title>Simplex Chat</title>
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
|
||||
<meta name="theme-color" content="transparent">
|
||||
<title>{{ title }}</title>
|
||||
<meta name="description" content="{{ description }}"/>
|
||||
<meta name="Content-Type" content="text/html;charset=utf-8"/>
|
||||
{% if path %}
|
||||
<meta http-equiv="onion-location" content="{% cfg 'onionLocation' %}{{ path }}" />
|
||||
<meta property="og:url" content="{% cfg 'siteLocation' %}{{ path }}" />
|
||||
{% else %}
|
||||
<meta http-equiv="onion-location" content="{% cfg 'onionLocation' %}/" />
|
||||
<meta property="og:url" content="{% cfg 'siteLocation' %}/" />
|
||||
{% endif %}
|
||||
<meta property="og:type" content="website"/>
|
||||
<meta property="og:title" content="{{ title }}"/>
|
||||
<meta property="og:description" content="{{ description }}"/>
|
||||
<meta property="og:image" content="{% cfg 'siteLocation' %}/img/share_simplex.png"/>
|
||||
<meta name="twitter:card" content="summary"/>
|
||||
<link rel="icon" type="image/png" sizes="96x96" href="/img/favicon.ico"/>
|
||||
|
||||
<link href="/css/tailwind.css" rel="stylesheet"/>
|
||||
<link rel="stylesheet" href="/css/design3.css">
|
||||
<link rel="stylesheet" href="/css/design3-nav.css">
|
||||
<script src="/js/flag-anchor.js"></script>
|
||||
<script>
|
||||
function detectMobileBrowser() {
|
||||
@@ -31,183 +62,7 @@
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header id="navbar">
|
||||
<a href="/{{ '' if lang == 'en' else lang }}" class="logo flex dark:hidden ltr:mr-auto rtl:ml-auto"><img src="/img/new/logo-light.png" alt="logo" /></a>
|
||||
<a href="/{{ '' if lang == 'en' else lang }}" class="logo hidden dark:flex ltr:mr-auto rtl:ml-auto"><img src="/img/new/logo-dark.png" alt="logo" /></a>
|
||||
|
||||
<nav id="menu">
|
||||
<ul>
|
||||
<li class="nav-link">
|
||||
<a href="/{{ '' if lang == 'en' else lang }}">
|
||||
<span class="nav-link-text">{{ "home" | i18n({}, lang ) | safe }}</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<hr>
|
||||
|
||||
<li class="nav-link">
|
||||
<a href="/directory/">
|
||||
<span class="nav-link-text">{{ "directory" | i18n({}, lang ) | safe }}</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<hr>
|
||||
|
||||
<li class="nav-link">
|
||||
<a href="javascript:void(0);">
|
||||
<span class="">{{ "guide" | i18n({}, lang ) | safe }}</span>
|
||||
<span href="" id="btn-mobile">
|
||||
<svg viewBox="0 0 10 6" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.50447 0.902966C1.21571 0.627397 0.747525 0.627397 0.458761 0.902966C0.169996 1.17853 0.169996 1.62532 0.458761 1.90089L4.21933 5.48961C4.25543 5.52406 4.29433 5.5542 4.33533 5.58003C4.62234 5.76088 5.01237 5.73074 5.26504 5.48961L9.02561 1.90089C9.31438 1.62532 9.31438 1.17853 9.02561 0.902966C8.73685 0.627397 8.26867 0.627397 7.97991 0.902966L4.74219 3.99273L1.50447 0.902966Z"/>
|
||||
</svg>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<ul class="sub-menu">
|
||||
{% for guide in guide_dropdown.items %}
|
||||
<li><a href="{{ guide.url | url }}" class="{{ "active" if page.url == guide.url | url else '' }}">{{ guide.title | i18n({}, lang ) | safe }}</a></li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<hr>
|
||||
|
||||
<li class="nav-link">
|
||||
<a href="javascript:void(0);">
|
||||
<span class="">{{ "reference" | i18n({}, lang ) | safe }}</span>
|
||||
<span href="" id="btn-mobile">
|
||||
<svg viewBox="0 0 10 6" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.50447 0.902966C1.21571 0.627397 0.747525 0.627397 0.458761 0.902966C0.169996 1.17853 0.169996 1.62532 0.458761 1.90089L4.21933 5.48961C4.25543 5.52406 4.29433 5.5542 4.33533 5.58003C4.62234 5.76088 5.01237 5.73074 5.26504 5.48961L9.02561 1.90089C9.31438 1.62532 9.31438 1.17853 9.02561 0.902966C8.73685 0.627397 8.26867 0.627397 7.97991 0.902966L4.74219 3.99273L1.50447 0.902966Z"/>
|
||||
</svg>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<ul class="sub-menu">
|
||||
<li><a href="https://github.com/simplex-chat/simplexmq/blob/stable/protocol/overview-tjr.md"
|
||||
target="_blank">Whitepaper
|
||||
<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg>
|
||||
</a></li>
|
||||
<li><a href="/privacy">{{ "terms-and-privacy-policy" | i18n({}, lang ) | safe }}</a></li>
|
||||
<li><a href="https://github.com/simplex-chat/simplexmq/blob/stable/protocol/simplex-messaging.md"
|
||||
target="_blank">{{ "smp-protocol" | i18n({}, lang ) | safe }}
|
||||
<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg>
|
||||
</a></li>
|
||||
<li><a href="/docs/protocol/simplex-chat.html">{{ "chat-protocol" | i18n({}, lang ) | safe }}</a></li>
|
||||
<li><a href="/docs/glossary.html">{{ "glossary" | i18n({}, lang ) | safe }}</a></li>
|
||||
|
||||
<hr>
|
||||
|
||||
{% for doc in docs_dropdown.items %}
|
||||
<li><a href="{{ doc.url | url }}" class="{{ "active" if page.url == doc.url | url else '' }} lg:px-[20px] inline-block whitespace-nowrap">{{ doc.title | i18n({}, lang ) | safe }}</a></li>
|
||||
{% endfor %}
|
||||
|
||||
<hr>
|
||||
|
||||
<li><a href="/docs/translations.html"
|
||||
>{{ "docs-dropdown-7" | i18n({}, lang ) | safe }}
|
||||
</a></li>
|
||||
<li><a href="/docs/android.html"
|
||||
>{{ "docs-dropdown-2" | i18n({}, lang ) | safe }}
|
||||
</a></li>
|
||||
<li><a href="https://github.com/simplex-chat/simplex-chat/blob/stable/apps/simplex-bot-advanced/Main.hs"
|
||||
target="_blank">{{ "chat-bot-example" | i18n({}, lang ) | safe }}
|
||||
<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg>
|
||||
</a></li>
|
||||
<li><a href="https://github.com/simplex-chat/simplex-chat/tree/stable/packages/simplex-chat-client/typescript"
|
||||
target="_blank">TypeScript SDK
|
||||
<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg>
|
||||
</a></li>
|
||||
<li><a href="/docs/cli.html">{{ "terminal-cli" | i18n({}, lang ) | safe }}</a></li>
|
||||
<li><a href="https://github.com/simplex-chat/simplexmq"
|
||||
target="_blank">SimpleXMQ
|
||||
<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg>
|
||||
</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<hr>
|
||||
|
||||
<li class="nav-link">
|
||||
<a href="/blog">
|
||||
<span class="nav-link-text">{{ "blog" | i18n({}, lang ) | safe }}</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<div class="right-links">
|
||||
<button href="#" class="theme-switch-btn">
|
||||
<svg class="sun" width="469" height="469" viewBox="0 0 469 469" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M225.768 1.44594C220.301 3.84594 214.701 10.6459 213.768 15.9793C213.234 18.3793 213.101 31.7126 213.368 45.7126L213.768 71.1793L217.634 76.1126C226.701 88.1126 242.968 87.5793 252.301 75.0459C254.968 71.5793 255.101 69.5793 255.101 42.2459C255.101 14.9126 254.968 12.9126 252.301 9.44594C250.834 7.44594 248.034 4.51261 246.168 3.17928C241.768 -0.154057 231.101 -1.08739 225.768 1.44594Z"/>
|
||||
<path d="M72.9687 65.3128C63.7687 71.5794 60.1687 81.4461 63.7687 91.1794C65.502 95.4461 98.702 129.446 104.035 132.379C106.035 133.446 110.569 134.246 114.035 134.246C126.035 134.246 134.435 125.846 134.435 113.846C134.435 110.379 133.635 105.846 132.569 103.846C129.635 98.5128 95.6353 65.3128 91.3687 63.5794C85.102 61.3128 77.902 61.9794 72.9687 65.3128Z"/>
|
||||
<path d="M377.102 63.7128C373.102 65.3128 338.969 98.7794 336.302 103.846C335.236 105.846 334.436 110.379 334.436 113.846C334.436 125.846 342.836 134.246 354.836 134.246C358.302 134.246 362.836 133.446 364.836 132.379C370.169 129.446 403.369 95.4461 405.102 91.1794C408.702 81.4461 405.102 71.5794 395.902 65.3128C391.102 61.9794 383.102 61.3128 377.102 63.7128Z"/>
|
||||
<path d="M211.635 108.246C185.635 113.179 163.502 125.046 144.302 144.112C117.902 170.512 104.968 203.579 106.835 240.246C109.768 297.712 149.102 344.912 205.902 359.179C218.568 362.379 250.302 362.379 262.968 359.179C310.435 347.312 345.768 312.646 358.702 265.046C362.435 251.446 362.835 219.446 359.368 205.712C347.368 158.112 312.302 122.379 265.235 110.112C251.768 106.512 225.502 105.579 211.635 108.246Z"/>
|
||||
<path d="M12.4349 214.779C-0.498477 220.379 -4.09848 237.579 5.23486 248.246C11.2349 255.046 15.6349 255.846 45.3682 255.313C74.0349 254.913 75.1015 254.646 81.6349 245.713C85.9015 239.979 85.5015 228.113 80.8349 221.979C74.4349 213.713 71.2349 212.913 42.1682 212.913C23.7682 213.046 15.2349 213.579 12.4349 214.779Z"/>
|
||||
<path d="M396.035 215.179C393.635 216.379 390.035 219.445 388.035 221.979C383.368 228.112 382.968 239.979 387.235 245.712C394.035 254.779 394.301 254.912 426.435 254.912C458.568 254.912 458.835 254.779 465.635 245.712C469.501 240.512 469.501 227.979 465.635 222.779C458.968 213.845 458.301 213.579 428.035 213.179C404.435 212.912 399.768 213.179 396.035 215.179Z"/>
|
||||
<path d="M103.101 336.779C96.7013 340.779 65.368 373.179 63.768 377.313C57.368 394.513 74.168 411.313 91.368 404.913C95.6347 403.179 129.635 369.979 132.568 364.646C135.368 359.446 134.968 349.046 131.768 343.846C126.168 334.646 112.035 331.179 103.101 336.779Z"/>
|
||||
<path d="M344.035 336.912C341.635 338.379 338.569 341.445 337.102 343.845C333.902 349.045 333.502 359.445 336.302 364.645C339.235 369.979 373.235 403.179 377.502 404.912C387.235 408.512 397.102 404.912 403.369 395.712C406.702 390.779 407.369 383.579 405.102 377.312C403.369 373.045 370.169 339.045 364.835 336.112C359.635 333.312 349.235 333.712 344.035 336.912Z"/>
|
||||
<path d="M225.368 385.712C222.968 387.046 219.368 390.112 217.368 392.646L213.768 397.312V426.379C213.768 458.246 213.901 458.779 222.968 465.446C228.168 469.312 240.701 469.312 245.901 465.446C254.834 458.779 255.101 457.979 255.501 428.246C256.034 397.579 255.234 394.379 246.834 387.979C241.101 383.579 231.634 382.512 225.368 385.712Z"/>
|
||||
</svg>
|
||||
|
||||
<svg class="moon" width="469" height="469" viewBox="5 5 20 23" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10.895 7.574c0 7.55 5.179 13.67 11.567 13.67 1.588 0 3.101-0.38 4.479-1.063-1.695 4.46-5.996 7.636-11.051 7.636-6.533 0-11.83-5.297-11.83-11.83 0-4.82 2.888-8.959 7.023-10.803-0.116 0.778-0.188 1.573-0.188 2.39z"></path>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<div class="nav-link flag-container">
|
||||
<a href="javascript:void(0);">
|
||||
{% for language in languages.languages %}
|
||||
{% if language.label == page.url | getlang %}
|
||||
<p style="text-align:center;">{{ language.label }}</p>
|
||||
<svg viewBox="0 0 10 6" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.50447 0.902966C1.21571 0.627397 0.747525 0.627397 0.458761 0.902966C0.169996 1.17853 0.169996 1.62532 0.458761 1.90089L4.21933 5.48961C4.25543 5.52406 4.29433 5.5542 4.33533 5.58003C4.62234 5.76088 5.01237 5.73074 5.26504 5.48961L9.02561 1.90089C9.31438 1.62532 9.31438 1.17853 9.02561 0.902966C8.73685 0.627397 8.26867 0.627397 7.97991 0.902966L4.74219 3.99273L1.50447 0.902966Z"/>
|
||||
</svg>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</a>
|
||||
|
||||
<ul class="sub-menu">
|
||||
{% for language in languages.languages %}
|
||||
{% if language.enabled %}
|
||||
<li>
|
||||
{% if language.flag %}
|
||||
<a href="{% completeRoute {url:page.url,lang:language.label} %}" class="flag-anchor">
|
||||
<img src="{{ language.flag }}" alt="" srcset="">
|
||||
<p>{{ language.name }}</p>
|
||||
</a>
|
||||
{% else %}
|
||||
<a href="{% completeRoute {url:page.url,lang:language.label} %}" class="flag-anchor">
|
||||
<div style="background-color:{{ language.iconBg }}; color:{{ language.textColor }}; width:21.33px; height:16px">
|
||||
<p style="text-align:center; font-size:7px">{{ language.iconText }}</p>
|
||||
</div>
|
||||
<p>{{ language.name }}</p>
|
||||
</a>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<button id="cross-btn" class="nav-toggle-btn">
|
||||
<svg id="cross" viewBox="0 0 13 13" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12.7973 11.5525L7.59762 6.49833L12.7947 1.44675C13.055 1.19371 13.0658 0.771991 12.8188 0.505331C12.5718 0.238674 12.1602 0.227644 11.8999 0.480681L6.65343 5.58028L1.09979 0.182228C0.839522 -0.070157 0.427909 -0.059127 0.18094 0.207531C-0.0660305 0.474191 -0.0552645 0.895911 0.205003 1.14894L5.70862 6.49833L0.20247 11.851C-0.0577975 12.104 -0.0685635 12.5257 0.178407 12.7924C0.306324 12.9306 0.477936 13 0.650181 13C0.811033 13 0.971873 12.9397 1.09726 12.817L6.65343 7.41639L11.9025 12.5186C12.0285 12.6406 12.1893 12.7015 12.3495 12.7015C12.5218 12.7015 12.6934 12.6321 12.8213 12.4939C13.0689 12.2273 13.0582 11.8062 12.7973 11.5525Z" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</header>
|
||||
<div id="mobile-header">
|
||||
<a href="/{{ '' if lang == 'en' else lang }}" class="logo flex dark:hidden ltr:mr-auto rtl:ml-auto"><img src="/img/new/logo-symbol-light.svg" alt="" srcset=""></a>
|
||||
<a href="/{{ '' if lang == 'en' else lang }}" class="logo hidden dark:flex ltr:mr-auto rtl:ml-auto"><img src="/img/new/logo-symbol-dark.svg" alt="" srcset=""></a>
|
||||
|
||||
<button id="hamburger" class="nav-toggle-btn">
|
||||
<svg viewBox="0 0 100 80" width="36" height="36">
|
||||
<rect width="100" height="15"></rect>
|
||||
<rect y="30" width="100" height="15"></rect>
|
||||
<rect y="60" width="100" height="15"></rect>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
{% include "navbar.html" %}
|
||||
|
||||
<div class="screen">
|
||||
<section class="page-1 cover page">
|
||||
@@ -232,7 +87,6 @@
|
||||
|
||||
<section class="page-2 page">
|
||||
<div class="area">
|
||||
<div class="image"></div>
|
||||
<div class="text-container">
|
||||
<h2>World's Most Secure Messaging</h2>
|
||||
<p>SimpleX messaging has cutting-edge end-to-end encryption.</p>
|
||||
@@ -244,7 +98,6 @@
|
||||
|
||||
<section class="page-3 page">
|
||||
<div class="area">
|
||||
<div class="image"></div>
|
||||
<div class="text-container">
|
||||
<h2>You Own<br>The Next Web</h2>
|
||||
<p>SimpleX is founded on the belief that <span>you must own your identity, contacts and communities.</span></p>
|
||||
@@ -255,7 +108,6 @@
|
||||
|
||||
<section class="page-4 page">
|
||||
<div class="area">
|
||||
<div class="image"></div>
|
||||
<div class="text-container">
|
||||
<h2>Communities That Last</h2>
|
||||
<p>You will support your favorite groups with future Community vouchers.</p>
|
||||
@@ -267,7 +119,6 @@
|
||||
|
||||
<section class="page-5 page">
|
||||
<div class="area">
|
||||
<div class="image"></div>
|
||||
<div class="text-container">
|
||||
<h2>SimpleX Roadmap to Free Internet</h2>
|
||||
<div class="roadmap">
|
||||
@@ -305,7 +156,8 @@
|
||||
<a href="/directory" class="group-image" target="_blank"><img src="/img/group.svg"></a>
|
||||
<a href="/directory" class="group-image" target="_blank"><img src="/img/group.svg"></a>
|
||||
<a href="https://smp4.simplex.im/g#hr4lvFeBmndWMKTwqiodPz3VBo_6UmdGWocXd1SupsM" class="simplex-image" title="SimpleX users group" target="_blank">
|
||||
<img src="/img/new/logo-symbol-dark.svg">
|
||||
<img class="block dark:hidden" src="/img/new/logo-symbol-light.svg">
|
||||
<img class="hidden dark:block" src="/img/new/logo-symbol-dark.svg">
|
||||
</a>
|
||||
<a href="/directory" class="group-image" target="_blank"><img src="/img/group.svg"></a>
|
||||
<a href="/directory" class="group-image" target="_blank"><img src="/img/group.svg"></a>
|
||||
@@ -340,18 +192,8 @@
|
||||
<script src="/js/directory.js"></script>
|
||||
<script src="/js/design3.js"></script>
|
||||
<script>
|
||||
(function setVH(){
|
||||
const apply = () =>
|
||||
document.documentElement.style.setProperty('--vh', (window.innerHeight * 0.01) + 'px');
|
||||
apply();
|
||||
window.addEventListener('resize', apply);
|
||||
window.addEventListener('orientationchange', apply);
|
||||
})();
|
||||
|
||||
const nav = document.querySelector('header#navbar');
|
||||
|
||||
(function navColorOnScroll(){
|
||||
const header = nav; // same element
|
||||
const header = document.querySelector('header#navbar');
|
||||
const cover = document.querySelector('.page-1.cover');
|
||||
if (!header || !cover || !('IntersectionObserver' in window)) {
|
||||
window.addEventListener('load', () => header && document.body.classList.toggle('change-nav-color', window.scrollY > 10));
|
||||
@@ -367,80 +209,6 @@
|
||||
}, { threshold: [0, 0.02, 1] });
|
||||
io.observe(cover);
|
||||
})();
|
||||
|
||||
|
||||
// switch theme
|
||||
const sunIcon = document.querySelector('.sun');
|
||||
const moonIcon = document.querySelector('.moon');
|
||||
|
||||
const userTheme = localStorage.getItem('theme');
|
||||
const systemTheme = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
||||
const prismThemeLink = document.getElementById('prism-theme')
|
||||
|
||||
const iconToggle = () => {
|
||||
sunIcon.classList.toggle('hidden');
|
||||
moonIcon.classList.toggle('hidden');
|
||||
}
|
||||
|
||||
const themeCheck = () => {
|
||||
if(userTheme === 'dark' || (!userTheme && systemTheme)){
|
||||
document.documentElement.classList.add('dark');
|
||||
moonIcon.classList.add('hidden');
|
||||
if(prismThemeLink){
|
||||
prismThemeLink.setAttribute('href','/css/prism-dark.min.css')
|
||||
}
|
||||
}
|
||||
else{
|
||||
sunIcon.classList.add('hidden');
|
||||
if(prismThemeLink){
|
||||
prismThemeLink.setAttribute('href','/css/prism-light.min.css')
|
||||
}
|
||||
}
|
||||
}
|
||||
themeCheck();
|
||||
|
||||
const themeSwitch = () => {
|
||||
if(document.documentElement.classList.contains('dark')){
|
||||
document.documentElement.classList.remove('dark');
|
||||
localStorage.setItem('theme','light');
|
||||
if(prismThemeLink){
|
||||
prismThemeLink.setAttribute('href','/css/prism-light.min.css')
|
||||
}
|
||||
iconToggle();
|
||||
}
|
||||
else{
|
||||
document.documentElement.classList.add('dark');
|
||||
localStorage.setItem('theme','dark');
|
||||
if(prismThemeLink){
|
||||
prismThemeLink.setAttribute('href','/css/prism-dark.min.css')
|
||||
}
|
||||
iconToggle();
|
||||
}
|
||||
}
|
||||
|
||||
window.addEventListener('click',(e)=>{
|
||||
if(e.target.closest('.nav-link')){
|
||||
if(e.target.closest('.nav-link').classList.contains('active')){
|
||||
e.target.closest('.nav-link').classList.remove('active');
|
||||
}
|
||||
else{
|
||||
document.querySelectorAll('.nav-link').forEach(el => el.classList.remove('active'))
|
||||
e.target.closest('.nav-link').classList.add('active');
|
||||
}
|
||||
}
|
||||
else if(e.target.closest('.nav-toggle-btn')){
|
||||
document.body.classList.toggle('lock-scroll');
|
||||
if(nav.classList.contains('open')){
|
||||
nav.classList.remove('open');
|
||||
}
|
||||
else{
|
||||
nav.classList.add('open');
|
||||
}
|
||||
}
|
||||
else if(e.target.closest('.theme-switch-btn')){
|
||||
themeSwitch();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
|
||||
@@ -1,9 +1,8 @@
|
||||
---
|
||||
layout: layouts/main.html
|
||||
title: "SimpleX Chat: private and secure messenger without any user IDs (not even random)"
|
||||
title: "SimpleX Chat: Learn more about SimpleX messaging"
|
||||
description: "SimpleX Chat - a private and encrypted messenger without any user IDs (not even random ones)! Make a private connection via link / QR code to send messages and make calls."
|
||||
templateEngineOverride: njk
|
||||
active_home: true
|
||||
---
|
||||
{%- from "components/macro.njk" import overlay -%}
|
||||
|
||||
@@ -216,5 +215,101 @@ active_home: true
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="how-secure-comparison" class="bg-primary-bg-light dark:bg-primary-bg-dark py-[90px] px-5">
|
||||
<div class="text-grey-black dark:text-white container flex flex-col">
|
||||
<h2 class="text-[35px] leading-[43px] md:leading-[55px] lg:leading-[36px] text-center font-bold mb-12 lg:mb-[90px]">How secure is end-to-end encryption in different messengers?</h2>
|
||||
|
||||
<div class="w-full overflow-auto">
|
||||
<table class="w-full border-separate border-spacing-x-5 border-spacing-y-2">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th class="pb-4">
|
||||
<img class="h-[60px] mr-auto ml-auto" alt="simplex logo" src="/img/messengers/session.svg"/>
|
||||
<p>Session</p>
|
||||
</th>
|
||||
<th class="pb-4">
|
||||
<img class="h-[60px] mr-auto ml-auto" alt="simplex logo" src="/img/messengers/briar.svg"/>
|
||||
<p>Briar</p>
|
||||
</th>
|
||||
<th class="pb-4">
|
||||
<img class="h-[60px] mr-auto ml-auto" alt="simplex logo" src="/img/messengers/element.svg"/>
|
||||
<p>Element</p>
|
||||
</th>
|
||||
<th class="pb-4">
|
||||
<img class="h-[60px] mr-auto ml-auto" alt="simplex logo" src="/img/messengers/cwtch.png"/>
|
||||
<p>Cwtch</p>
|
||||
</th>
|
||||
<th class="pb-4">
|
||||
<img class="h-[60px] mr-auto ml-auto" alt="simplex logo" src="/img/messengers/signal.png"/>
|
||||
<p>Signal</p>
|
||||
</th>
|
||||
<th class="pb-4">
|
||||
<img class="h-[60px] mr-auto ml-auto" alt="simplex logo" src="/img/new/logo-symbol-light.svg"/>
|
||||
<p>SimpleX</p>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="min-w-[210px]">Message padding</td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/red-x.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/yellow-tick.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/red-x.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/green-tick.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/yellow-tick.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/green-tick.svg" alt="" srcset=""></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="min-w-[210px]">Repudiation (deniability)</td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/red-x.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/red-x.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/red-x.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/yellow-tick.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/yellow-tick.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px] flex justify-center items-center gap-0"><img class="h-[34px]" src="/img/design_3/green-tick.svg" alt="" srcset=""> <sup class="text-[#e2b01b] font-bold text-[18px]">1</sup></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="min-w-[210px]">Forward secrecy</td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/red-x.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/green-tick.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/green-tick.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/green-tick.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/green-tick.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/green-tick.svg" alt="" srcset=""></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="min-w-[210px]">Break-in recovery</td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/red-x.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/red-x.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/red-x.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/green-tick.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/red-x.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/green-tick.svg" alt="" srcset=""></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="min-w-[210px]">2-factor key exchange</td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/green-tick.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/yellow-tick.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/yellow-tick.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/green-tick.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/yellow-tick.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/green-tick.svg" alt="" srcset=""></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="min-w-[210px]">Post-quantum hybrid crypto</td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/red-x.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/red-x.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/red-x.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/red-x.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px]"><img class="h-[34px] mr-auto ml-auto" src="/img/design_3/yellow-tick.svg" alt="" srcset=""></td>
|
||||
<td class="min-w-[100px] h-[52px] flex justify-center items-center"><img class="h-[34px]" src="/img/design_3/green-tick.svg" alt="" srcset=""> <sup class="text-[#e2b01b] font-bold text-[18px]">2</sup></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{# join simplex #}
|
||||
{# {% include "sections/join_simplex.html" %} #}
|
||||
Reference in New Issue
Block a user