added privacy matters section
This commit is contained in:
M Sarmad Qadeer
parent
2539a4f1f5
commit
f662002760
@ -12,12 +12,9 @@
|
||||
<body>
|
||||
<section class="h-screen w-full bg-white dark:bg-gradient-radial-mobile dark:lg:bg-gradient-radial">
|
||||
{% include "navbar.html" %}
|
||||
</section>
|
||||
|
||||
</section>
|
||||
|
||||
<section class="container">
|
||||
<div class="bg-white py-6 sm:py-12 sm:px-8 md:px-16 lg:px-20">{{ content | safe }}</div>
|
||||
</section>
|
||||
{{ content | safe }}
|
||||
|
||||
<script src="/js/script.js"></script>
|
||||
</body>
|
||||
|
||||
@ -61,8 +61,7 @@ html {
|
||||
.container-md,
|
||||
.container-sm {
|
||||
width: 100%;
|
||||
padding-right: var(--bs-gutter-x, 0.75rem);
|
||||
padding-left: var(--bs-gutter-x, 0.75rem);
|
||||
padding: 0 20px;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
@ -117,6 +116,23 @@ html {
|
||||
}
|
||||
}
|
||||
|
||||
.gradient-text {
|
||||
background: -webkit-linear-gradient(to bottom, #53C1FF -50%, #0053D0 160%);
|
||||
background: linear-gradient(to bottom, #53C1FF -50%, #0053D0 160%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
text-fill-color: transparent;
|
||||
}
|
||||
|
||||
.dark .border-gradient{
|
||||
background:
|
||||
linear-gradient(#11182F,#11182F) padding-box,
|
||||
linear-gradient(to bottom, transparent, #01F1FF 58%) border-box;
|
||||
border-radius: 6px;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
@media (min-width:1024px) {
|
||||
.nav-link-text {
|
||||
position: relative;
|
||||
|
||||
23
website/src/img/new/privacy-section-1.svg
Normal file
23
website/src/img/new/privacy-section-1.svg
Normal file
@ -0,0 +1,23 @@
|
||||
<svg width="77" height="115" viewBox="0 0 77 115" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<circle cx="38.9321" cy="38.394" r="38" fill="url(#paint0_linear_610_5164)"/>
|
||||
<circle cx="38.4321" cy="37.894" r="11.5" fill="url(#paint1_linear_610_5164)"/>
|
||||
<circle cx="39.4321" cy="89.894" r="2.5" transform="rotate(90 39.4321 89.894)" fill="#606C71"/>
|
||||
<circle cx="39.4321" cy="100.894" r="2.5" transform="rotate(90 39.4321 100.894)" fill="#606C71"/>
|
||||
<circle cx="39.4321" cy="111.894" r="2.5" transform="rotate(90 39.4321 111.894)" fill="#606C71"/>
|
||||
<circle cx="10.3421" cy="90.0611" r="2.5" transform="rotate(100 10.3421 90.0611)" fill="#606C71"/>
|
||||
<circle cx="8.43198" cy="100.894" r="2.5" transform="rotate(100 8.43198 100.894)" fill="#606C71"/>
|
||||
<circle cx="6.52183" cy="111.727" r="2.5" transform="rotate(100 6.52183 111.727)" fill="#606C71"/>
|
||||
<circle cx="68.5219" cy="90.0612" r="2.5" transform="rotate(80 68.5219 90.0612)" fill="#606C71"/>
|
||||
<circle cx="70.4321" cy="100.894" r="2.5" transform="rotate(80 70.4321 100.894)" fill="#606C71"/>
|
||||
<circle cx="72.3422" cy="111.727" r="2.5" transform="rotate(80 72.3422 111.727)" fill="#606C71"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_610_5164" x1="75.8145" y1="0.394027" x2="-15.2359" y2="31.4688" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#CD5CAE"/>
|
||||
<stop offset="1" stop-color="#FF3685"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_610_5164" x1="49.5939" y1="26.394" x2="22.0392" y2="35.7982" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FDFF97"/>
|
||||
<stop offset="1" stop-color="#F1DA09"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.6 KiB |
30
website/src/img/new/privacy-section-2.svg
Normal file
30
website/src/img/new/privacy-section-2.svg
Normal file
@ -0,0 +1,30 @@
|
||||
<svg width="77" height="97" viewBox="0 0 77 97" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M65.4744 32.7549H10C4.47715 32.7549 0 37.2321 0 42.7549V86.7788C0 92.3016 4.47715 96.7788 10 96.7788H65.4744C70.9972 96.7788 75.4744 92.3016 75.4744 86.7788V42.7549C75.4744 37.2321 70.9972 32.7549 65.4744 32.7549Z" fill="url(#paint0_linear_1_14)"/>
|
||||
<path d="M25.084 73.4123L27.7978 64.6963H28.666L25.4736 74.6493H24.7148L21.5224 64.6963H22.3906L25.084 73.4123ZM36.8691 70.3363C36.8646 70.6733 36.8349 71.0193 36.7802 71.3753C36.7256 71.7263 36.639 72.0673 36.5205 72.4003C36.4065 72.7283 36.2607 73.0383 36.083 73.3303C35.9052 73.6173 35.6933 73.8703 35.4472 74.0893C35.2057 74.3033 34.9254 74.4743 34.6064 74.6013C34.2874 74.7243 33.9297 74.7863 33.5332 74.7863C33.1412 74.7863 32.7858 74.7243 32.4668 74.6013C32.1478 74.4743 31.8629 74.3033 31.6123 74.0893C31.3662 73.8703 31.152 73.6153 30.9697 73.3233C30.792 73.0313 30.6439 72.7213 30.5254 72.3933C30.4114 72.0613 30.3248 71.7193 30.2656 71.3683C30.2109 71.0173 30.1813 70.6733 30.1767 70.3363V69.0233C30.1813 68.6863 30.2109 68.3423 30.2656 67.9913C30.3248 67.6353 30.4114 67.2943 30.5254 66.9663C30.6393 66.6333 30.7851 66.3213 30.9629 66.0293C31.1452 65.7373 31.3593 65.4823 31.6054 65.2633C31.8515 65.0453 32.1318 64.8743 32.4463 64.7513C32.7653 64.6233 33.123 64.5593 33.5195 64.5593C33.916 64.5593 34.2737 64.6233 34.5927 64.7513C34.9118 64.8743 35.1943 65.0453 35.4404 65.2633C35.6911 65.4783 35.9052 65.7313 36.083 66.0223C36.2607 66.3143 36.4065 66.6263 36.5205 66.9593C36.639 67.2873 36.7256 67.6293 36.7802 67.9843C36.8349 68.3353 36.8646 68.6813 36.8691 69.0233V70.3363ZM36.0625 69.0093C36.0579 68.7453 36.0374 68.4693 36.001 68.1823C35.9645 67.8953 35.9052 67.6153 35.8232 67.3423C35.7412 67.0683 35.6341 66.8083 35.5019 66.5623C35.3743 66.3123 35.2171 66.0933 35.0302 65.9063C34.8434 65.7193 34.6246 65.5713 34.374 65.4623C34.1233 65.3523 33.8385 65.2983 33.5195 65.2983C33.2005 65.2983 32.9157 65.3553 32.665 65.4683C32.4189 65.5783 32.2024 65.7263 32.0156 65.9133C31.8287 66.1003 31.6692 66.3183 31.5371 66.5693C31.4095 66.8153 31.3047 67.0753 31.2226 67.3483C31.1406 67.6223 31.0814 67.9023 31.0449 68.1893C31.0084 68.4763 30.9879 68.7503 30.9834 69.0093V70.3363C30.9879 70.6003 31.0084 70.8763 31.0449 71.1633C31.0859 71.4453 31.1474 71.7263 31.2295 72.0043C31.3115 72.2773 31.4163 72.5393 31.5439 72.7903C31.6761 73.0363 31.8356 73.2523 32.0224 73.4393C32.2093 73.6263 32.428 73.7763 32.6787 73.8903C32.9293 74.0003 33.2142 74.0543 33.5332 74.0543C33.8567 74.0543 34.1416 74.0003 34.3877 73.8903C34.6383 73.7763 34.8571 73.6263 35.0439 73.4393C35.2308 73.2523 35.388 73.0363 35.5156 72.7903C35.6478 72.5393 35.7526 72.2773 35.8301 72.0043C35.9121 71.7263 35.969 71.4453 36.001 71.1633C36.0374 70.8763 36.0579 70.6003 36.0625 70.3363V69.0093ZM45.5234 65.4143H42.3515V74.6493H41.5517L41.5586 65.4143H38.3799V64.6963H45.5234V65.4143ZM52.7217 69.8783H48.333V73.9383H53.3916V74.6493H47.5195V64.6963H53.3642V65.4143H48.333V69.1673H52.7217V69.8783Z" fill="white"/>
|
||||
<path d="M61.2892 50.4873H13.0948C11.337 50.4873 9.91211 51.9122 9.91211 53.67C9.91211 55.4277 11.337 56.8526 13.0948 56.8526H61.2892C63.047 56.8526 64.4719 55.4277 64.4719 53.67C64.4719 51.9122 63.047 50.4873 61.2892 50.4873Z" fill="#3F484B"/>
|
||||
<mask id="mask0_1_14" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="77" height="52">
|
||||
<path d="M76.2621 0H0.863708V51.2515H76.2621V0Z" fill="#D9D9D9"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_1_14)">
|
||||
<g filter="url(#filter0_i_1_14)">
|
||||
<path d="M50.0478 10.585L18.6287 42.0041C17.0666 43.5662 17.0666 46.0988 18.6287 47.6609L31.7113 60.7435C33.2734 62.3056 35.8061 62.3056 37.3682 60.7435L68.7873 29.3245C70.3494 27.7624 70.3494 25.2297 68.7873 23.6676L55.7047 10.585C54.1426 9.02289 51.6099 9.02289 50.0478 10.585Z" fill="white"/>
|
||||
<path d="M49.6943 10.2314L18.2752 41.6505C16.5178 43.4079 16.5178 46.2571 18.2752 48.0145L31.3578 61.0971C33.1151 62.8545 35.9644 62.8545 37.7218 61.0971L69.1408 29.678C70.8982 27.9206 70.8982 25.0714 69.1408 23.314L56.0582 10.2314C54.3009 8.47408 51.4516 8.47408 49.6943 10.2314Z" stroke="#3F484B"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<filter id="filter0_i_1_14" x="16.4572" y="8.41341" width="57.679" height="57.679" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
|
||||
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||
<feOffset dx="3.17726" dy="3.17726"/>
|
||||
<feGaussianBlur stdDeviation="2"/>
|
||||
<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0.247059 0 0 0 0 0.282353 0 0 0 0 0.294118 0 0 0 1 0"/>
|
||||
<feBlend mode="normal" in2="shape" result="effect1_innerShadow_1_14"/>
|
||||
</filter>
|
||||
<linearGradient id="paint0_linear_1_14" x1="74.3645" y1="32.7549" x2="-12.5238" y2="67.7123" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#53C1FF"/>
|
||||
<stop offset="1" stop-color="#0053D0"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.0 KiB |
17
website/src/img/new/privacy-section-3.svg
Normal file
17
website/src/img/new/privacy-section-3.svg
Normal file
@ -0,0 +1,17 @@
|
||||
<svg width="89" height="92" viewBox="0 0 89 92" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<circle cx="42.4778" cy="49.894" r="41.5" fill="url(#paint0_linear_610_5181)"/>
|
||||
<circle cx="43.1616" cy="42.7805" r="7.2541" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M57.4941 63.2807H28.5308C30.5274 57.1923 36.2564 52.7954 43.0124 52.7954C49.7685 52.7954 55.4975 57.1923 57.4941 63.2807Z" fill="white"/>
|
||||
<path d="M74.0926 0.583008C74.3071 0.583008 74.5215 0.583008 74.736 0.583008C74.7603 0.603483 74.7816 0.631373 74.8093 0.643413C78.9945 2.47489 83.1791 4.30807 87.367 6.13261C88.02 6.41709 88.3246 6.89387 88.319 7.64798C88.3025 9.85394 88.3097 12.0601 88.3141 14.2661C88.3176 16.0258 88.142 17.7667 87.7249 19.4677C85.9081 26.8754 81.6666 32.1155 75.0285 35.1974C74.6235 35.3854 74.2292 35.3887 73.8183 35.2041C69.0691 33.0714 65.4545 29.6216 63.015 24.8204C61.801 22.4314 61.03 19.8852 60.706 17.1925C60.6417 16.6574 60.5787 16.1222 60.5151 15.5871C60.5151 12.7583 60.5151 9.92944 60.5151 7.10066C60.7205 6.65279 61.0136 6.32485 61.4703 6.12724C64.3652 4.87471 67.2534 3.60511 70.1421 2.3366C71.461 1.75737 72.7759 1.16781 74.0926 0.583008Z" fill="url(#paint1_linear_610_5181)" stroke="#3F484B"/>
|
||||
<path d="M73.0165 18.8321C73.129 18.6639 73.1847 18.5494 73.2668 18.4625C75.0008 16.6279 76.7353 14.7936 78.4756 12.9657C79.2229 12.1807 80.3977 12.4793 80.676 13.5217C80.8083 14.0174 80.6991 14.473 80.3564 14.836C78.2072 17.1126 76.0561 19.3872 73.8943 21.6505C73.3591 22.2109 72.5941 22.1808 72.052 21.6127C70.8652 20.3688 69.6821 19.121 68.5034 17.8685C67.9726 17.3043 67.968 16.4643 68.4763 15.9226C68.9852 15.3801 69.78 15.3737 70.3212 15.9326C71.1182 16.7556 71.9016 17.5932 72.6888 18.4268C72.7793 18.5227 72.8563 18.6328 73.0165 18.8321Z" fill="#3F484B"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_610_5181" x1="82.7572" y1="8.39403" x2="-16.6794" y2="42.3309" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#1BC4BF"/>
|
||||
<stop offset="1" stop-color="#009F9B"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_610_5181" x1="87.9101" y1="0.583001" x2="53.3" y2="10.032" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#FDFF97"/>
|
||||
<stop offset="1" stop-color="#F1DA09"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.2 KiB |
@ -2,4 +2,39 @@
|
||||
layout: layouts/main.html
|
||||
title: "SimpleX Chat"
|
||||
---
|
||||
<h1>Hello World</h1>
|
||||
<section class="bg-secondary-bg-light dark:bg-secondary-bg-dark py-[85px]">
|
||||
<div class="container">
|
||||
<p class="text-grey-black dark:text-white text-[45px] text-center font-bold mb-[32px]">Why privacy <span class="gradient-text">matters</span></p>
|
||||
<p class="text-center text-[20px] font-medium mb-[86px] text-black dark:text-white">Preserving the privacy of your meta-data - <span class="text-active-blue">who you talk with</span> - protect you from:</p>
|
||||
<div class="flex flex-col lg:flex-row gap-[20px] mb-[90px]">
|
||||
<div class="bg-white dark:bg-transparent px-[34px] flex flex-col rounded-[12px] shadow-[0px_50px_61px_rgba(0,0,0,0.12)] dark:shadow-none flex-[1] border-gradient">
|
||||
<div class="flex items-center justify-center h-[215px]">
|
||||
<img src="/img/new/privacy-section-1.svg" alt="">
|
||||
</div>
|
||||
<div class="h-[152px] flex flex-col items-center justify-between">
|
||||
<p class="text-center font-medium leading-[28px] text-grey-black dark:text-white">Invasive and manipulative advertising and price discrimination</p>
|
||||
<a href="" class="underline text-primary-light dark:text-primary-dark block text-[16px] underline-offset-2 mb-[53px]">Learn more</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white dark:bg-transparent px-[34px] flex flex-col rounded-[12px] shadow-[0px_50px_61px_rgba(0,0,0,0.12)] dark:shadow-none flex-[1] border-gradient">
|
||||
<div class="flex items-center justify-center h-[215px]">
|
||||
<img src="/img/new/privacy-section-2.svg" alt="">
|
||||
</div>
|
||||
<div class="h-[152px] flex flex-col items-center justify-between">
|
||||
<p class="text-center font-medium leading-[28px] text-grey-black dark:text-white">Manipulation of elections</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white dark:bg-transparent px-[34px] flex flex-col rounded-[12px] shadow-[0px_50px_61px_rgba(0,0,0,0.12)] dark:shadow-none flex-[1] border-gradient">
|
||||
<div class="flex items-center justify-center h-[215px]">
|
||||
<img src="/img/new/privacy-section-3.svg" alt="">
|
||||
</div>
|
||||
<div class="h-[152px] flex flex-col items-center justify-between">
|
||||
<p class="text-center font-medium leading-[28px] text-grey-black dark:text-white">Protect against prosecution when you are innocent</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-center w-full max-w-[900px] text-[20px] leading-[28px] m-auto text-black dark:text-white">Or choose the app that lets you send stickers and offer lots of fun features in exchange for selling your data to the highest bidder.</p>
|
||||
</div>
|
||||
</section>
|
||||
@ -5,12 +5,21 @@ module.exports = {
|
||||
extend: {
|
||||
backgroundImage: {
|
||||
'gradient-radial': 'radial-gradient(88.77% 102.03% at 92.64% -13.22%, #17203D 0%, #0C0B13 100%)',
|
||||
'gradient-radial-mobile': 'radial-gradient(77.4% 73.09% at -3.68% 100%, #17203D 0%, #0C0B13 100%)'
|
||||
'gradient-radial-mobile': 'radial-gradient(77.4% 73.09% at -3.68% 100%, #17203D 0%, #0C0B13 100%)',
|
||||
},
|
||||
colors: {
|
||||
'primary-light': '#0053D0',
|
||||
'primary-hover-light': '#1661D1',
|
||||
'primary-pressed-light': '#407AD2',
|
||||
'primary-dark': '#70F0F9',
|
||||
'black': '#0D0E12'
|
||||
'primary-hover-dark': '#66D9E2',
|
||||
'primary-pressed-dark': '#52ABB4',
|
||||
|
||||
'active-blue': '#0197FF',
|
||||
'black': '#0D0E12',
|
||||
'grey-black': '#3F484B',
|
||||
'secondary-bg-light': '#F3F6F7',
|
||||
'secondary-bg-dark': '#11182F'
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
Loading…
Reference in New Issue
Block a user