[tor-commits] [tpo/master] Fix UI bugs in /download
hiro at torproject.org
hiro at torproject.org
Fri Apr 26 12:48:25 UTC 2019
commit 091a6d2e3d5b6edbeb8f119343adaaa2387827d7
Author: Antonela <hola at antonela.me>
Date: Fri Apr 26 09:06:22 2019 -0300
Fix UI bugs in /download
---
templates/download-android.html | 50 +++++++++++++++++------------------------
templates/hero-download.html | 16 ++++++-------
2 files changed, 28 insertions(+), 38 deletions(-)
diff --git a/templates/download-android.html b/templates/download-android.html
index 6dfea22..8660c9a 100644
--- a/templates/download-android.html
+++ b/templates/download-android.html
@@ -1,6 +1,6 @@
<div id="android" class="container-fluid bg-darker justify-content-center">
- <div class="row col-lg-10 mx-auto">
- <div class="col-lg-8 py-5 mt-5">
+ <div class="row col-xl-10 col-md-12 mx-auto">
+ <div class="col-lg-7 col-md-12 py-5 mt-5">
<div class="row">
<div class="oval-2 bg-dark mx-auto">
<a href="{{ '/download/#android'|url(alt=this.alt) }}">
@@ -9,40 +9,30 @@
</div>
</div>
<div class="row">
- <h4 class="mx-auto display-4 text-center text-white">{{ _('Get Tor Browser for Android.') }}</h4>
+ <h1 class="mx-auto text-center text-white">{{ _('Get Tor Browser for Android.') }}</h1>
</div>
<div class="row">
- <h3 class="mx-auto defend text-white">{{ _('Protect yourself against tracking, surveillance, and censorship.') }}</h3>
+ <h3 class="mx-auto text-center text-white">{{ _('Protect yourself against tracking, surveillance, and censorship.') }}</h3>
</div>
- </div>
- <div class="d-none d-lg-block col-lg-4">
- <img class="img-fluid p-5" height="auto" src="{{ 'static/images/tor-browser-mobile-window/png/TBAa-onboarding at 2x.png'|asseturl }}">
- </div>
- </div>
- <div class="row col-lg-10 mx-auto">
- <div class="col-lg-12 py-5 mt-5">
<div class="row my-5">
- <div class="col-md-6 col-sm-4 text-center p1">
- <div class="row">
- {% set t = bag('versions', 'torbrowser-alpha') %}
- <a class="btn btn-lg btn-light text-primary py-1 px-4 my-1" href="https://dist.torproject.org/torbrowser/{{ t.version }}/tor-browser-{{ t.version }}-android-armv7-multi.apk">{{ _('Download .apk') }} <small class="badge-pill badge-dark mx-1 nick">arm</small></a>
- <a class="btn btn-primary btn-sm nick mx-3 my-2" href="https://dist.torproject.org/torbrowser/{{ t.version }}/tor-browser-{{ t.version }}-android-armv7-multi.apk.asc"><small>sig</small></a>
- <a class="btn btn-lg btn-light text-primary py-1 px-4 my-1" href="https://dist.torproject.org/torbrowser/{{ t.version }}/tor-browser-{{ t.version }}-android-x86-multi.apk">{{ _('Download .apk') }} <small class="badge-pill badge-dark mx-1 nick">x86</small></a>
- <a class="btn btn-primary btn-sm nick mx-3 my-2" href="https://dist.torproject.org/torbrowser/{{ t.version }}/tor-browser-{{ t.version }}-android-x86-multi.apk.asc"><small>sig</small></a>
- </div>
- </div>
- <div class="col-md-3 col-sm-4 text-center p1">
- <a class="btn btn-lg btn-light text-primary py-3 my-1" href="https://play.google.com/store/apps/details?id=org.torproject.torbrowser_alpha">{{ _('Go to Google Play') }}</a>
- </div>
+ <div class="col-xl-6 mx-auto text-center">
+ {% set t = bag('versions', 'torbrowser-alpha') %}
+ <a class="btn btn-lg btn-light text-primary py-1 px-4 my-2" href="https://dist.torproject.org/torbrowser/{{ t.version }}/tor-browser-{{ t.version }}-android-armv7-multi.apk">{{ _('Download .apk') }} <small class="badge-pill badge-dark mx-1 nick">arm</small></a>
+ <a class="btn btn-primary btn-sm nick mx-3 my-2" href="https://dist.torproject.org/torbrowser/{{ t.version }}/tor-browser-{{ t.version }}-android-armv7-multi.apk.asc"><small>sig</small></a>
+ <a class="btn btn-lg btn-light text-primary py-1 px-4 my-2" href="https://dist.torproject.org/torbrowser/{{ t.version }}/tor-browser-{{ t.version }}-android-x86-multi.apk">{{ _('Download .apk') }} <small class="badge-pill badge-dark mx-1 nick">x86</small></a>
+ <a class="btn btn-primary btn-sm nick mx-3 my-2" href="https://dist.torproject.org/torbrowser/{{ t.version }}/tor-browser-{{ t.version }}-android-x86-multi.apk.asc"><small>sig</small></a>
+ <a class="btn btn-block btn-lg btn-light text-primary my-2" href="https://play.google.com/store/apps/details?id=org.torproject.torbrowser_alpha">{{ _('Go to Google Play') }}</a>
{% from "macros/downloads.html" import render_fdroid %}
- <div class="col-md-3 col-sm-4 text-center p1">
- <a class="btn btn-lg btn-light text-primary py-3 my-1 disabled" href="">{{ _('Go to F-droid %s')|format(render_fdroid())|safe }}</a>
- <!--a class="btn btn-primary btn-sm nick mx-5 my-4" href="#"><small>sig</small></a-->
- </div>
- </div>
- <div class="row">
- <a class="text-light mx-auto nick" href="https://itunes.apple.com/us/app/onion-browser/id519296448?mt=8">{{ _('Are you a iOS user? We encourage you to try Onion Browser.') }} </a>
+ <a class="btn btn-block btn-lg btn-light text-primary disabled" href="">{{ _('Go to F-droid %s')|format(render_fdroid())|safe }}</a>
+ <!--a class="btn btn-primary btn-sm nick mx-5 my-4" href="#"><small>sig</small></a-->
+ </div>
</div>
</div>
+ <div class="d-none d-lg-block col-lg-5 col-md-6">
+ <img class="img-fluid p-5 m-5" height="auto" src="{{ 'static/images/tor-browser-mobile-window/png/TBAa-onboarding at 2x.png'|asseturl }}">
+ </div>
+ </div>
+ <div class="row pb-5">
+ <a class="text-light mx-auto text-center nick" href="https://itunes.apple.com/us/app/onion-browser/id519296448?mt=8">{{ _('Are you a iOS user? We encourage you to try Onion Browser.') }} </a>
</div>
</div>
diff --git a/templates/hero-download.html b/templates/hero-download.html
index c215de8..7c3744a 100644
--- a/templates/hero-download.html
+++ b/templates/hero-download.html
@@ -1,8 +1,8 @@
<div class="row">
- <h1 class="mx-auto display-2 text-white">{{ _('Defend yourself.') }}</h1>
+ <h1 class="mx-auto display-2 text-white text-center">{{ _('Defend yourself.') }}</h1>
</div>
<div class="row">
- <h3 class="mx-auto defend text-white">{{ _('Protect yourself against tracking, surveillance, and censorship.') }}</h3>
+ <h3 class="mx-auto defend text-white text-center">{{ _('Protect yourself against tracking, surveillance, and censorship.') }}</h3>
</div>
<div class="row p-5 mx-auto">
{% for id, item in bag('platforms').items() %}
@@ -29,7 +29,7 @@
<a class="downloadLink" href="{{ download_link }}">
<i class="text-light fab fa-{{ id }}-png"></i>
</a>
- <p><small><a class="btn btn-primary btn-sm nick mx-5 my-4" href="{{ sig_link }}">sig</a></small></p>
+ <p><small class="float-left"><a class="btn btn-primary btn-sm nick mx-5 my-4" href="{{ sig_link }}">sig</a></small></p>
</div>
</div>
{% endfor %}
@@ -42,10 +42,10 @@
</div>
</div>
<div class="row p-5">
- <a class="mx-auto text-white py-3" href="{{ 'languages'|url(alt=this.alt) }}"><u>{{ _('Download in another language or platform') }}</u></a>
- <a class="mx-auto text-white py-3" href="{{ 'alpha'|url(alt=this.alt) }}"><u>{{ _('Advanced Install Options') }}</u></a>
- <a class="mx-auto text-white py-3" href="{{ 'tor'|url(alt=this.alt) }}"><u>{{ _('Download Tor Source Code') }}</u></a>
+ <a class="mx-auto text-white py-3 text-center" href="{{ 'languages'|url(alt=this.alt) }}"><u>{{ _('Download in another language or platform') }}</u></a>
+ <a class="mx-auto text-white py-3 text-center" href="{{ 'alpha'|url(alt=this.alt) }}"><u>{{ _('Advanced Install Options') }}</u></a>
+ <a class="mx-auto text-white py-3 text-center" href="{{ 'tor'|url(alt=this.alt) }}"><u>{{ _('Download Tor Source Code') }}</u></a>
</div>
-<div class="hidden-sm row p-5 justify-content-center window-bg">
- <a class="mx-auto text-white text-center py-5" href="https://blog.torproject.org/category/tags/tor-browser"><u>{{ _('Read the latest release announcements') }}</u></a>
+<div class="hidden-sm row p-md-5 justify-content-center window-bg">
+ <a class="mx-auto text-white text-center py-md-5" href="https://blog.torproject.org/category/tags/tor-browser"><u>{{ _('Read the latest release announcements') }}</u></a>
</div>
More information about the tor-commits
mailing list