summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/frontend/index.html38
-rw-r--r--src/frontend/style.css328
2 files changed, 17 insertions, 349 deletions
diff --git a/src/frontend/index.html b/src/frontend/index.html
index d73683df..19b7a21c 100644
--- a/src/frontend/index.html
+++ b/src/frontend/index.html
@@ -32,9 +32,11 @@
<body id="css-zen-garden">
<div class="supporting" id="welcome" role="main">
<div class="explanation" id="zen-explanation" role="article">
- <h1>Welcome to the Taler "Toy" Demonstrator</h1>
+ <h1>Welcome to the Taler "Toy" Shop</h1>
<p>This "toy" website provides you with the ability to
- experience using the Taler payment system without using
+ experience using the
+ <a href="https://www.taler.net/">GNU Taler</a>
+ payment system without using
valuable currency. Here, we guide you through the steps
of installing a Taler wallet, withdrawing Taler coins and
spending them at a merchant. For this demonstrator, we
@@ -50,7 +52,7 @@
<p>First, you need to install the Taler wallet browser extension.
It is currently only available for Firefox. If you run
Firefox, simply click <a href="/extension">here</a>
- to download and install the extension. You will have to
+ to download and install the extension. You will have to
click on "allow" and "install" dialogs shown by Firefox.
After that, the Taler logo should appear on the right side
of your navigation bar.
@@ -65,7 +67,7 @@
<div class="explanation" id="wire" role="article" style="display:none;">
<h2>Step 2: Performing a wire transfer</h2>
<p>The next step is to transfer currency to the mint to
- obtain Taler coins. This is typically done using a
+ obtain Taler coins. This is typically done using a
wire transfer. However, as this is just a demonstrator,
we will allow you to send the mint KUDOS coins using a simple
form on the <a href="http://demo.taler.net/transfer" target="_blank">mint's website</a>
@@ -75,14 +77,14 @@
<div class="explanation" id="payment" role="article" style="display:none;">
<h2>Step 3: Select project to donate KUDOS to!</h2>
<p>Now it is time to spend your hard earned KUDOS.
- For your convenience, we integrated a tiny "shop"
- accepting KUDOS right here into this page.</p>
- <p>Please choose a project and the amount of KUDOS you
+ For your convenience, we integrated a tiny "shop"
+ accepting KUDOS right here into this page.</p>
+ <p>Please choose a project and the amount of KUDOS you
wish to donate.</p>
<form name="tform" action="/checkout.php" method="POST">
<div class="participation" id="fake-shop">
<br>
- <input type="radio" name="donation_receiver" value="Taler" checked="true">Taler</input>
+ <input type="radio" name="donation_receiver" value="Taler" checked="true">GNU Taler</input>
<br>
<input type="radio" name="donation_receiver" value="Tor">Tor</input>
<br>
@@ -92,9 +94,9 @@
<option value="1">1 KUDOS</option>
<option value="6">5 KUDOS (*)</option>
<option value="10">10 KUDOS</option>
- <input type="hidden" name="donation_currency" value="KUDOS"></input>
</select>
- <input type="submit" name="keyName" value="Donate!">
+ <input type="hidden" name="donation_currency" value="KUDOS"/>
+ <input type="submit" name="keyName" value="Donate!"/>
<br>
<br>
</div>
@@ -104,7 +106,7 @@
make you donate 6 KUDOS instead of the 5 KUDOS you got to see. But do
not worry, you will be given the opportunity to review the
final offer from the merchant in a window secured
- by the Taler extension. That way, you can spot the
+ by the Taler extension. That way, you can spot the
error before committing to an incorrect contract.</p>
<p>(**) The 'localmint' option wants a mint whose base URL is "localmint".
A possible configuration for this would be having an entry like '127.0.0.1
@@ -141,21 +143,15 @@
b.style.display = 'none';
};
- function test_without_wallet(){
- wallet_installed_cb();
- }
-
- test_without_wallet();
-
/* Set up a listener to be called whenever a Wallet gets installed
so that the user is led towards the demo's steps progressively */
- document.body.addEventListener("taler-wallet-installed",
- wallet_installed_cb,
+ document.body.addEventListener("taler-wallet-installed",
+ wallet_installed_cb,
false, false);
/* Setup callback to be called whenever the wallet is uninstalled */
- document.body.addEventListener("taler-unload",
- wallet_uninstalled_cb,
+ document.body.addEventListener("taler-unload",
+ wallet_uninstalled_cb,
false);
</script>
</body>
diff --git a/src/frontend/style.css b/src/frontend/style.css
index a476a630..e69de29b 100644
--- a/src/frontend/style.css
+++ b/src/frontend/style.css
@@ -1,328 +0,0 @@
-/* css Zen Garden submission 020 - 'Friendly Beaches' by Sophie G - www.sophie-g.net */
-/* css released under Creative Commons ShareAlike License v1.0 - http://creativecommons.org/licenses/sa/1.0/ */
-/* All associated graphics copyright 2003, Sophie G */
-
-
-/* IMPORTANT */
-/* This design is not a template. You may not reproduce it elsewhere without the designer's written permission. */
-/* The CSS itself may freely be used for anything you wish, but the associated graphics belong to the designer. */
-/* What you may use - .css files. What you may not use - .jpg, .gif, and .png files. */
-
-
-
-body {
- background-color: #FFFFFF;
- margin: 0px;
- padding: 10px;
- font-family: Ubuntu, Tahoma, Sans;
- font-size: 90%;
-}
-
-p {
- line-height: 180%;
-}
-.page-wrapper {
- background-color: #EDEEF0;
- border: 1px solid #DAD5D9;
- padding: 0px;
- margin: 0px;
-}
-abbr {
- border-bottom: 1px #6BA0D2 dashed;
-}
-header,h1 {
- font-family: Impact, Georgia, serif;
- background-color: #FFFFFF;
-}
-header h1 {
- height: 190px;
- margin: 0px;
- background-color: black;
- background-image: url(Gala.jpg);
- background-repeat: no-repeat;
-}
-header h1, header h2 {
- text-indent: 100%;
- white-space: nowrap;
- overflow: hidden;
-}
-header h2 {
- background-color: #EDEEF0;
- margin: 0px;
- height: 24px;
- padding: 0px 14px 2px 14px;
- background-image: url(headerh2.gif);
- background-repeat: no-repeat;
-}
-header h2 abbr {
- color: #FFF;
- border-bottom: 1px #FFF dashed;
-}
-.summary p:first-child {
- position: absolute;
- right: 21px;
- top: 21px;
- width: 12em;
- height: 165px;
- padding: 3px 0 0 0;
- margin: 0px;
- border: 1px solid #0C2953;
- text-align: center;
- font-size: 90%;
- font-family: Impact, Georgia, serif;
- line-height: 110%;
- color: #FFF;
- background-image: url(summary.jpg);
- background-repeat: no-repeat;
- background-position: 50% 100%;
- background-color: #0C2953;
-}
-.preamble {
- padding: 0px 15em 0px 3em;
-}
-.preamble h3 {
- margin: 15px 0px 0px 0px;
- padding: 6px 20px 2px 6px;
- text-align: left;
- font-size: 180%;
- font-variant: small-caps;
- color: #6BA0D2;
- background-image: url(bordDroitPreambleh3.gif);
- background-repeat: no-repeat;
- background-position: 100% 0px;
- background-color: #F6F7F7;
-}
-.preamble h3::before {
- content: " ";
- display: inline-block;
- padding: 35px 0px 30px 48px;
- background-image: url(preambleShell.jpg);
- background-repeat: no-repeat;
- background-position: 0px 50%;
- vertical-align: middle;
-}
-.preamble p {
- text-align: justify;
-}
-.preamble p:nth-child(2), .preamble p:nth-child(3) {
- margin: 0px;
- padding: 10px 20px 2px 6px;
- background-image: url(bordDroitPreamble.gif);
- background-repeat: repeat-y;
- background-position: 100% 0px;
- background-color: #F6F7F7;
-}
-.preamble p:nth-child(4) {
- margin: 0px;
- padding: 0px;
- background-image: url(bordBasPreamble.gif);
- background-repeat: no-repeat;
- background-position: 100% 100%;
- background-color: #F6F7F7;
- padding: 10px 20px 20px 6px;
-}
-.preamble p:nth-child(4)::after {
- content: " ";
- display: block;
- margin: 0px;
- padding: 0 20px 0 6px;
- background-image: url(bordBasPreambleGauche.gif);
- background-repeat: no-repeat;
- background-position: 0% 100%;
-}
-.supporting {
- margin: 0px;
- padding: 10px 16em 0px 1em;
- font-size: 90%;
-}
-.explanation, .participation, .benefits, .requirements {
- border: 2px solid #FFF;
- padding: 0px;
-}
-.explanation {
- margin: 0px 0px 10px 0px;
-}
-.participation {
- margin: 0px 0px 10px 0px;
- float: left;
- width: 30%;
-}
-.benefits {
- margin: 0px 0px 10px 32%;
-}
-.requirements {
- margin: 0px 0px 10px 32%;
-}
-.supporting h3 {
- margin: 0px;
- padding: 5px 30px 1px 2px;
- text-align: left;
- font-size: 120%;
- font-variant: small-caps;
- color: #6BA0D2;
- border-bottom: 1px solid #6BA0D2;
- background-color: #F6F7F7;
- background-repeat: no-repeat;
- background-position: 100% 50%;
-}
-.explanation h3 {
- background-image: url(explanationShell.jpg);
-}
-.supporting form {
- padding: 30px;
- display: inline-block;
- clear: both;
- width: 120em;
-}
-.supporting input {
- margin: 8px;
-}
-.participation h3 {
- background-image: url(participationShell.jpg);
-}
-.benefits h3 {
- background-image: url(benefitsShell.jpg);
-}
-.requirements h3 {
- background-image: url(requirementsRock.jpg);
-}
-.supporting p {
- text-align: justify;
- margin: 10px 0px 0px 0px;
- padding: 1px 3px 2px 3px;
-}
-.supporting a:link {
- color: #0083FF;
- font-weight: bold;
-}
-.supporting a:visited {
- color: #204160;
- font-weight: bold;
-}
-.supporting a:hover, .supporting a:active {
- color: #8C0000;
- font-weight: bold;
- text-decoration: none;
-}
-.sidebar, .summary p:last-child {
- font-size: 90%;
- font-family: Impact, Georgia, serif;
- position: absolute;
- right: 21px;
- width: 12em;
- border: 1px solid #0C2953;
- padding: 0px;
- margin: 0px;
- background-color: #A4ACB3;
-}
-.summary p:last-child {
- height: 50px;
- text-align: center;
- top: 217px;
- font-size: 90%;
- display: block;
- padding: 3px 0;
- color: #FFF;
-}
-.sidebar {
- top: 266px;
-}
-.sidebar h3 {
- background-color: #0C2953;
- color: #FFF;
- margin: 0px;
- padding: 30px 1px 1px 1px;
- background-repeat: no-repeat;
-}
-.sidebar h3.select {
- background-image: url(selecth3.jpg);
- background-position: 50% 0%;
-}
-.sidebar h3.favorites {
- border-top: 1px solid #0C2953;
- background-image: url(favoritesh3.jpg);
- background-position: 40% 100%;
-}
-.sidebar h3.archives {
- border-top: 1px solid #0C2953;
- background-image: url(archivesh3.jpg);
- background-position: 40% 100%;
-}
-.sidebar h3.resources {
- border-top: 1px solid #0C2953;
- background-image: url(resourcesh3.jpg);
- background-position: 50% 30%;
-}
-.sidebar ul {
- list-style-type: none;
- font-size: 90%;
- color: #FFF;
- margin: 0px;
- padding: 0px;
- background-color: #A4ACB3;
-}
-.sidebar li {
- padding: 3px 2px 3px 2px;
- margin-bottom: 4px;
-}
-.sidebar li:hover {
- padding: 2px 1px 2px 1px;
- border: 1px dotted #0C2953;
- background-color: #6BA0D2;
-}
-.summary p:last-child a:link {
- color: #FFF;
- font-weight: bold;
-}
-.summary p:last-child a:visited {
- color: #204160;
-}
-.summary p:last-child a:hover, .summary p:last-child a:active {
- color: #FFD800;
- font-weight: bold;
- text-decoration: none;
-}
-.sidebar a:link, .sidebar a:visited {
- border-left: 6px solid #FFF;
- padding-left: 2px;
- font-weight: bold;
- color: #FFF;
-}
-.sidebar a:visited {
- color: #204160;
-}
-.sidebar a:hover, .sidebar a:active {
- border-left: 6px solid #FFD800;
- padding-left: 2px;
- color: #FFD800;
- text-decoration: none;
- font-weight: bold;
-}
-.sidebar a.designer-name:link, .sidebar a.designer-name:visited {
- border-left: none;
- padding-left: 0px;
- font-weight: normal;
- color: #FFF;
-}
-.sidebar a.designer-name:hover, .sidebar a.designer-name:active {
- border-left: none;
- padding-left: 0px;
- color: #FFD800;
- text-decoration: none;
-}
-.sidebar abbr {
- border-bottom: 1px #FFF dashed;
-}
-footer {
- clear: both;
- text-align: right;
- margin: 0px -16em 0px 0px;
- padding: 25px 0px 0px 0px;
- background-repeat: no-repeat;
- background-image: url(signSoph.gif);
- background-position: 0% 95%;
-}
-footer a {
- font-size: 70%;
- font-family: Impact, Georgia, serif;
-}