text & design adjustments

master
alice 3 years ago
parent 3058d8834c
commit 17487e29d8

@ -87,7 +87,7 @@ div#captcha > div {
header{ header{
color: #1c619a; color: #1c619a;
padding: 1em 6em; padding: 2em 8em;
} }
header .inner { header .inner {
display: flex; display: flex;
@ -206,7 +206,7 @@ header .site-menu a{
@media screen and (max-width: 64em) { @media screen and (max-width: 64em) {
header { header {
padding: 0.6em 1em; padding: 1em 2em;
} }
header nav { header nav {
margin-left: 3em; margin-left: 3em;
@ -292,9 +292,6 @@ header .site-menu a{
} }
.content h2 { .content h2 {
font-size: 1.5em;
font-weight: normal;
font-weight: 400; font-weight: 400;
text-align: center; text-align: center;
font-family: 'Arvo', serif; font-family: 'Arvo', serif;
@ -310,6 +307,7 @@ header .site-menu a{
.flex-page { .flex-page {
display: flex; display: flex;
margin: 0 auto 0 auto; margin: 0 auto 0 auto;
align-items: flex-start;
} }
.flex-page .left-menu { .flex-page .left-menu {
display: block; display: block;
@ -624,9 +622,9 @@ ul.errorlist {
.homepage h2 { .homepage h2 {
text-align: center; text-align: center;
font-family: 'Open Sans', sans-serif; font-family: 'Open Sans', sans-serif;
font-size: 2.3em; font-size: 2.5em;
font-weight: bold; font-weight: bold;
margin: 3em 0.5em; margin: 2.75em 0.5em;
-webkit-text-fill-color: #D99C7E; -webkit-text-fill-color: #D99C7E;
-webkit-text-stroke-width: 1px; -webkit-text-stroke-width: 1px;
@ -660,7 +658,7 @@ ul.errorlist {
.homepage h3 { .homepage h3 {
font-family: 'Arvo', serif; font-family: 'Arvo', serif;
font-weight: normal; font-weight: normal;
font-size: 1.2em; font-size: 1.3em;
} }
.homepage ul { .homepage ul {
list-style-type: circle; list-style-type: circle;
@ -702,6 +700,9 @@ ul.errorlist {
} }
@media screen and (max-width: 48em) { @media screen and (max-width: 48em) {
.homepage h2 {
font-size: 2.3em;
}
.homepage .title h3, .homepage .inner { .homepage .title h3, .homepage .inner {
width: 90%; width: 90%;
} }
@ -760,7 +761,6 @@ a.home-signup-button {
} }
.account-status table td { .account-status table td {
padding: 0.5em 1em; padding: 0.5em 1em;
width: 50%;
} }
.account-status table td:first-child { .account-status table td:first-child {
border-right: 1px solid #ddd; border-right: 1px solid #ddd;
@ -904,13 +904,13 @@ a.home-signup-button {
/***************************************************/ /***************************************************/
/********************* Gateways */ /********************* Gateways */
#gateways table { table.flat-table {
width: 100%; width: 100%;
} }
#gateways td { .flat-table td {
padding: 10px; padding: 10px;
} }
#gateways table thead td { .flat-table thead td {
text-align: center; text-align: center;
font-size: 1.1em; font-size: 1.1em;
border: 1px solid #bbb; border: 1px solid #bbb;
@ -918,37 +918,37 @@ a.home-signup-button {
color: #1c619a; color: #1c619a;
background: #ddd; background: #ddd;
} }
#gateways table thead tr td:first-child { .flat-table thead tr td:first-child {
border-left: 0; border-left: 0;
} }
#gateways table thead tr td:last-child { .flat-table thead tr td:last-child {
border-right: 0; border-right: 0;
} }
#gateways table tbody tr td:first-child { .flat-table tbody tr td:first-child {
border-left: 0; border-left: 0;
} }
#gateways table tbody tr td { .flat-table tbody tr td {
border: 1px solid #bbb; border: 1px solid #bbb;
} }
#gateways table tbody tr td:first-child { .flat-table tbody tr td:first-child {
border-left: 0; border-left: 0;
} }
#gateways table tbody tr td:last-child { .flat-table tbody tr td:last-child {
border-right: 0; border-right: 0;
} }
#gateways table tbody tr:last-child td { .flat-table tbody tr:last-child td {
border-bottom: 0; border-bottom: 0;
} }
#gateways table tbody tr:nth-child(even) { .flat-table tbody tr:nth-child(even) {
background: #eee; background: #eee;
} }
#gateways .host_name { .flat-table .host_name {
font-family: monospace; font-family: monospace;
} }
#gateways td { .flat-table td {
white-space: nowrap; white-space: nowrap;
} }
#gateways .right { .flat-table .right {
text-align: right; text-align: right;
} }

@ -21,12 +21,10 @@
<i class="fa fa-download fa-fw" aria-hidden="true"></i>&nbsp; <i class="fa fa-download fa-fw" aria-hidden="true"></i>&nbsp;
{% trans 'OpenVPN' %} {% trans 'OpenVPN' %}
</a></li> </a></li>
{% if config.WIREGUARD %}
<li><a href="/account/wireguard"> <li><a href="/account/wireguard">
<i class="icon icon-wireguard fa-fw" aria-hidden="true"></i>&nbsp; <i class="icon icon-wireguard fa-fw" aria-hidden="true"></i>&nbsp;
{% trans 'WireGuard' %} {% trans 'WireGuard' %}
</a></li> </a></li>
{% endif %}
<li><a href="/payments"> <li><a href="/payments">
<i class="fa fa-credit-card fa-fw" aria-hidden="true"></i>&nbsp; <i class="fa fa-credit-card fa-fw" aria-hidden="true"></i>&nbsp;
{% trans 'Payments' %} {% trans 'Payments' %}
@ -39,8 +37,10 @@
</div> </div>
</div> </div>
{% block account_content_outer %} {% block account_content_outer %}
<div class="content-box"> <div class="flex-page-content">
<div class="content-box">
{% block account_content %}{% endblock %} {% block account_content %}{% endblock %}
</div>
</div> </div>
{% endblock %} {% endblock %}
</div> </div>

@ -15,10 +15,15 @@
<h3>{% trans 'Hide your IP Address' %}</h3> <h3>{% trans 'Hide your IP Address' %}</h3>
</div> </div>
<div class="inner"> <div class="inner">
<p> <p>
{% blocktrans trimmed %} {% blocktrans trimmed %}
From corporations and attackers tracking you for advertising, marketing, geo-blocking, extortion, ... From sites and corporations tracking you for advertising, marketing, geo-blocking, ...
and irresponsibly storing personal data that can leak to malicious parties and be used against you. and sometimes leaking the data or ignoring regulations.
{% endblocktrans %}
</p>
<p>
{% blocktrans trimmed %}
From attackers collecting leaked data or harvesting IP addresses on P2P networks to stalk or extort you.
{% endblocktrans %} {% endblocktrans %}
</p> </p>
</div> </div>

@ -4,65 +4,60 @@
{% block pagetitle %}{% trans 'OpenVPN Configuration' %}{% endblock %} {% block pagetitle %}{% trans 'OpenVPN Configuration' %}{% endblock %}
{% block account_content %} {% block account_content %}
<div> <form action="/account/config_dl" method="get" class="pure-form pure-form-aligned">
<form action="/account/config_dl" method="get" class="pure-form pure-form-aligned"> <fieldset>
<fieldset> <div class="pure-control-group">
<div class="pure-control-group"> <label for="p_os">{% trans 'OS' %}</label>
<label for="p_os">{% trans 'OS' %}</label> <select name="platform" id="p_os" class="pure-input-1-2">
<select name="platform" id="p_os" class="pure-input-1-2"> {% for k, v in config_os %}
{% for k, v in config_os %} <option value="{{k}}">{{v}}</option>
<option value="{{k}}">{{v}}</option> {% endfor %}
{% endfor %} </select>
</select> </div>
</div>
<div class="pure-control-group">
<div class="pure-control-group"> <label for="p_gw">{% trans 'Gateway' %}</label>
<label for="p_gw">{% trans 'Gateway' %}</label> <select name="gateway" id="p_gw" class="pure-input-1-2">
<select name="gateway" id="p_gw" class="pure-input-1-2"> <option value="" selected>{% trans 'Random' %}</option>
<option value="" selected>{% trans 'Random' %}</option> <option value="all">{% trans 'All (multiple config files)' %}</option>
<option value="all">{% trans 'All (multiple config files)' %}</option> {% for c in config_countries %}
{% for c in config_countries %} <option value="cc_{{c.country_code}}">
<option value="cc_{{c.country_code}}"> {% trans 'Country' %}: {{c.country_name}}
{% trans 'Country' %}: {{c.country_name}} {% if c.message %}
{% if c.message %} [ {{ c.message }} ]
[ {{ c.message }} ] {% endif %}
{% endif %} </option>
</option> {% endfor %}
{% endfor %} </select>
</select> </div>
</div>
<div class="pure-control-group">
<div class="pure-control-group"> <label for="p_proto">{% trans 'Protocol' %}</label>
<label for="p_proto">{% trans 'Protocol' %}</label> <select name="protocol" id="p_proto" class="pure-input-1-2">
<select name="protocol" id="p_proto" class="pure-input-1-2"> {% for k, v in config_protocols %}
{% for k, v in config_protocols %} <option value="{{k}}">{{v}}</option>
<option value="{{k}}">{{v}}</option> {% endfor %}
{% endfor %} </select>
</select> <p class="inputinfo">{% trans 'TCP is slower. Use it only if you have important packet loss or if UDP is filtered.' %}</p>
<p class="inputinfo">{% trans 'TCP is slower. Use it only if you have important packet loss or if UDP is filtered.' %}</p> </div>
</div>
<div class="pure-control-group">
<div class="pure-control-group"> <label for="p_proxy">{% trans 'Use HTTP Proxy?' %}</label>
<label for="p_proxy">{% trans 'Use HTTP Proxy?' %}</label> <input type="text" name="http_proxy" id="p_proxy"
<input type="text" name="http_proxy" id="p_proxy" placeholder="{% trans "Leave empty if you don't know." %}"
placeholder="{% trans "Leave empty if you don't know." %}" class="pure-input-1-2" />
class="pure-input-1-2" /> <p class="inputinfo">{% trans 'Requires TCP.' %}</p>
<p class="inputinfo">{% trans 'Requires TCP.' %}</p> </div>
</div>
<div class="pure-controls">
<div class="pure-controls"> <label for="p_ipv6" class="pure-checkbox">
<label for="p_ipv6" class="pure-checkbox"> <input type="checkbox" name="enable_ipv6" id="p_ipv6" checked />
<input type="checkbox" name="enable_ipv6" id="p_ipv6" checked /> {% trans 'Enable IPv6?' %}
{% trans 'Enable IPv6?' %} </label>
</label>
<input type="submit" class="pure-button pure-button-primary"
<input type="submit" class="pure-button pure-button-primary" value="{% trans 'Download config' %}" />
value="{% trans 'Download config' %}" /> </div>
</div> </fieldset>
</fieldset> </form>
</form>
</div>
{% endblock %} {% endblock %}

@ -8,7 +8,7 @@
<div class="pure-u-1 pure-u-xl-2-3" id="gateways"> <div class="pure-u-1 pure-u-xl-2-3" id="gateways">
<h2>{% trans 'Our Servers' %}</h2> <h2>{% trans 'Our Servers' %}</h2>
<table> <table class="flat-table">
<thead> <thead>
<tr><td>{% trans 'Location' %}</td> <tr><td>{% trans 'Location' %}</td>
<td>{% trans 'Hostname' %}</td> <td>{% trans 'Hostname' %}</td>

@ -3,8 +3,8 @@
{% load static %} {% load static %}
{% block pagetitle %}{% trans 'Payments' %}{% endblock %} {% block pagetitle %}{% trans 'Payments' %}{% endblock %}
{% block account_content %} {% block account_content_outer %}
<table class="admin-list"> <table class="flat-table">
<thead> <thead>
<tr> <tr>
<td>{% trans 'Date' %}</td> <td>{% trans 'Date' %}</td>
@ -15,7 +15,7 @@
<tbody> <tbody>
{% for payment in payments %} {% for payment in payments %}
<tr> <tr>
<td>{{ payment.created }}</td> <td>{{ payment.created|date:'Y-m-d H:i' }}</td>
<td>{{ payment.time }} <td>{{ payment.time }}
({{ payment.get_amount_display }}) ({{ payment.get_amount_display }})
</td> </td>

Loading…
Cancel
Save