Commit 3c8a0e75 authored by sajolida's avatar sajolida
Browse files

Merge branch 'web/10176-redesign-donate'

parents c008b6b3 c9e94c9c
......@@ -141,7 +141,7 @@ gitmaster_branch: master
# htmlscrubber plugin
# PageSpec specifying pages not to scrub
htmlscrubber_skip: 'download or download.* or install or install.* or install/* or upgrade or upgrade.* or upgrade/*'
htmlscrubber_skip: 'donate or donate.* or donate/* or download or download.* or install or install.* or install/* or upgrade or upgrade.* or upgrade/*'
# inline plugin
# enable rss feeds by default?
......@@ -234,7 +234,7 @@ po_slave_languages:
#
# When updating this list, refer to the checklist in
# https://tails.boum.org/contribute/how/website/po_translatable_pages/
po_translatable_pages: '!security/audits and !security/audits/* and !news/report_2* and !news/version_0* and !news/test_0* and !news/test_*-rc? and !security/Numerous_security_holes_in_0* and (about or about/* or bugs or chat or contribute or contribute/how/donate or doc or doc/* or download or download.inline or getting_started or inc/stable_i386_release_notes or index or home or news or news/* or press or security or security/* or sidebar or support or support/* or todo or torrents or wishlist or misc or misc/* or install or install/* or upgrade or upgrade/*)'
po_translatable_pages: '!security/audits and !security/audits/* and !news/report_2* and !news/version_0* and !news/test_0* and !news/test_*-rc? and !security/Numerous_security_holes_in_0* and (about or about/* or bugs or chat or contribute or contribute/how/donate or doc or doc/* or donate or donate/* or download or download.inline or getting_started or home or inc/stable_i386_release_notes or index or news or news/* or press or security or security/* or sidebar or support or support/* or todo or torrents or wishlist or misc or misc/* or install or install/* or upgrade or upgrade/*)'
# internal linking behavior (default/current/negotiated)
po_link_to: current
......
......@@ -118,7 +118,7 @@ allow_symlinks_before_srcdir: 1
# htmlscrubber plugin
# PageSpec specifying pages not to scrub
htmlscrubber_skip: 'misc/unsafe_browser_warning or misc/unsafe_browser_warning.* or download or download.* or install or install.* or install/* or upgrade or upgrade.* or upgrade/*'
htmlscrubber_skip: 'misc/unsafe_browser_warning or misc/unsafe_browser_warning.* or donate or donate.* or donate/* or download or download.* or install or install.* or install/* or upgrade or upgrade.* or upgrade/*'
# inline plugin
# enable rss feeds by default?
......@@ -211,7 +211,7 @@ po_slave_languages:
#
# When updating this list, refer to the checklist in
# https://tails.boum.org/contribute/how/website/po_translatable_pages/
po_translatable_pages: '!security/audits and !security/audits/* and !news/report_2* and !news/version_0* and !news/test_0* and !news/test_*-rc? and !security/Numerous_security_holes_in_0* and (about or about/* or bugs or chat or contribute or contribute/how/donate or doc or doc/* or download or download.inline or getting_started or inc/stable_i386_release_notes or index or home or news or news/* or press or security or security/* or sidebar or support or support/* or todo or torrents or wishlist or misc or misc/* or install or install/* or upgrade or upgrade/*)'
po_translatable_pages: '!security/audits and !security/audits/* and !news/report_2* and !news/version_0* and !news/test_0* and !news/test_*-rc? and !security/Numerous_security_holes_in_0* and (about or about/* or bugs or chat or contribute or contribute/how/donate or doc or doc/* or donate or donate/* or download or download.inline or getting_started or home or inc/stable_i386_release_notes or index or news or news/* or press or security or security/* or sidebar or support or support/* or todo or torrents or wishlist or misc or misc/* or install or install/* or upgrade or upgrade/*)'
# internal linking behavior (default/current/negotiated)
po_link_to: current
......
.banner, .page {
box-sizing: content-box;
}
This diff is collapsed.
This diff is collapsed.
......@@ -68,4 +68,6 @@ Creative Commons Attribution 3.0 United States License.
Creative Commons — Attribution, by Pham Thi Dieu Linh.
- [[Laptop|https://thenounproject.com/term/laptop/6729]]:
Public Domain, by Jean Yashu.
- [[Love|https://thenounproject.com/term/love/218846/]]:
Create Commons — Attribution, by Thomas Helbig.
.sidebar {
display: none;
}
.parentlinks {
display: block;
height: 2.4em;
}
.parentlinks ul {
display: none;
}
span.title {
margin-top: 0;
}
/* Left part */
#feature h2 {
font-size: 24px;
font-style: italic;
margin-bottom: 1em;
margin-top: 0;
}
#feature h3 {
font-size: 20px;
font-style: italic;
margin-bottom: 1em;
text-transform: none;
letter-spacing: 0;
}
#feature p {
font-size: 16px;
line-height: 1.5em;
}
/* Hide version with JavaScript by default */
#paypal-with-js {
display: none;
}
/* JavaScript version */
#currency .col-md-12, #frequency .col-md-12 {
margin-bottom: 1em;
padding: 0;
border: solid 3px white;
}
#donate-button .col-md-12 {
margin-top: 1em;
border: solid 3px white;
}
.btn-primary {
background-color: #56347c;
border-color: #492c69;
}
.btn-primary.active, .btn-primary:hover {
background-color: #3a2354;
border-color: #271838;
}
.btn-primary.active:hover {
background-color: #271838;
border-color: #040205;
}
#require-paypal, .tax-deducible {
padding: 0 4px;
}
#require-paypal {
font-size: 12px;
font-style: italic;
}
.tax-deducible {
font-size: 12px;
margin-top: 9px;
}
#other-ways {
margin-top: 5em;
}
.amounts .btn {
padding-top: 33px;
height: 95px;
border: solid 3px white;
}
.amounts .other {
padding: 13px 4px;
}
.amounts .other .input-group-addon {
padding: 2px;
}
.amounts .other .form-control {
padding: 4px;
}
/* Version without JavaScript */
#paypal-without-js h2 {
font-size: 24px;
margin-top: 0;
}
#paypal-without-js h3 {
font-size: 14px;
}
#paypal-without-js form {
margin-bottom: 1em;
}
#paypal-without-js form label {
font-size: 13px;
margin-left: 0.5em;
margin-right: 0.5em;
}
/* Other ways */
#flattr a {
padding-right: 0 !important;
background: none !important;
}
[[!meta title="Donate to Tails"]]
[[!meta stylesheet="bootstrap.min" rel="stylesheet" title=""]]
[[!meta stylesheet="donate" rel="stylesheet" title=""]]
[[!meta script="lib/js/jquery.min"]]
[[!meta script="lib/js/bootstrap/button"]]
[[!meta script="donate"]]
<div class="row">
<div id="feature" class="col-md-6">
<h2>Tails is free because nobody should have to pay to be safe while
using computers.</h2>
<h3>But we need your support to stay alive!</h3>
<p>Tails is an irreplaceable security tool as it allows anyone to use
computers safely. But we know that secure tools need to be free software to
be reliable and relevant in all situations. That's why we are giving out
Tails for free.</p>
<p>If everybody using Tails today donated, our fundraising would be done for
the whole year. But not everybody can donate. And that's fine. We just need
some of you to give to keep on providing such a secure platform for
everybody.</p>
<p>Donations from individuals, like you, are our most valuable funding
as they make Tails more independent from government and corporate
funding.</p>
<p>This year, please consider making a donation to protect and sustain
Tails.</p>
<p>Thanks,</p>
</div>
<div class="col-md-1"></div>
<div class="col-md-5">
<div id="paypal-with-js" class="row">
<form method="post" action="https://www.paypal.com/cgi-bin/webscr">
<!-- HTML Variables for PayPal Payments Standard:
https://developer.paypal.com/docs/classic/paypal-payments-standard/integration-guide/Appx_websitestandard_htmlvariables/ -->
<input type="hidden" name="cmd" value="_xclick-subscriptions" id="cmd"/>
<input type="hidden" name="business" value="tailsriseuplabs@riseup.net" id="business"/>
<input type="hidden" name="currency_code" value="USD" id="currency_code"/>
<input type="hidden" name="item_name" value="Donation to Tails"/>
<input type="hidden" name="no_note" value="1"/>
<!-- Note for translators: adapt this to return to the page in your language. -->
<input type="hidden" name="return" class="return-url" value="https://tails.boum.org/donate/thanks"/>
<input type="hidden" name="cancel_return" class="return-url" value="https://tails.boum.org/donate/canceled"/>
<!-- Note for translators: adapt this to your language. -->
<input name="lc" type="hidden" value="US"/>
<!-- For recurring donations only. -->
<input type="hidden" name="a3" value="5" id="a3"/>
<input type="hidden" name="t3" value="Y" id="t3"/>
<input type="hidden" name="p3" value="1"/>
<input type="hidden" name="src" value="1"/>
<!-- For one-time donation only. -->
<input type="hidden" name="amount" value="5" id="amount"/>
<div id="currency">
<div class="col-md-12 btn-group btn-group-justified" data-toggle="buttons" role="group">
<label class="btn btn-lg btn-primary active" id="currency-dollar">
<input type="radio" id="dollars" autocomplete="off" checked data-complete-text="finished!"/> Dollars
</label>
<label class="btn btn-lg btn-primary" id="currency-euro">
<input type="radio" id="euros" autocomplete="off" checked data-complete-text="finished!"/> Euros
</label>
</div>
</div>
<div id="frequency">
<div class="col-md-12 btn-group btn-group-justified" data-toggle="buttons" role="group">
<label class="btn btn-lg btn-primary" id="one-time">
<input type="radio" autocomplete="off"/> One-time
</label>
<label class="btn btn-lg btn-primary" id="monthly">
<input type="radio" autocomplete="off"/> Monthly
</label>
<label class="btn btn-lg btn-primary active" id="yearly">
<input type="radio" autocomplete="off" checked/> Yearly
</label>
</div>
</div>
<div id="dollar-amounts" class="amounts donate-dollars" data-toggle="buttons" role="group">
<label class="btn btn-lg btn-primary col-md-3 col-xs-6 5">
<input type="radio" autocomplete="off" value="5"/>$5
</label>
<label class="btn btn-lg btn-primary col-md-3 col-xs-6 10">
<input type="radio" autocomplete="off" value="10"/>$10
</label>
<label class="btn btn-lg btn-primary col-md-3 col-xs-6 20">
<input type="radio" autocomplete="off" value="20"/>$20
</label>
<label class="btn btn-lg btn-primary col-md-3 col-xs-6 50">
<input type="radio" autocomplete="off" value="50"/>$50
</label>
<label class="btn btn-lg btn-primary col-md-3 col-xs-6 100">
<input type="radio" autocomplete="off" value="100"/>$100
</label>
<label class="btn btn-lg btn-primary col-md-3 col-xs-6 250">
<input type="radio" autocomplete="off" value="250"/>$250
</label>
<label class="btn btn-lg btn-primary col-md-3 col-xs-6 500">
<input type="radio" autocomplete="off" value="500"/>$500
</label>
<label class="btn btn-lg btn-primary col-md-3 col-xs-6 other">
<span>Other</span>
<div class="input-group">
<span class="input-group-addon">$</span>
<input type="text" class="form-control" id="other-dollar"/>
</div>
</label>
</div>
<div id="euro-amounts" class="amounts donate-euros" data-toggle="buttons" role="group">
<label class="btn btn-lg btn-primary col-md-3 col-xs-6 5">
<input type="radio" autocomplete="off" value="5"/>5€
</label>
<label class="btn btn-lg btn-primary col-md-3 col-xs-6 10">
<input type="radio" autocomplete="off" value="10"/>10€
</label>
<label class="btn btn-lg btn-primary col-md-3 col-xs-6 20">
<input type="radio" autocomplete="off" value="20"/>20€
</label>
<label class="btn btn-lg btn-primary col-md-3 col-xs-6 50">
<input type="radio" autocomplete="off" value="50"/>50€
</label>
<label class="btn btn-lg btn-primary col-md-3 col-xs-6 100">
<input type="radio" autocomplete="off" value="100"/>100€
</label>
<label class="btn btn-lg btn-primary col-md-3 col-xs-6 250">
<input type="radio" autocomplete="off" value="250"/>250€
</label>
<label class="btn btn-lg btn-primary col-md-3 col-xs-6 500">
<input type="radio" autocomplete="off" value="500"/>500€
</label>
<label class="btn btn-lg btn-primary col-md-3 col-xs-6 other">
<span>Other</span>
<div class="input-group">
<input type="text" class="form-control text-right" id="other-euro"/>
<span class="input-group-addon"></span>
</div>
</label>
</div>
<div id="donate-button">
<button class="btn btn-primary btn-lg btn-block col-md-12">Donate</button>
</div>
</form>
<p id="require-paypal">Monthly and yearly donations require
a [[!img paypal-inline.png link="no" class="paypal-inline" alt="PayPal"]]
account.</p>
<p id="dollar-tax" class="tax-deducible donate-dollars">Your donation will be
handled by RiseupLabs which is a 501(c)(3) non-profit organization in
the USA.<br/><strong>All donations are tax-deductible to the full extent
permitted by law.</strong></p>
<p id="euro-tax" class="tax-deducible donate-euros">Your donation will be handled
by Zwiebelfreunde which is a non-profit organization in
Germany.<br/><strong>All donations are tax-deductible to the full extent
permitted by law.</strong></p>
</div>
<div id="paypal-without-js" class="row">
<h2>Donate in dollars</h2>
<p id="dollar-tax" class="tax-deducible">Your donation will be
handled by RiseupLabs which is a 501(c)(3) non-profit organization in
the USA.<br/><strong>All donations are tax-deductible to the full extent
permitted by law.</strong></p>
<h3>Recurring donation</h3>
<form method="post" action="https://www.paypal.com/cgi-bin/webscr">
<input type="hidden" name="cmd" value="_xclick-subscriptions"/>
<input type="hidden" name="business" value="tailsriseuplabs@riseup.net"/>
<input type="hidden" name="currency_code" value="USD" id="currency_code"/>
<input type="hidden" name="item_name" value="Donation to Tails"/>
<input type="hidden" name="no_note" value="1"/>
<!-- Note for translators: adapt this to return to the page in your language. -->
<input type="hidden" name="return" class="return-url" value="https://tails.boum.org/donate/thanks"/>
<input type="hidden" name="cancel_return" class="return-url" value="https://tails.boum.org/donate/canceled"/>
<!-- Note for translators: adapt this to your language. -->
<input name="lc" type="hidden" value="US"/>
<input type="hidden" name="src" value="1"/>
<input type="hidden" name="p3" value="1"/>
<input type="radio" name="a3" value="5" id="sub5" checked="checked"/><label for="sub5">$5</label>
<input type="radio" name="a3" value="10" id="sub10"/><label for="sub10">$10</label>
<input type="radio" name="a3" value="20" id="sub20"/><label for="sub20">$20</label>
<input type="radio" name="a3" value="50" id="sub50"/><label for="sub50">$50</label>
<input type="radio" name="a3" value="100" id="sub100"/><label for="sub100">$100</label>
<input type="radio" name="a3" value="250" id="sub250"/><label for="sub250">$250</label>
<input type="radio" name="a3" value="500" id="sub500"/><label for="sub500">$500</label>
<br/>
<input type="radio" name="t3" value="M" id="sub_m"/><label for="sub_m">Monthly</label>
<input type="radio" name="t3" value="Y" id="sub_y" checked="checked"/><label for="sub_y">Yearly</label>
<br/>
<input type="submit" value="Donate"/> (Requires a [[!img paypal-inline.png link="no" class="paypal-inline" alt="PayPal"]] account.)
</form>
<h3>One-time donation</h3>
<form method="post" action="https://www.paypal.com/cgi-bin/webscr">
<input type="hidden" name="cmd" value="_donations"/>
<input type="hidden" name='business' value="tailsriseuplabs@riseup.net"/>
<input type="hidden" name="currency_code" value="USD" id="currency_code"/>
<input type="hidden" name="item_name" value="Donation to Tails"/>
<input type="hidden" name="no_note" value="1"/>
<!-- Note for translators: adapt this to return to the page in your language. -->
<input type="hidden" name="return" class="return-url" value="https://tails.boum.org/donate/thanks"/>
<input type="hidden" name="cancel_return" class="return-url" value="https://tails.boum.org/donate/canceled"/>
<!-- Note for translators: adapt this to your language. -->
<input name="lc" type="hidden" value="US"/>
<input type="radio" name="amount" value="5" id="pp_5" checked="checked"/><label for="pp_5">$5</label>
<input type="radio" name="amount" value="10" id="pp_10"/><label for="pp_10">$10</label>
<input type="radio" name="amount" value="20" id="pp_20"/><label for="pp_20">$20</label>
<input type="radio" name="amount" value="50" id="pp_50"/><label for="pp_50">$50</label>
<input type="radio" name="amount" value="100" id="pp_100"/><label for="pp_100">$100</label>
<input type="radio" name="amount" value="" id="pp_cust"/><label for="pp_cust">Custom amount</label>
<br/>
<input type="submit" value="Donate"/>
</form>
<p><br/></p>
<h2>Donate in euros</h2>
<p id="euro-tax" class="tax-deducible">Your donation will be handled
by Zwiebelfreunde which is a non-profit organization in
Germany.<br/><strong>All donations are tax-deductible to the full extent
permitted by law.</strong></p>
<h3>Recurring donation</h3>
<form method="post" action="https://www.paypal.com/cgi-bin/webscr">
<input type="hidden" name="cmd" value="_xclick-subscriptions"/>
<input type="hidden" name="business" value="tails@torservers.net"/>
<input type="hidden" name="currency_code" value="EUR" id="currency_code"/>
<input type="hidden" name="item_name" value="Donation to Tails"/>
<input type="hidden" name="no_note" value="1"/>
<!-- Note for translators: adapt this to return to the page in your language. -->
<input type="hidden" name="return" class="return-url" value="https://tails.boum.org/donate/thanks"/>
<input type="hidden" name="cancel_return" class="return-url" value="https://tails.boum.org/donate/canceled"/>
<!-- Note for translators: adapt this to your language. -->
<input name="lc" type="hidden" value="US"/>
<input type="hidden" name="src" value="1"/>
<input type="hidden" name="p3" value="1"/>
<input type="radio" name="a3" value="5" id="sub5" checked="checked"/><label for="sub5">5€</label>
<input type="radio" name="a3" value="10" id="sub10"/><label for="sub10">10€</label>
<input type="radio" name="a3" value="20" id="sub20"/><label for="sub20">20€</label>
<input type="radio" name="a3" value="50" id="sub50"/><label for="sub50">50€</label>
<input type="radio" name="a3" value="100" id="sub100"/><label for="sub100">100€</label>
<input type="radio" name="a3" value="250" id="sub250"/><label for="sub250">250€</label>
<input type="radio" name="a3" value="500" id="sub500"/><label for="sub500">500€</label>
<br/>
<input type="radio" name="t3" value="M" id="sub_m"/><label for="sub_m">Monthly</label>
<input type="radio" name="t3" value="Y" id="sub_y" checked="checked"/><label for="sub_y">Yearly</label>
<br/>
<input type="submit" value="Donate"/> (Requires a [[!img paypal-inline.png link="no" class="paypal-inline" alt="PayPal"]] account.)
</form>
<h3>One-time donation</h3>
<form method="post" action="https://www.paypal.com/cgi-bin/webscr">
<input type="hidden" name="cmd" value="_donations"/>
<input type="hidden" name='business' value="tails@torservers.net"/>
<input type="hidden" name="currency_code" value="EUR" id="currency_code"/>
<input type="hidden" name="item_name" value="Donation to Tails"/>
<input type="hidden" name="no_note" value="1"/>
<!-- Note for translators: adapt this to return to the page in your language. -->
<input type="hidden" name="return" class="return-url" value="https://tails.boum.org/donate/thanks"/>
<input type="hidden" name="cancel_return" class="return-url" value="https://tails.boum.org/donate/canceled"/>
<!-- Note for translators: adapt this to your language. -->
<input name="lc" type="hidden" value="US"/>
<input type="radio" name="amount" value="5" id="pp_5" checked="checked"/><label for="pp_5">5€</label>
<input type="radio" name="amount" value="10" id="pp_10"/><label for="pp_10">10€</label>
<input type="radio" name="amount" value="20" id="pp_20"/><label for="pp_20">20€</label>
<input type="radio" name="amount" value="50" id="pp_50"/><label for="pp_50">50€</label>
<input type="radio" name="amount" value="100" id="pp_100"/><label for="pp_100">100€</label>
<input type="radio" name="amount" value="" id="pp_cust"/><label for="pp_cust">Custom amount</label>
<br/>
<input type="submit" value="Donate"/>
</form>
</div>
</div>
</div> <!-- .row -->
<div id="other-ways" class="row">
<h3 class="col-md-12">Other ways to donate</h3>
<div id="bitcoin" class="col-md-4">
<h4>Bitcoin</h4>
<p><a href="bitcoin:1BvBMSEYstWetqTFn5Au4m4GFg7xJaNVN2">[[!img bitcoin-1BvBMSEYstWetqTFn5Au4m4GFg7xJaNVN2.png link="no"]]</a></p>
<p><strong>1BvBMSEYstWetqTFn5Au4m4GFg7xJaNVN2</strong></p>
</div>
<div id="flattr" class="col-md-4">
<h4>Flattr</h4>
<a href="https://flattr.com/submit/auto?fid=j1rqzg&url=https%3A%2F%2Ftails.boum.org%2Fdonate%2F" target="_blank">[[!img flattr-badge-large.png link="no" alt="Flattr this"]]</a>
</div>
<div id="zwiebelfreunde" class="col-md-4">
<h4>Bank Transfer</h4>
<strong>Zwiebelfreunde e.V.</strong><br/>
<em>IBAN</em>: DE25 4306 0967 1126 8256 03<br/>
<em>BIC</em>: GENODEM1GLS<br/>
<em>Bank</em>: GLS Gemeinschaftsbank eG<br/>
Christstrasse 9<br/>
44789 Bochum<br/>
Germany
</div>
</div>
$(document).ready(function(){
// Append anchor at the end of return and cancel_return page.
// This will allow calculating conversion rates and failures from different sources.
$('#paypal-with-js .return-url').each(function() {
$(this).val($(this).val().concat(window.location.hash));
});
// Show version with JavaScript
$('#paypal-with-js').show();
$('#paypal-without-js').hide();
// Default donation is in $
$('.donate-dollars').show();
$('.donate-euros').hide();
// Toggle between Zwiebelfreunde and Riseup Labs
$('#currency-dollar').click(function () {
$('.donate-dollars').show();
$('.donate-euros').hide();
$('#dollar-amounts .btn').first().trigger('click');
$('#business').val('tailsriseuplabs@riseup.net');
$('#currency_code').val('USD');
});
$('#currency-euro').click(function () {
$('.donate-dollars').hide();
$('.donate-euros').show();
$('#euro-amounts .btn').first().trigger('click');
$('#business').val('tails@torservers.net');
$('#currency_code').val('EUR');
});
// Toggle between one-time donation and recurring donation
$('#one-time').click(function () {
$('#cmd').val('_donations');
$('#t3').val('');
});
$('#monthly').click(function () {
$('#cmd').val('_xclick-subscriptions');
$('#t3').val('M');
});
$('#yearly').click(function () {
$('#cmd').val('_xclick-subscriptions');
$('#t3').val('Y');
});
// Set the amounts for PayPal to the value of the radio button that gets clicked
$('.amounts .btn').on('click change', function () {
let newvalue = parseInt($(this).find('input').val());
if(newvalue === undefined || newvalue < 0) { newvalue = 1; }
$('#amount, #a3').val(newvalue);
});
});
[[!meta title="Payment canceled"]]
Your payment was canceled.