forked from cwtch.im/website-new
Initial Commit
This commit is contained in:
commit
af44bbc3c9
File diff suppressed because one or more lines are too long
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.1 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 791 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 540 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 508 KiB |
|
|
@ -0,0 +1,203 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="">
|
||||
<link rel="icon" href="/favicon.ico">
|
||||
|
||||
<title>Product example for Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
<link href="/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
<!-- Custom styles for this template -->
|
||||
<link href="product.css" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<nav class="site-header sticky-top py-1">
|
||||
<div class="container d-flex flex-column flex-md-row justify-content-between">
|
||||
<a class="py-2" href="#">
|
||||
<img src="images/500x500_white.png" height="100px">
|
||||
</a>
|
||||
<a class="py-2 d-none d-md-inline-block" href="#">ABOUT</a>
|
||||
<a class="py-2 d-none d-md-inline-block" href="#">HOW IT WORKS</a>
|
||||
<a class="py-2 d-none d-md-inline-block" href="#">THREAT MODEL</a>
|
||||
<a class="py-2 d-none d-md-inline-block" href="#">ROADMAP</a>
|
||||
<a class="py-2 d-none d-md-inline-block" href="#">PAPER</a>
|
||||
<a class="py-2 d-none d-md-inline-block" href="#">CODE</a>
|
||||
<a class="py-2 d-none d-md-inline-block" href="#">GET CWTCH</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="container">
|
||||
|
||||
<div class="row text-center justify-content-around">
|
||||
<div class="col-md-6 text-center">
|
||||
<h1 class="display-4 font-weight-normal ">Privacy Preserving Infrastructure</h1>
|
||||
<button type="button" class="btn btn-primary">Get Cwtch</button>
|
||||
</div>
|
||||
<div class="col-md-6 text-center">
|
||||
<img src="images/CWTCH_WEB/cwtch%20phones.png" width="90%">
|
||||
</div>
|
||||
</div>
|
||||
<hr/>
|
||||
|
||||
<div class="row text-center justify-content-around align-items-center">
|
||||
<div class="col-md-6">
|
||||
<h2>How it Works</h2>
|
||||
<video width="99%" controls>
|
||||
<source src="/cwtch-explainer.mp4" type="video/mp4">
|
||||
</video>
|
||||
</div>
|
||||
</div>
|
||||
<hr/>
|
||||
|
||||
<div class="row text-center justify-content-around align-items-center">
|
||||
<div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
|
||||
<div class="carousel-inner">
|
||||
<div class="carousel-item active">
|
||||
<div class="card text-center" >
|
||||
<img src="/images/CWTCH_WEB/BASE_0.png" class="d-block w-50 card-img-top" alt="...">
|
||||
<div class="card-body">
|
||||
<p class="card-text">Existing secure messengers provide end to end encryption so that eavesdroppers can't see the contents of the communication.
|
||||
But these centralized platforms, much like a post office, act as clearing houses for messages.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<div class="card text-center" >
|
||||
<img src="/images/CWTCH_WEB/BASE_1.png" class="d-block w-50 card-img-top" alt="...">
|
||||
<div class="card-body">
|
||||
<p class="card-text">They need access to metadata about your activities such as who you talk to, when and how much in order to offer features like group messaging and offline delivery.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<div class="card text-center" >
|
||||
<img src="/images/CWTCH_WEB/BASE_2.png" class="d-block w-50 card-img-top" alt="...">
|
||||
<div class="card-body">
|
||||
<p class="card-text">Communications metadata us known to be exploited by many adversaries to undermine the security of systems; to track people;
|
||||
And to conduct large scale social networking analysis that feeds into mass surveillance systems.
|
||||
These systems have grave consequences for freedom, autonomy and sometimes...even life itself.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<div class="card text-center" >
|
||||
<img src="/images/CWTCH_WEB/BASE_3.png" class="d-block w-50 card-img-top" alt="...">
|
||||
<div class="card-body">
|
||||
<p class="card-text">Cwtch is a metadata resistant privacy platform designed to hide this metadata and help you resist surveillance.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<div class="card text-center" >
|
||||
<img src="/images/CWTCH_WEB/BASE_5.png" class="d-block w-50 card-img-top" alt="...">
|
||||
<div class="card-body">
|
||||
<p class="card-text">Like other systems, Cwtch uses end to end encryption.
|
||||
|
||||
but the journey its messages take is different. Cwtch is a decentralized peer to peer platform built on Tor onion services.
|
||||
|
||||
With no need for a centralized server to route messages through, and onion routing provided by Tor, Cwtch establishes direct connections between peers while minimizing and sometimes even eliminating the metadata that 3rd parties can see.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<div class="card text-center" >
|
||||
<img src="/images/CWTCH_WEB/BASE_6.png" class="d-block w-50 card-img-top" alt="...">
|
||||
<div class="card-body">
|
||||
<p class="card-text">
|
||||
Cwtch uses cryptographic identifiers that anyone can anonymously generate for themselves as many times as they want. This means they can't be tied to your real world identity by anyone but you.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<div class="card text-center" >
|
||||
<img src="/images/CWTCH_WEB/BASE_7.png" class="d-block w-50 card-img-top" alt="...">
|
||||
<div class="card-body">
|
||||
<p class="card-text">Cwtch is designed to put consent first. This means we never want the app to do something you don't expect or want. Cwtch gives more control over what information is shared, how and who can communicate with who. We'll never included unsolicited content such as advertising or trends.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<div class="card text-center" >
|
||||
<img src="/images/CWTCH_WEB/BASE_8.png" class="d-block w-50 card-img-top" alt="...">
|
||||
<div class="card-body">
|
||||
<p class="card-text">
|
||||
Cwtch is designed for people who need to protect, not only the *content* of their communication, but *who* they are talking to as well.
|
||||
|
||||
Cwtch provides a safe space for you and your friends, family, comrades, and fellow rabble-rousers.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
|
||||
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
|
||||
<span class="visually-hidden">Previous</span>
|
||||
</a>
|
||||
<a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
|
||||
<span class="carousel-control-next-icon" aria-hidden="true"></span>
|
||||
<span class="visually-hidden">Next</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr/>
|
||||
</div>
|
||||
<footer class="container py-5">
|
||||
<div class="row">
|
||||
<div class="col-12 col-md">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="d-block mb-2"><circle cx="12" cy="12" r="10"></circle><line x1="14.31" y1="8" x2="20.05" y2="17.94"></line><line x1="9.69" y1="8" x2="21.17" y2="8"></line><line x1="7.38" y1="12" x2="13.12" y2="2.06"></line><line x1="9.69" y1="16" x2="3.95" y2="6.06"></line><line x1="14.31" y1="16" x2="2.83" y2="16"></line><line x1="16.62" y1="12" x2="10.88" y2="21.94"></line></svg>
|
||||
<small class="d-block mb-3 text-muted">© 2017-2018</small>
|
||||
</div>
|
||||
<div class="col-6 col-md">
|
||||
<h5>Features</h5>
|
||||
<ul class="list-unstyled text-small">
|
||||
<li><a class="text-muted" href="#">Cool stuff</a></li>
|
||||
<li><a class="text-muted" href="#">Random feature</a></li>
|
||||
<li><a class="text-muted" href="#">Team feature</a></li>
|
||||
<li><a class="text-muted" href="#">Stuff for developers</a></li>
|
||||
<li><a class="text-muted" href="#">Another one</a></li>
|
||||
<li><a class="text-muted" href="#">Last time</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-6 col-md">
|
||||
<h5>Resources</h5>
|
||||
<ul class="list-unstyled text-small">
|
||||
<li><a class="text-muted" href="#">Resource</a></li>
|
||||
<li><a class="text-muted" href="#">Resource name</a></li>
|
||||
<li><a class="text-muted" href="#">Another resource</a></li>
|
||||
<li><a class="text-muted" href="#">Final resource</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-6 col-md">
|
||||
<h5>Resources</h5>
|
||||
<ul class="list-unstyled text-small">
|
||||
<li><a class="text-muted" href="#">Business</a></li>
|
||||
<li><a class="text-muted" href="#">Education</a></li>
|
||||
<li><a class="text-muted" href="#">Government</a></li>
|
||||
<li><a class="text-muted" href="#">Gaming</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-6 col-md">
|
||||
<h5>About</h5>
|
||||
<ul class="list-unstyled text-small">
|
||||
<li><a class="text-muted" href="#">Team</a></li>
|
||||
<li><a class="text-muted" href="#">Locations</a></li>
|
||||
<li><a class="text-muted" href="#">Privacy</a></li>
|
||||
<li><a class="text-muted" href="#">Terms</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
<script src="/js/jquery-3.5.1.min.js"></script>
|
||||
<script src="/js/bootstrap.min.js"></script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,120 @@
|
|||
.container {
|
||||
max-width: 960px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Custom translucent site header
|
||||
*/
|
||||
|
||||
.site-header {
|
||||
background-color: #281831;
|
||||
-webkit-backdrop-filter: saturate(180%) blur(20px);
|
||||
backdrop-filter: saturate(180%) blur(20px);
|
||||
font-family: "Atami Bold";
|
||||
font-size: 1em;
|
||||
}
|
||||
.site-header a {
|
||||
color: #fff;
|
||||
transition: ease-in-out color .15s;
|
||||
}
|
||||
.site-header a:hover {
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
src: url("/fonts/OpenSans-Light.ttf") format("truetype");
|
||||
font-family: "OpenSans Light";
|
||||
font-kerning: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
src: url("/fonts/OpenSans-Regular.ttf") format("truetype");
|
||||
font-family: "OpenSans Regular";
|
||||
}
|
||||
|
||||
@font-face {
|
||||
src: url("/fonts/OpenSans-SemiBold.ttf") format("truetype");
|
||||
font-family: "OpenSans SemiBold";
|
||||
}
|
||||
|
||||
@font-face {
|
||||
src: url("/fonts/ATAMI-BOLD.OTF") format("truetype");
|
||||
font-family: "Atami Bold";
|
||||
}
|
||||
|
||||
@font-face {
|
||||
src: url("/fonts/ATAMI-REGULAR.OTF") format("truetype");
|
||||
font-family: "Atami Regular";
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #281831;
|
||||
color:#fff;
|
||||
font-family: "OpenSans SemiBold";
|
||||
}
|
||||
|
||||
h1, h2, h3 {
|
||||
font-family: "Atami Regular";
|
||||
}
|
||||
|
||||
.btn {
|
||||
border-radius: 25px!important;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background-color:#d20070;
|
||||
border-color: #d20070;
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background-color:#d20070;
|
||||
border-color: #d20070;
|
||||
}
|
||||
|
||||
.btn-primary:active {
|
||||
background-color:#d20070;
|
||||
border-color: #d20070;
|
||||
outline: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.btn-primary:focus {
|
||||
background-color:#d20070 !important;
|
||||
border-color: #d20070 !important;
|
||||
outline: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.btn-primary:active:focus{
|
||||
background-color:#d20070 !important;
|
||||
border-color: #d20070 !important;
|
||||
}
|
||||
|
||||
.card {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.card img {
|
||||
margin:auto;
|
||||
}
|
||||
|
||||
|
||||
.border-top { border-top: 1px solid #e5e5e5; }
|
||||
.border-bottom { border-bottom: 1px solid #e5e5e5; }
|
||||
|
||||
.box-shadow { box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05); }
|
||||
|
||||
.flex-equal > * {
|
||||
-ms-flex: 1;
|
||||
-webkit-box-flex: 1;
|
||||
flex: 1;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.flex-md-equal > * {
|
||||
-ms-flex: 1;
|
||||
-webkit-box-flex: 1;
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue