Update the main page on the static website

This commit is contained in:
Arlo Breault 2019-07-12 21:31:36 +02:00
parent 6c6707ae9b
commit d6d42e82aa
7 changed files with 145 additions and 169 deletions

Binary file not shown.

BIN
proxy/static/chrome150.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.2 KiB

BIN
proxy/static/firefox150.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 44 KiB

78
proxy/static/index.css Normal file
View file

@ -0,0 +1,78 @@
@font-face {
font-family: Source Sans Pro;
src: url("SourceSansPro-Regular.ttf");
}
body {
margin: 0;
font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-size: 1.3rem;
font-weight: 400;
line-height: 1.5;
background-color: #59316B;
color: #212529;
}
#header {
margin: 0;
line-height: 0;
padding: 1.3rem 2.6rem;
}
#header a {
border-style: none;
display: inline-block;
line-height: 0;
}
#content {
margin: 0 0 2.6rem 0;
padding: 2.6rem 5.2rem;
background-color: #FFFFFF;
}
h1 {
margin: 0;
font-size: 2.6rem;
color: #7D4698;
text-align: center;
}
h3 {
margin: 0;
font-size: 2rem;
color: #7D4698;
}
.clear {
margin: 2.6rem 0;
overflow: auto;
}
@media only screen and (min-width: 600px) {
.browser, .extension {
float: left;
width: 50%;
}
.padding {
padding: 0 1.3rem;
}
}
.addon {
margin-top: 2.6rem 0;
text-align: center;
}
.addon a {
display: inline-block;
padding: 0 1.3rem;
}
.diagram, .screenshot {
text-align: center;
}
.diagram img, .screenshot img {
max-width: 100%;
}

View file

@ -1,184 +1,82 @@
<!doctype html> <!doctype html>
<html> <html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Snowflake</title>
<link rel="stylesheet" href="index.css" />
</head>
<body>
<div id="header">
<a href="https://www.torproject.org/">
<img src="tor-logo@2x.png" alt="Tor" height="50px" />
</a>
</div>
<div id="content">
<h1>SNOWFLAKE</h1>
<head> <p class="diagram"><img src="https://trac.torproject.org/projects/tor/raw-attachment/wiki/doc/Snowflake/snowflake-schematic.png" alt="Diagram" /></p>
<title>Snowflake</title>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<style>
body {
text-align: center; margin: auto;
width: 50%;
min-width: 40em;
}
textarea {
width: 100%;
height: 4em;
font-size: 12px;
resize: none;
padding: 1em;
}
#options {
background-color: rgba(0,0,0,0.8);
color: #fff;
resize: none;
position: relative; border: none;
width: 30rem;
padding: 3rem; margin: auto; margin-top: 1rem;
cursor: default;
}
#options .active {
color: #2F2 !important;
}
</style>
</head>
<body> <p>Snowflake is a system to defeat internet censorship. People who are
censored can use Snowflake to access the internet. Their connection goes
through Snowflake proxies, which are run by volunteers. For more detailed
information about how Snowflake works see our
<a href="https://trac.torproject.org/projects/tor/wiki/doc/Snowflake/">documentation wiki</a>.</p>
<h1>Snowflake</h1> <div class="clear">
<p> <div class="browser"><div class="padding">
<a href="https://trac.torproject.org/projects/tor/wiki/doc/Snowflake" target="_blank">Snowflake</a> <h3>Browser</h3>
is a WebRTC pluggable transport for Tor.
</p>
<p> <p>If your internet access is censored, you should download
This page enables you to use your web browser as a proxy to help other <a href="https://www.torproject.org/download/">Tor Browser</a>.</p>
Internet users in censored places.
When you click yes, your browser will act as a
censorship circumvention proxy
as long as you are viewing a page with the snowflake badge.
</p>
<div id='options'> <p class="screenshot"><img src="screenshot.png" alt="Tor Browser screenshot" /></p>
</div></div>
<noscript> <div class="extension"><div class="padding">
<hr/> <h3>Extension</h3>
Snowflake proxy requires javascript.
<br/>
To volunteer as a proxy, please enable javascript.
</noscript>
<div id='buttons' style='display:none'> <p>If your internet access is <strong>not</strong> censored, you should
<p> consider installing the Snowflake extension to help users in censored
Do you want your browser to act as a proxy? networks. There is no need to worry about which websites people are
</p> accessing through your proxy. Their visible browsing IP address will
match their Tor exit node, not yours.</p>
<p> <p class="addon">
<button onclick="enableSnowflake()"> <a href="https://addons.mozilla.org/en-US/firefox/addon/torproject-snowflake/">
Yes <img src="firefox150.jpg" alt="Install in Firefox" height="100px" /><br />
</button> <span>Install in Firefox</span>
<button onclick="disableSnowflake()"> </a>
No <a href="https://chrome.google.com/webstore/detail/snowflake/mafpmfcccpbjnhfhjnllmmalhifmlcie">
</button> <img src="chrome150.jpg" alt="Install in Chrome" height="100px" /><br />
</p> <span>Install in Chrome</span>
<div id="snowflake-status"></div> </a>
</div> <span class="clear"></span>
</p>
</div></div>
<div id='cookies-disabled' style='display:none'> </div>
<hr/>
<p>
Your browser has cookies disabled. You will need to enable them in order
to set Snowflake preferences.
</p>
</div>
</div> <h3>REPORTING BUGS</h3>
<p> <p>If you encounter problems with Snowflake as a client or a proxy,
Minimum functionality has been achieved, and it is possible please consider filing a bug. To do so, you will have to,</p>
to bootstrap a Tor client to 100% using Snowflake, and the
browsing experience using this PT is reasonable enough.
</p>
<p> <ol>
However, Snowflake is also under active development and much work is needed. <li>
<br/> Either <a href="https://trac.torproject.org/projects/tor/register">create an
It is not yet stable or audited, probably has many issues, account</a> or <a href="https://trac.torproject.org/projects/tor/login">log in</a>
and should not yet be relied upon!! using the shared <b>cypherpunks</b> account with password <b>writecode</b>.</li>
</p> <li><a href="https://trac.torproject.org/projects/tor/newticket?component=Circumvention%2FSnowflake">File a ticket</a>
using our bug tracker.</li>
</ol>
See <p>Please try to be as descriptive as possible with your ticket and if
<a href="https://trac.torproject.org/projects/tor/wiki/doc/Snowflake" possible include log messages that will help us reproduce the bug.
target="_blank"> Consider adding keywords <em>snowflake-webextension</em> or <em>snowflake-client</em>
here</a> for more information. to let us know how which part of the Snowflake system is experiencing
problems.</p>
<hr> </div>
</body>
<p>
It is now possible to embed the Snowflake badge on any website:
</p>
<textarea readonly>
&lt;iframe src="https://snowflake.torproject.org/embed.html" width="88" height="16" frameborder="0" scrolling="no"&gt;&lt;/iframe&gt;
</textarea>
<p>
Which looks like this:
</p>
<iframe src="embed.html" width="88" height="16" frameborder="0" scrolling="no"></iframe>
<p>
If it animates, then congratulations -- you are currently acting as a Tor bridge.
</p>
<hr>
Repo: <a target="_blank"
href="https://gitweb.torproject.org/pluggable-transports/snowflake.git/">
gitweb.torproject.org/pluggable-transports/snowflake.git
</a>
<br/>
Last update: <time>2019-01-22</time>
<script>
// Defaults to opt-in.
var COOKIE_NAME = "snowflake-allow";
var COOKIE_LIFETIME = "Thu, 01 Jan 2038 00:00:00 GMT";
function readCookie(cookie) {
c = document.cookie.split('; ');
cookies = {};
for (i = 0 ; i < c.length ; i++) {
pair = c[i].split('=');
cookies[pair[0]] = pair[1];
}
return cookies[cookie];
}
function enableSnowflake() {
setSnowflakeCookie(1);
location.reload();
}
function disableSnowflake() {
setSnowflakeCookie(0);
location.reload();
}
function setSnowflakeCookie(val) {
document.cookie = COOKIE_NAME + "=" + val + ";path=/ ;expires=" + COOKIE_LIFETIME;
}
window.onload = function() {
if (navigator.cookieEnabled) {
// Both JS and cookies enabled -- display normal buttons.
document.getElementById('buttons').style = '';
} else {
// Display the cookies disabled message if necessary.
document.getElementById('cookies-disabled').style = '';
}
var enabled = readCookie(COOKIE_NAME);
var $status = document.getElementById('snowflake-status');
if ("1" === enabled) {
$status.innerHTML = 'Snowflake Proxy is ACTIVE <br/><br/>' +
'Thank you for contributing to internet freedom!';
$status.className = 'active';
} else {
$status.innerHTML = 'Snowflake Proxy is OFF';
$status.className = '';
}
}
</script>
</body>
</html> </html>

BIN
proxy/static/screenshot.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 369 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.8 KiB