commit 4071ac9675fa8b57e6cefb9149cb62126692feb7 Author: kez kez@torproject.org Date: Wed Jun 23 18:58:12 2021 -0400
Make signature download link more visually distinct
Add an underline to the signature link Add a mouseover tooltip to the "how to verify" button Make the signature link download instead of opening a new tab
See: tpo/web/tpo#64 --- templates/hero-download.html | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-)
diff --git a/templates/hero-download.html b/templates/hero-download.html index 90924f44..3a054065 100644 --- a/templates/hero-download.html +++ b/templates/hero-download.html @@ -33,9 +33,15 @@ <a class="downloadLink" href="{{ download_link }}"> <i class="text-light fab fa-{{ id }}-png"></i> </a> + <script> + // we can't use jquery for the event listener because jquery isn't loaded yet + document.addEventListener("DOMContentLoaded", function() { + $('[data-toggle="tooltip"]').tooltip(); + }); + </script> <a class="btn btn-primary mt-4 downloadLink" href="{{ download_link }}">{{ _('Download for') }} {{ item.label }}</a> - <a class="link" href="{{ sig_link }}"><span class="nick text-white">{{ _('Signature') }}</span></a> - <a class="link" href="{{ 'https://support.torproject.org/' + this.alt + '/tbb/how-to-verify-signature/' }}" target="_blank"><i style="font-size:10px;" class="text-light fas fa-question-circle"></i></a> + <a class="link" href="{{ sig_link }}" download><span class="nick text-white" style="text-decoration: underline;">{{ _('Signature') }}</span></a> + <a class="link" href="{{ 'https://support.torproject.org/' + this.alt + '/tbb/how-to-verify-signature/' }}" target="_blank" data-toggle="tooltip" data-placement="bottom" title="{{ _('Learn how to verify a signature') }}"><i style="font-size:10px;" class="text-light fas fa-question-circle"></i></a> </div> </div> {% endfor %}