From 800216a7cdc06823a610962a67e1f2b1185e4a86 Mon Sep 17 00:00:00 2001
From: akwizgran <akwizgran@users.sourceforge.net>
Date: Fri, 13 Jun 2014 11:02:01 +0100
Subject: [PATCH] Merged Vicki's new layout for small screens.
---
about.html | 99 ++++-----
copyright.html | 96 ++++-----
css/styles.css | 469 ++++++++++++++++++++++++++++--------------
download.html | 89 ++++----
get-involved.html | 99 ++++-----
how-it-works.html | 150 +++++++-------
img/briar_logo_sm.png | Bin 0 -> 6425 bytes
img/menu.png | Bin 0 -> 292 bytes
index.html | 127 ++++++------
9 files changed, 648 insertions(+), 481 deletions(-)
create mode 100644 img/briar_logo_sm.png
create mode 100644 img/menu.png
diff --git a/about.html b/about.html
index afc16d5..dd7c5f0 100644
--- a/about.html
+++ b/about.html
@@ -8,60 +8,64 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body id="about">
- <div id="header_container">
- <div id="header">
- <div id="logo">
- <a href="index.html"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></a>
- </div> <!-- logo -->
- <div id="nav">
- <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
- <div id="signup">
- <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
- <input placeholder="Email address" type="email" name="email" tabindex="2" ></input>
- <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
- </form>
- <div id="signupconf">Thanks! We'll keep you updated.</div>
- <script language="JavaScript">
- <!--
- function _submit_form(){
- document.getElementById('signupform').style.display = 'none';
- document.getElementById('signupconf').style.display = 'block';
- return true
- }
- //-->
- </script>
- </div> <!-- signup -->
- <ul>
- <li><a href="index.html" id="indexnav">Home</a></li>
- <li><a href="download.html" id="downloadnav">Download</a></li>
- <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
- <li><a href="about.html" id="aboutnav">About Us</a></li>
- <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
- </ul>
- </div> <!-- nav -->
- </div> <!-- header -->
- </div> <!-- header_container -->
- <div id="container">
- <div id="content">
- <div class="intro">
- <h2>About us</h2>
+ <div id="wrapper">
+ <div id="header_container">
+ <div id="header">
+ <a href="index.html"><div id="logo"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></div></a>
+ <div id="nav">
+ <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
+ <div id="signup">
+ <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
+ <input placeholder="Email address" type="email" name="email" tabindex="2"></input>
+ <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
+ </form>
+ <div id="signupconf">Thanks! We'll keep you updated.</div>
+ <script language="JavaScript">
+ <!--
+ function _submit_form(){
+ document.getElementById('signupform').style.display = 'none';
+ document.getElementById('signupconf').style.display = 'block';
+ return true
+ }
+ //-->
+ </script>
+ </div> <!-- signup -->
+ <label for="menu-toggle"><img src="img/menu.png"></label>
+ <input type="checkbox" id="menu-toggle"/>
+ <ul id="menu">
+ <li><a href="index.html" id="indexnav">Home</a></li>
+ <li><a href="download.html" id="downloadnav">Download</a></li>
+ <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
+ <li><a href="about.html" id="aboutnav">About Us</a></li>
+ <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
+ </ul>
+ </div> <!-- nav -->
+ </div> <!-- header -->
+ </div> <!-- header_container -->
- <p><strong>Michael Rogers</strong> started the Briar project to support freedom of expression, freedom of association and the right to privacy. He has studied and built peer-to-peer systems for over a decade, contributed to Freenet and LimeWire, and is now a postdoc researcher at TU Delft.</p>
+ <div id="container">
+ <div id="content">
+ <div class="full">
+ <h2>About us</h2>
+
+ <p><strong>Michael Rogers</strong> started the Briar project to support freedom of expression, freedom of association and the right to privacy. He has studied and built peer-to-peer systems for over a decade, contributed to Freenet and LimeWire, and is now a postdoc researcher at TU Delft.</p>
- <p><strong>Eleanor Saitta</strong> is a hacker, designer, artist, writer, and barbarian. She has ten years' experience as a security consultant, and makes a living and a vocation of understanding how complex systems operate and redesigning them to work, or at least fail, better.</p>
+ <p><strong>Eleanor Saitta</strong> is a hacker, designer, artist, writer, and barbarian. She has ten years' experience as a security consultant, and makes a living and a vocation of understanding how complex systems operate and redesigning them to work, or at least fail, better.</p>
- <p><strong>Bernard Tyers</strong> is an independent interaction designer and user researcher. He is interested in privacy and applying user-centred design to usable security. He is a long-time supporter of the Open Rights Group, Tor and free software projects.</p>
+ <p><strong>Bernard Tyers</strong> is an independent interaction designer and user researcher. He is interested in privacy and applying user-centred design to usable security. He is a long-time supporter of the Open Rights Group, Tor and free software projects.</p>
- <p><strong>Ximin Luo</strong> is a software engineer by trade, interested in decentralised systems, cryptography, and network security. He is a long-time supporter of anti-censorship and free software projects, and also contributes to Tor, Debian, and Freenet.</p>
+ <p><strong>Ximin Luo</strong> is a software engineer by trade, interested in decentralised systems, cryptography, and network security. He is a long-time supporter of anti-censorship and free software projects, and also contributes to Tor, Debian, and Freenet.</p>
+
+ <p>Briar has received funding from <a href="http://smallmediafoundation.com/">Small Media</a>, the <a href="https://openitp.org/">Open Internet Tools Project</a>, and <a href="https://accessnow.org/">Access</a>.</p>
- <p>Briar has received funding from <a href="http://smallmediafoundation.com/">Small Media</a>, the <a href="https://openitp.org/">Open Internet Tools Project</a>, and <a href="https://accessnow.org/">Access</a>.</p>
+ <p>To contact the team, please email <a href="mailto:contact@briarproject.org">contact@briarproject.org</a> [<a href="keys/contact.asc">PGP key</a>].</p>
- <p>To contact the team, please email <a href="mailto:contact@briarproject.org">contact@briarproject.org</a> [<a href="keys/contact.asc">PGP key</a>].</p>
+ </div> <!-- full -->
+ </div> <!-- content -->
+ </div> <!-- container -->
+ </div> <!-- wrapper -->
- </div> <!-- intro -->
- </div> <!-- content -->
- </div> <!-- container -->
<div class="clearboth"></div>
<div id="footer_container">
@@ -85,9 +89,6 @@
<ul>
<li><a href="copyright.html">Copyright</a></li>
<li>Site design by Reflective Spaces</li>
- <!--
- <li><a href="http://www.reflectivespaces.co.uk" target="_blank">Site design by Reflective Spaces</a></li>
- -->
</ul>
</div> <!-- footer -->
</div> <!-- footer_container -->
diff --git a/copyright.html b/copyright.html
index c9269be..1faaf9f 100644
--- a/copyright.html
+++ b/copyright.html
@@ -8,58 +8,61 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body id="copyright">
- <div id="header_container">
- <div id="header">
- <div id="logo">
- <a href="index.html"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></a>
- </div> <!-- logo -->
- <div id="nav">
- <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
- <div id="signup">
- <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
- <input placeholder="Email address" type="email" name="email" tabindex="2" ></input>
- <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
- </form>
- <div id="signupconf">Thanks! We'll keep you updated.</div>
- <script language="JavaScript">
- <!--
- function _submit_form(){
- document.getElementById('signupform').style.display = 'none';
- document.getElementById('signupconf').style.display = 'block';
- return true
- }
- //-->
- </script>
- </div> <!-- signup -->
- <ul>
- <li><a href="index.html" id="indexnav">Home</a></li>
- <li><a href="download.html" id="downloadnav">Download</a></li>
- <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
- <li><a href="about.html" id="aboutnav">About Us</a></li>
- <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
- </ul>
- </div> <!-- nav -->
- </div> <!-- header -->
- </div> <!-- header_container -->
+ <div id="wrapper">
+ <div id="header_container">
+ <div id="header">
+ <a href="index.html"><div id="logo"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></div></a>
+ <div id="nav">
+ <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
+ <div id="signup">
+ <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
+ <input placeholder="Email address" type="email" name="email" tabindex="2"></input>
+ <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
+ </form>
+ <div id="signupconf">Thanks! We'll keep you updated.</div>
+ <script language="JavaScript">
+ <!--
+ function _submit_form(){
+ document.getElementById('signupform').style.display = 'none';
+ document.getElementById('signupconf').style.display = 'block';
+ return true
+ }
+ //-->
+ </script>
+ </div> <!-- signup -->
+ <label for="menu-toggle"><img src="img/menu.png"></label>
+ <input type="checkbox" id="menu-toggle"/>
+ <ul id="menu">
+ <li><a href="index.html" id="indexnav">Home</a></li>
+ <li><a href="download.html" id="downloadnav">Download</a></li>
+ <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
+ <li><a href="about.html" id="aboutnav">About Us</a></li>
+ <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
+ </ul>
+ </div> <!-- nav -->
+ </div> <!-- header -->
+ </div> <!-- header_container -->
- <div id="container">
- <div id="content">
- <div class="intro">
- <h2 >Copyright</h2>
+ <div id="container">
+ <div id="content">
+ <div class="full">
+ <h2 >Copyright</h2>
- <p>Briar is free software. You can redistribute it and modify it under the terms of the <a href="https://gnu.org/licenses/gpl.txt">GNU General Public License</a>.</p>
+ <p>Briar is free software. You can redistribute it and modify it under the terms of the <a href="https://gnu.org/licenses/gpl.txt">GNU General Public License</a>.</p>
- <p>Google Play is a trademark of Google Inc. The Android robot is reproduced or modified from work created and shared by Google and used according to terms described in the <a href="https://creativecommons.org/licenses/by/3.0">Creative Commons 3.0 Attribution License</a>.</p>
+ <p>Google Play is a trademark of Google Inc. The Android robot is reproduced or modified from work created and shared by Google and used according to terms described in the <a href="https://creativecommons.org/licenses/by/3.0">Creative Commons 3.0 Attribution License</a>.</p>
- <p>The mobile phone image is reproduced or modified from work created and shared by <a href="https://secure.flickr.com/photos/vernieman">Vernon Chan</a> and used according to terms described in the <a href="https://creativecommons.org/licenses/by/2.0">Creative Commons 2.0 Attribution License</a>.</p>
+ <p>The mobile phone image is reproduced or modified from work created and shared by <a href="https://secure.flickr.com/photos/vernieman">Vernon Chan</a> and used according to terms described in the <a href="https://creativecommons.org/licenses/by/2.0">Creative Commons 2.0 Attribution License</a>.</p>
- <p>The server icon was created by <a href="http://www.visualpharm.com/">VisualPharm</a>.</p>
+ <p>The server icon was created by <a href="http://www.visualpharm.com/">VisualPharm</a>.</p>
- <p>All other content on this website is (c) 2014 Sublime Software Ltd. You can redistribute and modify it under the terms of the <a href="https://creativecommons.org/licenses/by/4.0">Creative Commons 4.0 Attribution License</a>.</p>
+ <p>All other content on this website is (c) 2014 Sublime Software Ltd. You can redistribute and modify it under the terms of the <a href="https://creativecommons.org/licenses/by/4.0">Creative Commons 4.0 Attribution License</a>.</p>
+
+ </div> <!-- full -->
+ </div> <!-- content -->
+ </div> <!-- container -->
+ </div> <!-- wrapper -->
- </div> <!-- intro -->
- </div> <!-- content -->
- </div> <!-- container -->
<div class="clearboth"></div>
<div id="footer_container">
@@ -83,9 +86,6 @@
<ul>
<li><a href="copyright.html">Copyright</a></li>
<li>Site design by Reflective Spaces</li>
- <!--
- <li><a href="http://www.reflectivespaces.co.uk" target="_blank">Site design by Reflective Spaces</a></li>
- -->
</ul>
</div> <!-- footer -->
</div> <!-- footer_container -->
diff --git a/css/styles.css b/css/styles.css
index 10076f6..8fa00f0 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -1,9 +1,9 @@
/* CSS Document */
body, html {
- height: 100%;
- margin: 0px auto;
- padding: 0px auto;
+ height:100%;
+ margin:0;
+ padding:0;
background-color:#fff;
font-size:1em;
font-family:Arial, Helvetica, sans-serif;
@@ -16,42 +16,62 @@ body#how a#hownav,
body#about a#aboutnav,
body#involved a#involvednav {color:#87C214;}
+#wrapper {
+ min-height:100%;
+ margin-bottom:-2em;
+}
+
img {
- margin:0px;
+ margin:0;
display:inline;
- padding:0px;
+ padding:0;
border:none;
- vertical-align: middle;
+ vertical-align:middle;
}
-figure {text-align:center;margin:0px 0px 50px 0px;padding:0px;}
+figure {
+ text-align:center;
+ margin:0 0 50px 0;
+ padding:0;
+}
-figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
+figcaption {
+ margin:10px 0 0 0;
+ font-weight:bold;
+ text-align:center;
+}
@-ms-viewport{
- zoom: 1.0;
- width: extend-to-zoom;
+ zoom:1.0;
+ width:extend-to-zoom;
}
.clearboth {clear:both;}
#header_container {
height:120px;
- position:fixed;
+ position:static;
width:100%;
top:0;
background-color:#2D3E50;
+ float:left;
}
-#header {margin:20px auto 0 auto;width:65%;}
+#header {
+ margin:20px auto 0 auto;
+ width:700px;
+}
-#logo {float:left;width:20%;}
+#logo {
+ float:left;
+ width:20%;
+}
.logo {
border:3px solid #2D3E50;
- -webkit-border-radius: 20px;
- -moz-border-radius: 20px;
- border-radius: 20px;
+ -webkit-border-radius:20px;
+ -moz-border-radius:20px;
+ border-radius:20px;
background-color:#fff;
padding:30px 20px 17px 20px;
margin-top:-40px;
@@ -63,24 +83,41 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
#nav {
font-weight:bold;
- padding:0px 0px 0px 0px;
+ padding:0 0 0 0;
float:right;
- margin:0px auto 10px auto;
+ margin:10px auto 10px auto;
vertical-align:bottom;
width:80%;
}
-#nav a:link {text-decoration:none;color:#fff;}
-#nav a:visited {text-decoration:none;color:#fff;}
-#nav a:hover {text-decoration:none;color:#87C214;}
-#nav a:active {text-decoration:none;color:#fff;}
+#nav a:link {
+ text-decoration:none;
+ color:#fff;
+}
+
+#nav a:visited {
+ text-decoration:none;
+ color:#fff;
+}
+
+#nav a:hover {
+ text-decoration:none;
+ color:#87C214;
+}
+
+#nav a:active {
+ text-decoration:none;
+ color:#fff;
+}
+
+#nav label {display:none;}
#nav ul {
clear:both;
display:block;
list-style-type:none;
font-size:0.9em;
- padding:0px 0px 0px 0px;
+ padding:0 0 0 0;
margin:0;
text-align:right;
height:auto;
@@ -89,27 +126,34 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
#nav li {
list-style-type:none;
display:inline;
- padding:0px 0px 0px 20px;
+ padding:0 0 0 20px;
text-transform:uppercase;
- margin:0px;
+ margin:0;
font-weight:bold;
white-space:nowrap;
}
#nav a.current {color:#87C214;}
+#menu-toggle {display:none;}
+
#signup2 {display:none;}
-#signupform {height:30px;padding-bottom:10px;float:right;text-align:right;}
+#signupform {
+ height:30px;
+ padding-bottom:10px;
+ float:right;
+ text-align:right;
+}
#signupform2 {
height:auto;
- padding-bottom:10px;
+ padding-bottom:0;
float:left;
width:80%;
font-size:1.5em;
padding-top:10px;
- padding-left:0px;
+ padding-left:0;
}
#signupconf {
@@ -121,7 +165,7 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
color:#fff;
font-size:0.9em;
font-weight:bold;
- padding-bottom:0px;
+ padding-bottom:0;
padding-top:10px;
}
@@ -133,7 +177,7 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
width:80%;
font-size:1.5em;
padding-top:10px;
- padding-left:0px;
+ padding-left:0;
}
#signupform input, textarea {
@@ -144,7 +188,7 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
background-color:#E2E1E1;
color:#565555;
padding:3px 5px;
- border:0px;
+ border:0;
}
#signupform2 input, textarea {
@@ -155,17 +199,17 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
background-color:#E2E1E1;
color:#565555;
padding:3px 5px;
- border:0px;
+ border:0;
}
#signupform button {
width:auto;
background-color:#C1392B;
color:#fff;
- border:0px;
- -webkit-border-radius: 5px;
- -moz-border-radius: 5px;
- border-radius: 5px;
+ border:0;
+ -webkit-border-radius:5px;
+ -moz-border-radius:5px;
+ border-radius:5px;
text-transform:uppercase;
font-size:0.6em;
font-weight:normal;
@@ -176,10 +220,10 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
width:auto;
background-color:#C1392B;
color:#fff;
- border:0px;
- -webkit-border-radius: 5px;
- -moz-border-radius: 5px;
- border-radius: 5px;
+ border:0;
+ -webkit-border-radius:5px;
+ -moz-border-radius:5px;
+ border-radius:5px;
text-transform:uppercase;
font-size:0.6em;
font-weight:normal;
@@ -188,61 +232,105 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
#container {
margin:0 auto;
- padding:175px 0 30px 0;
- width:65%;
+ padding:175px 0 3em 0;
+ width:700px;
background:#fff;
- height: 100%;
+ height:auto;
}
#content {
- margin:20px 60px 20px 180px;
+ margin:20px 0 0 0;
font-size:0.9em;
line-height:1.4em;
}
#content ul {}
-#content li {margin:0px 0px 10px 0px;}
+
+#content li {margin:0 0 10px 0;}
#content h1 {
- margin:23px 20px 0px 0px;
+ margin:23px 20px 0 0;
font-size:3.5em;
line-height:1.1em;
font-weight:normal;
}
#content h2 {
- margin:23px 20px 0px 0px;
- font-size:2.9em;
+ margin:23px 20px 0 0;
+ font-size:2.5em;
line-height:1.1em;
font-weight:normal;
}
#content h3 {
- margin:20px 20px 0px 0px;
+ margin:20px 20px 0 0;
font-size:2em;
line-height:1.1em;
font-weight:normal;
}
-#content h4 {margin:20px 20px 0px 0px;}
-#content h5 {margin:20px 20px 0px 0px;}
-#content h6 {margin:20px 20px 0px 0px;}
-#content p {margin:20px 20px 20px 0px;}
+#content h4 {
+ margin:20px 20px 0 0;
+ font-size:1.5em;
+ line-height:1.1em;
+ font-weight:normal;
+}
-#content a:link {text-decoration:none;color:#87C214;font-weight:bold;}
-#content a:visited {text-decoration:none;color:#87C214;font-weight:bold;}
-#content a:hover {text-decoration:none;color:#C1392B;font-weight:bold;}
-#content a:active {text-decoration:none;color:#87C214;font-weight:bold;}
+#content h5 {
+ margin:20px 20px 0 0;
+ font-size:1em;
+ line-height:1.1em;
+ font-weight:normal;
+}
+
+#content h6 {
+ margin:20px 20px 0 0;
+ font-size:1em;
+ line-height:1.1em;
+ font-weight:normal;
+}
+
+#content p {margin:20px 20px 20px 0;}
+
+#content a:link {
+ text-decoration:none;
+ color:#87C214;
+ font-weight:bold;
+}
+
+#content a:visited {
+ text-decoration:none;
+ color:#87C214;
+ font-weight:bold;
+}
+
+#content a:hover {
+ text-decoration:none;
+ color:#C1392B;
+ font-weight:bold;
+}
+
+#content a:active {
+ text-decoration:none;
+ color:#87C214;
+ font-weight:bold;
+}
-#content .intro #introlist {margin:27px 0px 32px 0px;padding-left:15px;}
-#content .intro #introlist li {margin:1em 20px 0px 0px;}
+#content .intro #introlist {
+ margin:30px 0 32px 10px;
+ padding-left:20px;
+}
+
+#content .intro #introlist ul {}
+
+#content .intro #introlist li {margin:1em 20px 0 0;}
#content .intro #sublist {
clear:both;
display:block;
list-style-type:none;
- padding:0px;
- margin:10px 0 0px 0;
+ padding:0;
+ margin:10px 0 0 0;
line-height:1.4em;
height:auto;
}
@@ -251,33 +339,51 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
float:left;
list-style-type:none;
display:inline;
- padding:0px 20px 0px 0px;
- margin:10px 0px 0px 0px;
+ padding:0 20px 0 0;
+ margin:10px 0 0 0;
white-space:nowrap;
}
#sublist a.selected {color:#C1392B;}
-.intro {width:70%;float:left;padding-bottom:40px;}
-.full {width:100%;float:left;padding-bottom:40px;}
+.intro {
+ width:70%;
+ float:left;
+ padding-bottom:40px;
+}
+
+.full {
+ width:100%;
+ float:left;
+ padding-bottom:40px;
+}
+
+.intro .button {
+ margin-right:30px;
+ margin-bottom:20px;
+}
-.intro .button {margin-right:30px;margin-bottom:20px;}
.intro .button2 {margin-bottom:20px;}
-#phone {width:30%;float:left;display:inline;}
+#phone {
+ width:30%;
+ float:left;
+ display:inline;
+}
+
#phone2 {display:none;}
-#flattr {
- font-size:0.6em;
-}
+#flattr {font-size:0.6em;}
#footer_container {
- color:#666;
+ background-color:#87C214;
+ color:#fff;
bottom:0;
- height:30px;
+ height:2em;
left:0;
position:static;
width:100%;
+ clear:both;
}
#footer {
@@ -287,16 +393,15 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
text-align:center;
font-size:0.7em;
font-weight:bold;
- background-color:#87C214;
- color:#fff;
+ float:left;
}
#footer ul {
- width:65%;
+ width:700px;
display:block;
list-style-type:none;
font-size:0.9em;
- padding:0px 0px 0px 0px;
+ padding:0 0 0 0;
margin:0 auto;
text-align:left;
}
@@ -304,57 +409,57 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
#footer li {
list-style-type:none;
display:inline;
- padding:0px 10px 0px 0px;
- margin:0px;
+ padding:0 10px 0 0;
+ margin:0;
font-weight:normal;
}
-#footer a:link {text-decoration:none;color:#fff;}
-#footer a:visited {text-decoration:none;color:#fff;}
-#footer a:hover {text-decoration:none;color:#fff;}
-#footer a:active {text-decoration:none;color:#fff;}
-
-@media all and (max-width:1400px) {
- #header_container {
- position:static;
- float:left;
- width:100%;
- top:0;
- background-color:#2D3E50;
- }
- #header, #container {width:80%;}
- #footer ul {width:80%;}
- #content {margin-left:0px;margin-right:0px;}
+#footer a:link {
+ text-decoration:none;
+ color:#fff;
}
-@media all and (max-device-width:1100px) {
- #header_container {
- position:static;
- float:left;
- width:100%;
- top:0;
- background-color:#2D3E50;
- }
- #header, #container {width:80%;}
- #footer ul {width:80%;}
- #content {margin-left:0px;margin-right:0px;}
+#footer a:visited {
+ text-decoration:none;
+ color:#fff;
}
-@media all and (max-width:800px) {
- #nav {width:400px;}
- figure img {width:100%;}
+#footer a:hover {
+ text-decoration:none;
+ color:#fff;
}
-@media all and (max-device-width:800px) {
- #nav {width:400;}
- figure img {width:100%;}
+#footer a:active {
+ text-decoration:none;
+ color:#fff;
}
-@media all and (max-width:645px) {
- #nav {width:300px;}
- #header_container {height:auto;}
- #phone img {width:100px;}
- .intro {width:100%;}
+@media only screen and (max-width: 48em) {
+ #wrapper {margin-bottom:-5em;}
+
+ #content {
+ margin-left:0;
+ margin-right:0;
+ }
+
+ #content figure img {width:100%;}
+
+ #container {
+ width:90%;
+ padding-top:70px;
+ padding-bottom:5em;
+ }
+
+ #content h1 {
+ font-size:2em;
+ margin-top:15px;
+ }
+
+ #content h2 {
+ font-size:2em;
+ margin-top:15px;
+ }
+
#phone2 {
width:auto;
clear:both;
@@ -363,57 +468,107 @@ figcaption {margin:10px 0px 0px 0px;font-weight:bold;text-align:center;}
margin:20px 20px 20px 0;
float:left;
}
+
#phone {display:none;}
- #logo {margin-bottom:20px;}
-}
-@media screen and (max-device-width:645px) {
- #nav {width:300px;}
- #header_container {height:auto;}
- #phone img {width:100px;}
.intro {width:100%;}
- #phone2 {
+
+ .logo {display:none;}
+
+ #header {
+ height:auto;
+ margin:0;
+ width:100%;
+ float:left;
+ padding:0;
+ }
+
+ #logo {
+ padding:0;
+ margin:0;
+ float:left;
+ width:50%;
+ height:71px;
+ background-size:129px 51px;
+ -webkit-background-size:129px 51px;
+ -moz-background-size:129px 51px;
+ -o-background-size:129px 51px;
+ background-image:url('../img/briar_logo_sm.png');
+ background-position:1em 10px;
+ background-repeat: no-repeat;
+ }
+
+ #header_container {
+ height:auto;
+ position:static;
+ float:left;
+ margin:0;
+ }
+
+ #nav {
+ float:left;
+ width:50%;
+ margin:0;
+ }
+
+ #nav a {
+ width:100%;
+ height:3em;
+ display:block;
+ }
+
+ #nav label {
+ display:block;
+ float:right;
+ margin:0 1em 0 0;
+ line-height:71px;
+ }
+
+ label {cursor:pointer;}
+
+ #nav ul {display:none;}
+
+ #menu-toggle {display:none;}
+
+ #menu {display:none;}
+
+ #menu-toggle:checked + #menu {display:block;}
+
+ #menu li {
+ background:#2D3E50;
+ border-top:1px solid #34495e;
+ border-bottom:1px solid #273646;
+ margin-left:-100%;
+ display:block;
+ font-size:0.9em;
+ line-height:3em;
+ text-align:left;
+ padding:2px 0 0 30px;
+ }
+
+ #footer_container {height:5em;}
+
+ #footer ul {
width:auto;
clear:both;
- text-align:center;
- display:inline;
- margin:20px 20px 20px 0;
- float:left;
+ margin:10px 10px 10px 15px;
}
- #phone {display:none;}
- #logo {margin-bottom:20px;}
-}
-@media all and (max-width:520px) {
- #nav {width:200px;}
- #signupform {height:auto;width:150px;}
- #signupform button {margin:10px 0 0px 0;}
- #signupform input, textarea {margin-right:0px;}
- #content .intro #introlist {clear:both;}
- .intro p {clear:both;}
-}
+ #footer {text-align:left;}
-@media screen and (max-device-width:520px) {
- #nav {width:200px;}
- #signupform {height:auto;width:150px;}
- #signupform button {margin:10px 0 0px 0;}
- #signupform input, textarea {margin-right:0px;}
- #content .intro #introlist {clear:both;}
- .intro p {clear:both;}
-}
+ #footer form {
+ margin:10px 10px 0 15px;
+ padding:0;
+ }
+
+ #signup2 {
+ width:100%;
+ display:inline;
+ }
-@media all and (max-width:400px) {
- #nav {width:150px;}
- #header, #container {width:90%;}
- #container {padding-top:140px;}
- #signup2 {display:inline;}
#signup {display:none;}
}
-@media screen and (max-device-width:400px) {
- #nav {width:150px;}
- #header, #container {width:90%;}
- #container {padding-top:140px;}
- #signup2 {display:inline;}
- #signup {display:none;}
+@media only screen and (max-width: 28em) {
+ #content .intro #introlist {clear:both;}
}
diff --git a/download.html b/download.html
index 7d7db74..6d18c3a 100644
--- a/download.html
+++ b/download.html
@@ -8,50 +8,54 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body id="download">
- <div id="header_container">
- <div id="header">
- <div id="logo">
- <a href="index.html"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></a>
- </div> <!-- logo -->
- <div id="nav">
- <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
- <div id="signup">
- <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
- <input placeholder="Email address" type="email" name="email" tabindex="2" ></input>
- <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
- </form>
- <div id="signupconf">Thanks! We'll keep you updated.</div>
- <script language="JavaScript">
- <!--
- function _submit_form(){
- document.getElementById('signupform').style.display = 'none';
- document.getElementById('signupconf').style.display = 'block';
- return true
- }
- //-->
- </script>
- </div> <!-- signup -->
- <ul>
- <li><a href="index.html" id="indexnav">Home</a></li>
- <li><a href="download.html" id="downloadnav">Download</a></li>
- <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
- <li><a href="about.html" id="aboutnav">About Us</a></li>
- <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
- </ul>
- </div> <!-- nav -->
- </div> <!-- header -->
- </div> <!-- header_container -->
- <div id="container">
- <div id="content">
- <div class="intro">
- <h2>Coming Soon</h2>
+ <div id="wrapper">
+ <div id="header_container">
+ <div id="header">
+ <a href="index.html"><div id="logo"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></div></a>
+ <div id="nav">
+ <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
+ <div id="signup">
+ <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
+ <input placeholder="Email address" type="email" name="email" tabindex="2"></input>
+ <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
+ </form>
+ <div id="signupconf">Thanks! We'll keep you updated.</div>
+ <script language="JavaScript">
+ <!--
+ function _submit_form(){
+ document.getElementById('signupform').style.display = 'none';
+ document.getElementById('signupconf').style.display = 'block';
+ return true
+ }
+ //-->
+ </script>
+ </div> <!-- signup -->
+ <label for="menu-toggle"><img src="img/menu.png"></label>
+ <input type="checkbox" id="menu-toggle"/>
+ <ul id="menu">
+ <li><a href="index.html" id="indexnav">Home</a></li>
+ <li><a href="download.html" id="downloadnav">Download</a></li>
+ <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
+ <li><a href="about.html" id="aboutnav">About Us</a></li>
+ <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
+ </ul>
+ </div> <!-- nav -->
+ </div> <!-- header -->
+ </div> <!-- header_container -->
- <p>Briar for Android is currently in private beta and will be available for download soon. If you'd like to be informed when the app is available, please <a href="https://lists.sourceforge.net/lists/listinfo/briar-announce">join the announcement mailing list</a>.</p>
+ <div id="container">
+ <div id="content">
+ <div class="full">
+ <h2>Coming Soon</h2>
+
+ <p>Briar for Android is currently in private beta and will be available for download soon. If you'd like to be informed when the app is available, please <a href="https://lists.sourceforge.net/lists/listinfo/briar-announce">join the announcement mailing list</a>.</p>
+
+ </div> <!-- full -->
+ </div> <!-- content -->
+ </div> <!-- container -->
+ </div> <!-- wrapper -->
- </div> <!-- intro -->
- </div> <!-- content -->
- </div> <!-- container -->
<div class="clearboth"></div>
<div id="footer_container">
@@ -75,9 +79,6 @@
<ul>
<li><a href="copyright.html">Copyright</a></li>
<li>Site design by Reflective Spaces</li>
- <!--
- <li><a href="http://www.reflectivespaces.co.uk" target="_blank">Site design by Reflective Spaces</a></li>
- -->
</ul>
</div> <!-- footer -->
</div> <!-- footer_container -->
diff --git a/get-involved.html b/get-involved.html
index 4cbe911..72ca0a7 100644
--- a/get-involved.html
+++ b/get-involved.html
@@ -8,60 +8,64 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body id="involved">
- <div id="header_container">
- <div id="header">
- <div id="logo">
- <a href="index.html"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></a>
- </div> <!-- logo -->
- <div id="nav">
- <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
- <div id="signup">
- <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
- <input placeholder="Email address" type="email" name="email" tabindex="2" ></input>
- <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
- </form>
- <div id="signupconf">Thanks! We'll keep you updated.</div>
- <script language="JavaScript">
- <!--
- function _submit_form(){
- document.getElementById('signupform').style.display = 'none';
- document.getElementById('signupconf').style.display = 'block';
- return true
- }
- //-->
- </script>
- </div> <!-- signup -->
- <ul>
- <li><a href="index.html" id="indexnav">Home</a></li>
- <li><a href="download.html" id="downloadnav">Download</a></li>
- <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
- <li><a href="about.html" id="aboutnav">About Us</a></li>
- <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
- </ul>
- </div> <!-- nav -->
- </div> <!-- header -->
- </div> <!-- header_container -->
- <div id="container">
- <div id="content">
- <div class="intro">
- <h2>Get Involved</h2>
+ <div id="wrapper">
+ <div id="header_container">
+ <div id="header">
+ <a href="index.html"><div id="logo"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></div></a>
+ <div id="nav">
+ <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
+ <div id="signup">
+ <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
+ <input placeholder="Email address" type="email" name="email" tabindex="2"></input>
+ <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
+ </form>
+ <div id="signupconf">Thanks! We'll keep you updated.</div>
+ <script language="JavaScript">
+ <!--
+ function _submit_form(){
+ document.getElementById('signupform').style.display = 'none';
+ document.getElementById('signupconf').style.display = 'block';
+ return true
+ }
+ //-->
+ </script>
+ </div> <!-- signup -->
+ <label for="menu-toggle"><img src="img/menu.png"></label>
+ <input type="checkbox" id="menu-toggle"/>
+ <ul id="menu">
+ <li><a href="index.html" id="indexnav">Home</a></li>
+ <li><a href="download.html" id="downloadnav">Download</a></li>
+ <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
+ <li><a href="about.html" id="aboutnav">About Us</a></li>
+ <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
+ </ul>
+ </div> <!-- nav -->
+ </div> <!-- header -->
+ </div> <!-- header_container -->
- <p>The Briar project is looking for help! We need people to contribute to all aspects of the project, including design, development, documentation, translation and testing.</p>
+ <div id="container">
+ <div id="content">
+ <div class="full">
+ <h2>Get Involved</h2>
- <p>If you're a UX designer or a Java developer, we'd love to hear from you - we're happy to provide guidance or mentoring for less experienced developers. Knowledge of Android or Swing would be especially useful.</p>
+ <p>The Briar project is looking for help! We need people to contribute to all aspects of the project, including design, development, documentation, translation and testing.</p>
- <p>We're also looking for people who can help with technical documentation, user documentation, translations and testing.</p>
+ <p>If you're a UX designer or a Java developer, we'd love to hear from you - we're happy to provide guidance or mentoring for less experienced developers. Knowledge of Android or Swing would be especially useful.</p>
- <p>If you're interested in getting involved or following the progress of the project, please <a href="https://lists.sourceforge.net/lists/listinfo/briar-devel">join the development mailing list</a>.</p>
+ <p>We're also looking for people who can help with technical documentation, user documentation, translations and testing.</p>
- <p>All our software is open source - you can <a href="http://code.briarproject.org/akwizgran/briar/tree/master">browse the source code</a> or clone the Git repository:</p>
+ <p>If you're interested in getting involved or following the progress of the project, please <a href="https://lists.sourceforge.net/lists/listinfo/briar-devel">join the development mailing list</a>.</p>
- <p align="center"><strong> git clone http://code.briarproject.org/akwizgran/briar.git</strong></p>
+ <p>All our software is open source - you can <a href="https://code.briarproject.org/akwizgran/briar/tree/master">browse the source code</a> or clone the Git repository:</p>
+
+ <p align="center"><strong> git clone https://code.briarproject.org/akwizgran/briar.git</strong></p>
+
+ </div> <!-- full -->
+ </div> <!-- content -->
+ </div> <!-- container -->
+ </div> <!-- wrapper -->
- </div> <!-- intro -->
- </div> <!-- content -->
- </div> <!-- container -->
<div class="clearboth"></div>
<div id="footer_container">
@@ -85,9 +89,6 @@
<ul>
<li><a href="copyright.html">Copyright</a></li>
<li>Site design by Reflective Spaces</li>
- <!--
- <li><a href="http://www.reflectivespaces.co.uk" target="_blank">Site design by Reflective Spaces</a></li>
- -->
</ul>
</div> <!-- footer -->
</div> <!-- footer_container -->
diff --git a/how-it-works.html b/how-it-works.html
index 8171826..ea5c13f 100644
--- a/how-it-works.html
+++ b/how-it-works.html
@@ -8,46 +8,50 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body id="how">
- <div id="header_container">
- <div id="header">
- <div id="logo">
- <a href="index.html"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></a>
- </div> <!-- logo -->
- <div id="nav">
- <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
- <div id="signup">
- <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
- <input placeholder="Email address" type="email" name="email" tabindex="2" ></input>
- <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
- </form>
- <div id="signupconf">Thanks! We'll keep you updated.</div>
- <script language="JavaScript">
- <!--
- function _submit_form(){
- document.getElementById('signupform').style.display = 'none';
- document.getElementById('signupconf').style.display = 'block';
- return true
- }
- //-->
- </script>
- </div> <!-- signup -->
- <ul>
- <li><a href="index.html" id="indexnav">Home</a></li>
- <li><a href="download.html" id="downloadnav">Download</a></li>
- <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
- <li><a href="about.html" id="aboutnav">About Us</a></li>
- <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
- </ul>
- </div> <!-- nav -->
- </div> <!-- header -->
- </div> <!-- header_container -->
- <div id="container">
- <div id="content">
- <div class="full">
- <h2>How it Works</h2>
+ <div id="wrapper">
+ <div id="header_container">
+ <div id="header">
+ <a href="index.html"><div id="logo"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></div></a>
+ <div id="nav">
+ <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
+ <div id="signup">
+ <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
+ <input placeholder="Email address" type="email" name="email" tabindex="2"></input>
+ <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
+ </form>
+ <div id="signupconf">Thanks! We'll keep you updated.</div>
+ <script language="JavaScript">
+ <!--
+ function _submit_form(){
+ document.getElementById('signupform').style.display = 'none';
+ document.getElementById('signupconf').style.display = 'block';
+ return true
+ }
+ //-->
+ </script>
+ </div> <!-- signup -->
+ <label for="menu-toggle"><img src="img/menu.png"></label>
+ <input type="checkbox" id="menu-toggle"/>
+ <ul id="menu">
+ <li><a href="index.html" id="indexnav">Home</a></li>
+ <li><a href="download.html" id="downloadnav">Download</a></li>
+ <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
+ <li><a href="about.html" id="aboutnav">About Us</a></li>
+ <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
+ </ul>
+ </div> <!-- nav -->
+ </div> <!-- header -->
+ </div> <!-- header_container -->
- <p>Briar is a messaging app designed for activists, journalists, and
+ <div id="container">
+ <div id="content">
+ <div class="full">
+ <h2>How it Works</h2>
+
+ <div class="clearboth"></div>
+
+ <p>Briar is a messaging app designed for activists, journalists, and
anyone else who needs a safe, easy and robust way to communicate.
Unlike traditional messaging tools such as email, Twitter or Telegram,
Briar doesn't rely on a central server - messages are synchronized
@@ -56,48 +60,49 @@ sync via Bluetooth or Wi-Fi, keeping the information flowing in a
crisis. If the Internet's up, Briar can sync via the Tor network,
protecting users and their relationships from surveillance.</p>
- <figure>
- <img src="img/diagram_secure.png" class="" alt="Briar"/>
- <figcaption>Briar uses direct, encrypted connections between users to
+ <figure>
+ <img src="img/diagram_secure.png" class="" alt="Briar"/>
+ <figcaption>Briar uses direct, encrypted connections between users to
prevent surveillance and censorship.</figcaption>
- </figure>
+ </figure>
- <figure>
- <img src="img/diagram_insecure.png" class="" alt="Typical messaging software"/>
- <figcaption>Typical messaging software relies on central servers and exposes messages and relationships to surveillance.</figcaption>
- </figure>
+ <figure>
+ <img src="img/diagram_insecure.png" class="" alt="Typical messaging software"/>
+ <figcaption>Typical messaging software relies on central servers and exposes messages and relationships to surveillance.</figcaption>
+ </figure>
- <p>Briar provides private messaging and public forums that are protected
-against the following surveillance and censorship threats:</p>
+ <p>Briar provides private messaging and public forums that are protected against the following surveillance and censorship threats:</p>
- <ul>
- <li><strong>Metadata surveillance.</strong> Briar uses the Tor network to prevent eavesdroppers from learning which users are talking to each other. Each user's contact list is encrypted and stored on her own device.</li>
- <li><strong>Content surveillance.</strong> All communication between devices is encrypted end-to-end, protecting the content from eavesdropping or tampering.</li>
- <li><strong>Content filtering.</strong> Briar's end-to-end encryption prevents keyword filtering, and because of its decentralized design there are no
+ <ul>
+ <li><strong>Metadata surveillance.</strong> Briar uses the Tor network to prevent eavesdroppers from learning which users are talking to each other. Each user's contact list is encrypted and stored on her own device.</li>
+ <li><strong>Content surveillance.</strong> All communication between devices is encrypted end-to-end, protecting the content from eavesdropping or tampering.</li>
+ <li><strong>Content filtering.</strong> Briar's end-to-end encryption prevents keyword filtering, and because of its decentralized design there are no
servers to block.</li>
- <li><strong>Takedown orders.</strong> Every user who subscribes to a forum keeps a copy of its content, so there's no single point where a post can be deleted.</li>
- <li><strong>Denial of service attacks.</strong> Briar's forums have no central server to attack, and every subscriber has access to the content even if they're offline.</li>
- <li><strong>Internet blackouts.</strong> Briar can operate over Bluetooth and Wi-Fi to keep information flowing during blackouts.</li>
- </ul>
+ <li><strong>Takedown orders.</strong> Every user who subscribes to a forum keeps a copy of its content, so there's no single point where a post can be deleted.</li>
+ <li><strong>Denial of service attacks.</strong> Briar's forums have no central server to attack, and every subscriber has access to the content even if they're offline.</li>
+ <li><strong>Internet blackouts.</strong> Briar can operate over Bluetooth and Wi-Fi to keep information flowing during blackouts.</li>
+ </ul>
- <p>Briar is designed to resist surveillance and censorship by an adversary with the following capabilities:</p>
+ <p>Briar is designed to resist surveillance and censorship by an adversary with the following capabilities:</p>
- <ul>
- <li>All long-range communication channels (internet, phone network, etc) are comprehensively monitored by the adversary.</li>
- <li>The adversary can block, delay, replay and modify traffic on long-range communication channels.</li>
- <li>The adversary has a limited ability to monitor short-range communication channels (Bluetooth, WiFi, etc).</li>
- <li>The adversary has a limited ability to block, delay, replay and modify traffic on short-range communication channels.</li>
- <li>The adversary can deploy an unlimited number of devices running Briar.</li>
- <li>There are some users who can keep their devices secure - those who can't are considered, for the purposes of the threat model, to be controlled by the adversary.</li>
- <li>The adversary has a limited ability to persuade users to trust the adversary's agents - thus the number of social connections between the adversary's agents and the rest of the network is limited.</li>
- <li>The adversary can't break standard cryptographic primitives.</li>
- </ul>
+ <ul>
+ <li>All long-range communication channels (internet, phone network, etc) are comprehensively monitored by the adversary.</li>
+ <li>The adversary can block, delay, replay and modify traffic on long-range communication channels.</li>
+ <li>The adversary has a limited ability to monitor short-range communication channels (Bluetooth, WiFi, etc).</li>
+ <li>The adversary has a limited ability to block, delay, replay and modify traffic on short-range communication channels.</li>
+ <li>The adversary can deploy an unlimited number of devices running Briar.</li>
+ <li>There are some users who can keep their devices secure - those who can't are considered, for the purposes of the threat model, to be controlled by the adversary.</li>
+ <li>The adversary has a limited ability to persuade users to trust the adversary's agents - thus the number of social connections between the adversary's agents and the rest of the network is limited.</li>
+ <li>The adversary can't break standard cryptographic primitives.</li>
+ </ul>
- <p>Our long-term plans go far beyond messaging: we'll use Briar's data synchronization capabilities to support secure, distributed applications including blogging, crisis mapping and collaborative document editing. Our goal is to enable people in any country to create safe spaces where they can debate any topic, plan events, and organise social movements.</p>
+ <p>Our long-term plans go far beyond messaging: we'll use Briar's data synchronization capabilities to support secure, distributed applications including blogging, crisis mapping and collaborative document editing. Our goal is to enable people in any country to create safe spaces where they can debate any topic, plan events, and organise social movements.</p>
+
+ </div> <!-- full -->
+ </div> <!-- content -->
+ </div> <!-- container -->
+ </div> <!-- wrapper -->
- </div> <!-- full -->
- </div> <!-- content -->
- </div> <!-- container -->
<div class="clearboth"></div>
<div id="footer_container">
@@ -121,9 +126,6 @@ servers to block.</li>
<ul>
<li><a href="copyright.html">Copyright</a></li>
<li>Site design by Reflective Spaces</li>
- <!--
- <li><a href="http://www.reflectivespaces.co.uk" target="_blank">Site design by Reflective Spaces</a></li>
- -->
</ul>
</div> <!-- footer -->
</div> <!-- footer_container -->
diff --git a/img/briar_logo_sm.png b/img/briar_logo_sm.png
new file mode 100644
index 0000000000000000000000000000000000000000..9921a10ab8161e0199cf5e97f2d3cdfb9e8cb59b
GIT binary patch
literal 6425
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
K7LUyQ6aNP!BFG2;
literal 0
HcmV?d00001
diff --git a/img/menu.png b/img/menu.png
new file mode 100644
index 0000000000000000000000000000000000000000..e9f35656e397cb10a7307a4f96727c74cb1c9af4
GIT binary patch
literal 292
zcmeAS@N?(olHy`uVBq!ia0vp^T0ktz!2~3O?`28?DVB6cUq=Rp^(V|(yIunMk|nMY
zCBgY=CFO}lsSJ)O`AMk?p1FzXsX?iUDV2pMQ*D5Xwt2cZhE&{2y0Vo!LBfJTz`=)y
znTvrbqhT#O#{$M}ataL*57v0IU%z}d%=Whf2eU#0+l}uGj3x)JF|%A?h~^h?(3$bk
z(I2Rh`Au~LgH*z6Mr6%wJ8m!n&G}~Qz`(oVD_ozrHHf(nW(C`gD!A5eSrGF+%yi})
hkk*2Y%*Yn-Fq~82vA&`*LlNi$22WQ%mvv4FO#oBjRv`cY
literal 0
HcmV?d00001
diff --git a/index.html b/index.html
index 37c345e..4d9be82 100644
--- a/index.html
+++ b/index.html
@@ -8,67 +8,77 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body id="index">
- <div id="header_container">
- <div id="header">
- <div id="logo">
- <a href="index.html"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></a>
- </div> <!-- logo -->
- <div id="nav">
- <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
- <div id="signup">
- <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
- <input placeholder="Email address" type="email" name="email" tabindex="2" ></input>
- <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
- </form>
- <div id="signupconf">Thanks! We'll keep you updated.</div>
- <script language="JavaScript">
- <!--
- function _submit_form(){
- document.getElementById('signupform').style.display = 'none';
- document.getElementById('signupconf').style.display = 'block';
- return true
- }
- //-->
- </script>
- </div> <!-- signup -->
- <ul>
- <li><a href="index.html" id="indexnav">Home</a></li>
- <li><a href="download.html" id="downloadnav">Download</a></li>
- <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
- <li><a href="about.html" id="aboutnav">About Us</a></li>
- <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
- </ul>
- </div> <!-- nav -->
- </div> <!-- header -->
- </div> <!-- header_container -->
- <div id="container">
- <div id="content">
- <div class="intro">
- <h2>Secure messaging, anywhere</h2>
- <div id="phone2">
+ <div id="wrapper">
+ <div id="header_container">
+ <div id="header">
+ <a href="index.html"><div id="logo"><img src="img/briar_logo_large.png" alt="Briar" class="logo"/></div></a>
+ <div id="nav">
+ <iframe id="signupframe" style="display: none" name="signupframe" src="about:blank"></iframe>
+ <div id="signup">
+ <form id="signupform" action="https://lists.sourceforge.net/lists/subscribe/briar-announce" target="signupframe" method="post">
+ <input placeholder="Email address" type="email" name="email" tabindex="2"></input>
+ <button name="submit" type="submit" id="signup-submit" onClick="_submit_form();">Keep me updated</button>
+ </form>
+ <div id="signupconf">Thanks! We'll keep you updated.</div>
+ <script language="JavaScript">
+ <!--
+ function _submit_form(){
+ document.getElementById('signupform').style.display = 'none';
+ document.getElementById('signupconf').style.display = 'block';
+ return true
+ }
+ //-->
+ </script>
+ </div> <!-- signup -->
+ <label for="menu-toggle"><img src="img/menu.png"></label>
+ <input type="checkbox" id="menu-toggle"/>
+ <ul id="menu">
+ <li><a href="index.html" id="indexnav">Home</a></li>
+ <li><a href="download.html" id="downloadnav">Download</a></li>
+ <li><a href="how-it-works.html" id="hownav">How it Works</a></li>
+ <li><a href="about.html" id="aboutnav">About Us</a></li>
+ <li><a href="get-involved.html" id="involvednav">Get Involved</a></li>
+ </ul>
+ </div> <!-- nav -->
+ </div> <!-- header -->
+ </div> <!-- header_container -->
+
+ <div id="container">
+ <div id="content">
+ <div class="intro">
+ <h2>Secure messaging, anywhere</h2>
+
+ <div id="phone2">
+ <img src="img/phone.gif" class="phone" alt="Screenshots"/>
+ </div>
+
+ <ul id="introlist">
+ <li>Peer-to-peer encrypted messaging and forums</li>
+ <li>Messages are stored securely on your device, not in the cloud</li>
+ <li>Connect directly with nearby contacts - no Internet access required</li>
+ <li>Free and open source software</li>
+ </ul>
+ </div> <!-- intro -->
+
+ <div id="phone">
<img src="img/phone.gif" class="phone" alt="Screenshots"/>
</div>
- <ul id="introlist">
- <li>Peer-to-peer encrypted messaging and forums</li>
- <li>Messages are stored securely on your device, not in the cloud</li>
- <li>Connect directly with nearby contacts - no Internet access required</li>
- <li>Free and open source software</li>
- </ul>
- </div> <!-- intro -->
- <div id="phone">
- <img src="img/phone.gif" class="phone" alt="Screenshots"/>
- </div>
- <div class="clearboth"></div>
- </div> <!-- content -->
- </div> <!-- container -->
- <div id='flattr'>
- <center>
- <a href='https://flattr.com/thing/592836/Briar-A-Secure-News-and-Discussion-System' target='_blank'><img src='img/flattr-badge-large.png' alt='Flattr this' title='Flattr this' border='0' /></a> <br />
-Bitcoin: 1NZCKkUCtJV2U2Y9hDb9uq8S7ksFCFGR6K
- </center>
- </div>
+ <div class="clearboth"></div>
+
+ <div id="flattr">
+ <center>
+ <a href="https://flattr.com/t/592836/" target="_blank"><img src="img/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0"/></a>
+ <br />
+ Bitcoin: 1NZCKkUCtJV2U2Y9hDb9uq8S7ksFCFGR6K
+ </center>
+ </div> <!-- flattr -->
+ </div> <!-- content -->
+ </div> <!-- container -->
+
+ </div> <!-- wrapper -->
+
<div class="clearboth"></div>
<div id="footer_container">
@@ -92,9 +102,6 @@ Bitcoin: 1NZCKkUCtJV2U2Y9hDb9uq8S7ksFCFGR6K
<ul>
<li><a href="copyright.html">Copyright</a></li>
<li>Site design by Reflective Spaces</li>
- <!--
- <li><a href="http://www.reflectivespaces.co.uk" target="_blank">Site design by Reflective Spaces</a></li>
- -->
</ul>
</div> <!-- footer -->
</div> <!-- footer_container -->
--
GitLab