lego/templates/secure-connections.html
2019-10-02 15:37:14 +02:00

72 lines
2.0 KiB
HTML

<p>{{ _("The following visualization shows what information is visible to eavesdroppers with and without Tor Browser and HTTPS encryption:") }}</p>
<ul>
<li>{{ _("Click the “Tor” button to see what data is visible to observers when you're using Tor. The button will turn green to indicate that Tor is on.") }}</li>
<li>{{ _("Click the “HTTPS” button to see what data is visible to observers when you're using HTTPS. The button will turn green to indicate that HTTPS is on.") }}</li>
<li>{{ _("When both buttons are green, you see the data that is visible to observers when you are using both tools.") }}</li>
<li>{{ _("When both buttons are grey, you see the data that is visible to observers when you don't use either tool.") }}</li>
</ul>
<br />
<label>{{ _("HTTPS") }}</label>
<input class="toggle" type="checkbox" id="https-switch"/>
<br />
<label>{{ _("Tor") }}</label>
<input class="toggle" type="checkbox" id="tor-switch"/>
<br />
<div id="http-content" class="switch-off">
<img src="{{ '/static/images/tor-https-0.png'|asseturl }}" />
</div>
<div id="https-content" class="switch-off">
<img src="{{ '/static/images/tor-https-1.png'|asseturl }}" />
</div>
<div id="tor-content" class="switch-off">
<img src="{{ '/static/images/tor-https-2.png'|asseturl }}" />
</div>
<div id="https-tor-content" class="switch-on">
<img src="{{ '/static/images/tor-https-3.png'|asseturl }}" />
</div>
<h5>{{ _("POTENTIALLY VISIBLE DATA") }}</h5>
<dl>
<dt>
{{ _("Site.com") }}
</dt>
<dd>
{{ _("The site being visited.") }}
</dd>
<dt>
{{ _("user / pw") }}
</dt>
<dd>
{{ _("Username and password used for authentication.") }}
</dd>
<dt>
{{ _("data") }}
</dt>
<dd>
{{ _("Data being transmitted.") }}
</dd>
<dt>
{{ _("location") }}
</dt>
<dd>
{{ _("Network location of the computer used to visit the website (the public IP address).") }}
</dd>
<dt>
{{ _("Tor") }}
</dt>
<dd>
{{ _("Whether or not Tor is being used.") }}
</dd>
</dl>