summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorLukas Fleischer <lfleischer@calcurse.org>2019-01-05 21:41:18 +0100
committerLukas Fleischer <lfleischer@calcurse.org>2019-01-05 21:41:18 +0100
commitfc511625fde0ef9df3000e469401b3317f650d9f (patch)
treeb8bf90703ae2f641cc248611556d5e4d903ba9a3
parent9e8ceefb48b78306344528a8e203abd9d8912980 (diff)
downloadcalcurse.org-fc511625fde0ef9df3000e469401b3317f650d9f.tar.gz
calcurse.org-fc511625fde0ef9df3000e469401b3317f650d9f.zip
Add donations page and improve mobile layout
Signed-off-by: Lukas Fleischer <lfleischer@calcurse.org>
-rw-r--r--css/style.css118
-rw-r--r--devel/index.html6
-rw-r--r--donate/index.html126
-rw-r--r--downloads/index.html6
-rw-r--r--index.html151
-rw-r--r--support/index.html6
6 files changed, 315 insertions, 98 deletions
diff --git a/css/style.css b/css/style.css
index cc93418..5a3864a 100644
--- a/css/style.css
+++ b/css/style.css
@@ -10,26 +10,36 @@ body {
}
#header {
- max-width:800px;
- margin:2em auto;
-}
-
-#header img {
- float:left;
+ max-width:830px;
+ padding:2em 15px;
+ margin:0 auto;
}
#header ul {
- float:right;
- margin:0;
padding:0;
list-style-type:none;
}
#header ul li {
- float:left;
- padding:1.5ex;
font-family:Lato,Arial,sans-serif;
font-weight:bold;
+ padding:1ex;
+}
+
+@media (min-width: 640px) {
+ #header img {
+ float:left;
+ }
+
+ #header ul {
+ float:right;
+ margin:0;
+ }
+
+ #header ul li {
+ float:left;
+ padding:1.5ex;
+ }
}
#header ul li a {
@@ -47,17 +57,23 @@ body {
background-color:white;
border:1px solid #ddd;
border-radius:7px;
- margin:2em auto;
- padding:2ex 3ex;
+ margin:0 auto 2em auto;
+ padding:10px 30px 20px 30px;
line-height:1.4;
}
#download {
- float:right;
width:260px;
padding:1ex 0 1ex 4ex;
- border-left:1px solid #ddd;
- margin:2ex 0 2ex 3ex;
+ margin:2ex auto;
+}
+
+@media (min-width: 640px) {
+ #download {
+ float:right;
+ border-left:1px solid #ddd;
+ margin:2ex 0 2ex 3ex;
+ }
}
#download > a {
@@ -145,16 +161,16 @@ ul.pkglist li {
ul.gallery {
list-style-type:none;
- margin:0;
+ margin:0 auto;
padding:0;
}
ul.gallery li {
text-align:center;
- float:left;
+ display:inline-block;
width:200px;
- margin:10px 8px;
- padding:1ex;
+ margin:10px;
+ padding:5px;
}
ul.gallery li img {
@@ -195,7 +211,7 @@ dt {
}
#footer {
- width:800px;
+ max-width:800px;
color:#888;
border-top:1px solid #ccc;
font-size:8pt;
@@ -203,3 +219,65 @@ dt {
padding:2ex 3ex;
text-align:right;
}
+
+ul.donate {
+ font:normal normal normal 100% Lato,Arial,sans-serif;
+ margin:5px;
+ padding:5px;
+ list-style:none;
+}
+
+ul.donate li {
+ display:inline-block;
+}
+
+ul.donate li a {
+ display:inline-block;
+ color:#666;
+ background-color:#eee;
+ border:1px solid #ccc;
+ border-left:5px solid #ccc;
+ border-radius:3pt;
+ padding:1ex 1.5ex;
+ margin:0 3px 3px 0;
+ cursor:hand;
+}
+
+ul.donate li a:hover {
+ color:white;
+ font-weight:bold;
+ text-decoration:none;
+ background-color:#47a;
+ border:1px solid #269;
+ border-left:5px solid #269;
+ border-radius:3pt;
+}
+
+ul.donate li input {
+ display:inline-block;
+ padding:1ex 1ex;
+ margin:0 1ex 0 0;
+ width:60px;
+}
+
+ul.donate li select {
+ display:inline-block;
+ padding:1ex 1ex;
+ margin:0 1ex 0 0;
+ width:60px;
+}
+
+img {
+ max-width: 100%;
+}
+
+pre {
+ white-space: pre-wrap;
+ word-wrap: break-word;
+ overflow: auto;
+}
+
+.error {
+ color: #c23;
+ font-weight:bold;
+}
diff --git a/devel/index.html b/devel/index.html
index ef24952..23fd251 100644
--- a/devel/index.html
+++ b/devel/index.html
@@ -5,6 +5,7 @@
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<meta http-equiv="Content-Style-Type" content="text/css" />
+ <meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript" src="/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="/js/lightbox.js"></script>
@@ -16,12 +17,13 @@
<body>
<div id="header" class="typeface-js">
- <a href="/"><img src="/images/logo.png" /></a>
+ <a href="/"><img src="/images/logo.png" alt="calcurse" /></a>
<ul>
<li><a href="/">About</a></li>
<li><a href="/downloads">Downloads</a></li>
<li><a href="/support">Support</a></li>
<li><a href="/devel" class="current">Development</a></li>
+ <li><a href="/donate">Donate</a></li>
</ul>
<p style="clear:both;"></p>
</div>
@@ -144,7 +146,7 @@ $ make
</p>
</div>
<div id="footer">
- Copyright &copy; 2012-2013 <a href="/support/#devs">calcurse Development Team</a>.
+ Copyright &copy; 2012-2018 <a href="/support/#devs">calcurse Development Team</a>.
Licensed under the terms of the BSD License.
</div>
</body>
diff --git a/donate/index.html b/donate/index.html
new file mode 100644
index 0000000..88672f1
--- /dev/null
+++ b/donate/index.html
@@ -0,0 +1,126 @@
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <title>calcurse.org</title>
+
+ <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
+ <meta http-equiv="Content-Style-Type" content="text/css" />
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+
+ <script type="text/javascript" src="/js/jquery-1.7.2.min.js"></script>
+ <script type="text/javascript" src="/js/lightbox.js"></script>
+ <script type="text/javascript" src="https://checkout.stripe.com/checkout.js"></script>
+
+ <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
+ <link rel="stylesheet" type="text/css" href="/css/style.css" media="all" />
+ <link rel="stylesheet" type="text/css" href="/css/lightbox.css" media="screen" />
+ </head>
+
+ <body>
+ <div id="header" class="typeface-js">
+ <a href="/"><img src="/images/logo.png" alt="calcurse" /></a>
+ <ul>
+ <li><a href="/">About</a></li>
+ <li><a href="/downloads">Downloads</a></li>
+ <li><a href="/support">Support</a></li>
+ <li><a href="/devel">Development</a></li>
+ <li><a href="/donate" class="current">Donate</a></li>
+ </ul>
+ <p style="clear:both;"></p>
+ </div>
+ <div id="contents">
+<h1>Donations</h1>
+<p>
+ There are different ways to support calcurse development. If you are a
+ programmer, one of the best ways to contribute is to <a href="/devel">submit
+ patches</a> fixing bugs, adding features or improving overall code quality.
+</p>
+<p>
+ We are also extremely grateful for donations which help us continue
+ developing calcurse as open source software and are used to cover recurring
+ costs, such as for our servers.
+</p>
+<p>
+ We use <a href="https://stripe.com/checkout/">Stripe Checkout</a> to process
+ payments. The Stripe Checkout payment form requires a modern browser with
+ JavaScript support. If you would like to make a donation but do not want to
+ use Stripe, feel free to contact us at <tt>&lt;donations at calcurse dot
+ org&gt;</tt>. This email address can also be used if you have any questions
+ regarding the donation process.
+</p>
+<p>
+ Use one of the following links to donate...
+</p>
+<ul class="donate">
+ <li><a href="javascript:openHandler(10, 'eur')">10&euro;</a></li>
+ <li><a href="javascript:openHandler(20, 'eur')">20&euro;</a></li>
+ <li><a href="javascript:openHandler(50, 'eur')">50&euro;</a></li>
+ <li><a href="javascript:openHandler(100, 'eur')">100&euro;</a></li>
+ <li><a href="javascript:openHandler(10, 'usd')">$10</a></li>
+ <li><a href="javascript:openHandler(20, 'usd')">$20</a></li>
+ <li><a href="javascript:openHandler(50, 'usd')">$50</a></li>
+ <li><a href="javascript:openHandler(100, 'usd')">$100</a></li>
+ <li id="donate-custom"><a href="javascript:customHandler()">Custom</a></li>
+</ul>
+<div id="donate-status"></div>
+
+<script>
+var amount = 0;
+var handler = StripeCheckout.configure({
+ image: 'https://calcurse.org/images/logo-emblem.png',
+ key: (location.search == '?test') ? 'pk_test_zNePe3wvpZ65O3nEeFq4QL2j' : 'pk_live_g0aFHViGhTkfSSCFmDCr5UI8',
+ locale: 'auto',
+ token: function(token) {
+ $.ajax({
+ type: "POST",
+ url: "/stripe",
+ data: { "token": token.id, "email": token.email, "amount": amount, "currency": token.currency, "test": (location.search == '?test') },
+ success: function(data) {
+ if (data.success) {
+ $("#donate-status").html('<h2>Thank you for your donation!</h2>');
+ } else {
+ $("#donate-status").html('<h2></h2><p class="error">There has been an error, and you have not been charged. Please try again or send an email to <tt>&lt;donations at calcurse dot org&gt;</tt>.');
+ $("#donate-status h2").text(data.message);
+ }
+ },
+ error: function(jqXHR, msg, err) {
+ $("#donate-status").html('<h2></h2><p class="error">There has been an error, and you have not been charged. Please try again or send an email to <tt>&lt;donations at calcurse dot org&gt;</tt>.');
+ $("#donate-status h2").text(msg + ", " + err);
+ }
+ });
+ }
+});
+
+function openHandler(val, currency) {
+ if (val == 0) {
+ val = Number($("input[name=donate-amount]").val());
+ val = Math.max(val, 5);
+ $("input[name=donate-amount]").val(val);
+ currency = $("select[name=donate-currency]").val();
+ }
+ amount = (val * 100) | 0;
+ handler.open({
+ name: 'Donation',
+ description: 'Support calcurse Development',
+ currency: currency,
+ amount: amount,
+ allowRememberMe: false
+ });
+}
+
+function customHandler() {
+ $("#donate-custom").html('<input name="donate-amount" type="number" min="5" /> <select name="donate-currency"> <option value="eur">&euro;</option> <option value="usd">USD</option> </select> <a href="javascript:openHandler(0)">Donate</a>');
+ $("input[name=donate-amount]").focus();
+}
+
+window.addEventListener('popstate', function() {
+ handler.close();
+});
+</script>
+ </div>
+ <div id="footer">
+ Copyright &copy; 2012-2018 <a href="/support/#devs">calcurse Development Team</a>.
+ Licensed under the terms of the BSD License.
+ </div>
+ </body>
+</html>
diff --git a/downloads/index.html b/downloads/index.html
index a36571b..afde9d9 100644
--- a/downloads/index.html
+++ b/downloads/index.html
@@ -5,6 +5,7 @@
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<meta http-equiv="Content-Style-Type" content="text/css" />
+ <meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="/css/style.css" media="all" />
@@ -12,12 +13,13 @@
<body>
<div id="header" class="typeface-js">
- <a href="/"><img src="/images/logo.png" /></a>
+ <a href="/"><img src="/images/logo.png" alt="calcurse" /></a>
<ul>
<li><a href="/">About</a></li>
<li><a href="/downloads" class="current">Downloads</a></li>
<li><a href="/support">Support</a></li>
<li><a href="/devel">Development</a></li>
+ <li><a href="/donate">Donate</a></li>
</ul>
<p style="clear:both;"></p>
</div>
@@ -146,7 +148,7 @@ sub rsa4096 2011-10-12 [E]
</ul>
</div>
<div id="footer">
- Copyright &copy; 2012-2013 <a href="/support/#devs">calcurse Development Team</a>.
+ Copyright &copy; 2012-2018 <a href="/support/#devs">calcurse Development Team</a>.
Licensed under the terms of the BSD License.
</div>
</body>
diff --git a/index.html b/index.html
index 3ff3ac8..c983ae8 100644
--- a/index.html
+++ b/index.html
@@ -5,6 +5,7 @@
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<meta http-equiv="Content-Style-Type" content="text/css" />
+ <meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript" src="/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="/js/lightbox.js"></script>
@@ -16,12 +17,13 @@
<body>
<div id="header" class="typeface-js">
- <a href="/"><img src="/images/logo.png" /></a>
+ <a href="/"><img src="/images/logo.png" alt="calcurse" /></a>
<ul>
<li><a href="/" class="current">About</a></li>
<li><a href="/downloads">Downloads</a></li>
<li><a href="/support">Support</a></li>
<li><a href="/devel">Development</a></li>
+ <li><a href="/donate">Donate</a></li>
</ul>
<p style="clear:both;"></p>
</div>
@@ -64,79 +66,84 @@
<li><strong>UTF-8</strong> support</li>
</ul>
-<h2 id="screenshots">Screenshots</h2>
-<ul class="gallery">
- <li>
- <a href="/images/screenshots/main-1.jpg" rel="lightbox[screenshot]">
- <img src="/images/screenshots/thumb/main-1.png" alt="main screen">
- <span>Main screen</span>
- </a>
- </li>
- <li>
- <a href="/images/screenshots/main-2.jpg" rel="lightbox[screenshot]">
- <img src="/images/screenshots/thumb/main-2.png" alt="alternative color scheme">
- <span>Alternative color scheme</span>
- </a>
- </li>
- <li>
- <a href="/images/screenshots/compact.png" rel="lightbox[screenshot]">
- <img src="/images/screenshots/thumb/compact.png" alt="compact mode">
- <span>Compact panels</span>
- </a>
- </li>
- <li>
- <a href="/images/screenshots/popup.jpg" rel="lightbox[screenshot]">
- <img src="/images/screenshots/thumb/popup.png" alt="popup">
- <span>Item popup</span>
- </a>
- </li>
- <li>
- <a href="/images/screenshots/theme.jpg" rel="lightbox[screenshot]">
- <img src="/images/screenshots/thumb/theme.png" alt="themes">
- <span>Color configuration</span>
- </a>
- </li>
- <li>
- <a href="/images/screenshots/config.jpg" rel="lightbox[screenshot]">
- <img src="/images/screenshots/thumb/config.png" alt="config">
- <span>Layout configuration</span>
- </a>
- </li>
- <li>
- <a href="/images/screenshots/help.jpg" rel="lightbox[screenshot]">
- <img src="/images/screenshots/thumb/help.png" alt="themes">
- <span>Online help</span>
- </a>
- </li>
- <li>
- <a href="/images/screenshots/files.jpg" rel="lightbox[screenshot]">
- <img src="/images/screenshots/thumb/files.png" alt="data files">
- <span>Configuration file</span>
- </a>
- </li>
- <li>
- <a href="/images/screenshots/args.jpg" rel="lightbox[screenshot]">
- <img src="/images/screenshots/thumb/args.png" alt="command-line arguments">
- <span>Command-line arguments</span>
- </a>
- </li>
- <li>
- <a href="/images/screenshots/i18n.jpg" rel="lightbox[screenshot]">
- <img src="/images/screenshots/thumb/i18n.png" alt="calcurse and i18n">
- <span>Internationalization</span>
- </a>
- </li>
- <li>
- <a href="/images/screenshots/pcal.jpg" rel="lightbox[screenshot]">
- <img src="/images/screenshots/thumb/pcal.png" alt="calcurse pcal export">
- <span>Exports</span>
- </a>
- </li>
-</ul>
-<p style="clear:both;"></p>
+<h2 id="screenshots">Demo and Screenshots</h2>
+
+<p style="text-align: center; padding:1cm;">
+ <img src="/images/demo.gif" alt="Demo">
+</p>
+<div style="text-align: center;">
+ <ul class="gallery">
+ <li>
+ <a href="/images/screenshots/main-1.jpg" rel="lightbox[screenshot]">
+ <img src="/images/screenshots/thumb/main-1.png" alt="main screen">
+ <span>Main screen</span>
+ </a>
+ </li>
+ <li>
+ <a href="/images/screenshots/main-2.jpg" rel="lightbox[screenshot]">
+ <img src="/images/screenshots/thumb/main-2.png" alt="alternative color scheme">
+ <span>Alternative color scheme</span>
+ </a>
+ </li>
+ <li>
+ <a href="/images/screenshots/compact.png" rel="lightbox[screenshot]">
+ <img src="/images/screenshots/thumb/compact.png" alt="compact mode">
+ <span>Compact panels</span>
+ </a>
+ </li>
+ <li>
+ <a href="/images/screenshots/popup.jpg" rel="lightbox[screenshot]">
+ <img src="/images/screenshots/thumb/popup.png" alt="popup">
+ <span>Item popup</span>
+ </a>
+ </li>
+ <li>
+ <a href="/images/screenshots/theme.jpg" rel="lightbox[screenshot]">
+ <img src="/images/screenshots/thumb/theme.png" alt="themes">
+ <span>Color configuration</span>
+ </a>
+ </li>
+ <li>
+ <a href="/images/screenshots/config.jpg" rel="lightbox[screenshot]">
+ <img src="/images/screenshots/thumb/config.png" alt="config">
+ <span>Layout configuration</span>
+ </a>
+ </li>
+ <li>
+ <a href="/images/screenshots/help.jpg" rel="lightbox[screenshot]">
+ <img src="/images/screenshots/thumb/help.png" alt="themes">
+ <span>Online help</span>
+ </a>
+ </li>
+ <li>
+ <a href="/images/screenshots/files.jpg" rel="lightbox[screenshot]">
+ <img src="/images/screenshots/thumb/files.png" alt="data files">
+ <span>Configuration file</span>
+ </a>
+ </li>
+ <li>
+ <a href="/images/screenshots/args.jpg" rel="lightbox[screenshot]">
+ <img src="/images/screenshots/thumb/args.png" alt="command-line arguments">
+ <span>Command-line arguments</span>
+ </a>
+ </li>
+ <li>
+ <a href="/images/screenshots/i18n.jpg" rel="lightbox[screenshot]">
+ <img src="/images/screenshots/thumb/i18n.png" alt="calcurse and i18n">
+ <span>Internationalization</span>
+ </a>
+ </li>
+ <li>
+ <a href="/images/screenshots/pcal.jpg" rel="lightbox[screenshot]">
+ <img src="/images/screenshots/thumb/pcal.png" alt="calcurse pcal export">
+ <span>Exports</span>
+ </a>
+ </li>
+ </ul>
+</div>
</div>
<div id="footer">
- Copyright &copy; 2012-2013 <a href="/support/#devs">calcurse Development Team</a>.
+ Copyright &copy; 2012-2018 <a href="/support/#devs">calcurse Development Team</a>.
Licensed under the terms of the BSD License.
</div>
</body>
diff --git a/support/index.html b/support/index.html
index be1d3b7..1bad52f 100644
--- a/support/index.html
+++ b/support/index.html
@@ -5,6 +5,7 @@
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<meta http-equiv="Content-Style-Type" content="text/css" />
+ <meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="/css/style.css" media="all" />
@@ -12,12 +13,13 @@
<body>
<div id="header" class="typeface-js">
- <a href="/"><img src="/images/logo.png" /></a>
+ <a href="/"><img src="/images/logo.png" alt="calcurse" /></a>
<ul>
<li><a href="/">About</a></li>
<li><a href="/downloads">Downloads</a></li>
<li><a href="/support" class="current">Support</a></li>
<li><a href="/devel">Development</a></li>
+ <li><a href="/donate">Donate</a></li>
</ul>
<p style="clear:both;"></p>
</div>
@@ -141,7 +143,7 @@
</p>
</div>
<div id="footer">
- Copyright &copy; 2012-2013 <a href="/support/#devs">calcurse Development Team</a>.
+ Copyright &copy; 2012-2018 <a href="/support/#devs">calcurse Development Team</a>.
Licensed under the terms of the BSD License.
</div>
</body>