diff options
| author | Marcello Stanisci <marcello.stanisci@inria.fr> | 2017-06-02 16:28:03 +0200 |
|---|---|---|
| committer | Marcello Stanisci <marcello.stanisci@inria.fr> | 2017-06-02 16:28:03 +0200 |
| commit | 81caf93b3e452300dc86e8862480da16787e5699 (patch) | |
| tree | 530789602f0b47a6d719335e4b0da821b8602bc5 /demo/index.html.j2 | |
| parent | b57c38e7d1a75afefb1a1097043b7efd67a7e0ca (diff) | |
| download | landing-81caf93b3e452300dc86e8862480da16787e5699.tar.gz landing-81caf93b3e452300dc86e8862480da16787e5699.tar.bz2 landing-81caf93b3e452300dc86e8862480da16787e5699.zip | |
rearranging the whole repository into docs/ and demo/ subdirectories.
Diffstat (limited to 'demo/index.html.j2')
| -rw-r--r-- | demo/index.html.j2 | 124 |
1 files changed, 124 insertions, 0 deletions
diff --git a/demo/index.html.j2 b/demo/index.html.j2 new file mode 100644 index 0000000..d18ba27 --- /dev/null +++ b/demo/index.html.j2 @@ -0,0 +1,124 @@ +<!DOCTYPE html> +<html lang="en" data-taler-nojs="true"> +<head profile="http://www.w3.org/2005/10/profile"> + <meta charset="utf-8"/> + <title>Taler Demo</title> + <link rel="stylesheet" type="text/css" href="{{ url('static/web-common/pure.css') }}" /> + <link rel="stylesheet" type="text/css" href="{{ url('static/web-common/demo.css') }}" /> + <link rel="stylesheet" type="text/css" href="{{ url('static/web-common/taler-fallback.css') }}" id="taler-presence-stylesheet" /> + <link rel="icon" type="image/png" href="{{ url('static/web-common/favicon-taler.ico') }}" /> + + <style type="text/css"> + a[disabled="true"] { + pointer-events: none; + color: grey; + } + + .bluebox { + background-color: #C2C6FF; + border: solid; + border-radius: 5px; + padding: 0.5em; + } + .greenbox { + background-color: #5EFF64; + border: solid; + border-radius: 5px; + padding: 0.5em; + } + .graybox { + background-color: #DDDDDD; + border: solid; + border-radius: 5px; + padding: 0.5em; + } + </style> +</head> + +<body> + <div class="demobar"> + <h1><span class="tt adorn-brackets">Taler Demo</span></h1> + <h1><span class="it"><a href="#">Introduction</a></span></h1> + <p>This is the entry point of the Taler demo. Follow the instructions and try Taler with the other pages linked below!</p> + <ul> + <li><a href="{{ intro_url }}">Introduction</a></li> + <li><a href="{{ bank_url }}">Bank</a></li> + <li><a href="{{ merchant_blog_url }}">Essay Shop</a></li> + <li><a href="{{ merchant_donations_url }}">Donations</a></li> + </ul> + <p>You can learn more about Taler on our main <a href="https://taler.net">website</a>.</p> + </div> + <section id="main" class="content"> + <article> + <h2>Step 1: Install the Taler wallet</h2> + Install the wallet from the <a href="https://taler.net/wallet-installation.html">installation page</a>. + It only takes one click. + <p class="bluebox taler-installed-hide"> + You don't have a wallet installed yet. + </p> + <p class="greenbox taler-installed-show"> + Congratulations, you have installed the Taler wallet correctly. + You can now proceed with the next steps. + </p> + </article> + + <article> + <h2>Step 2: Withdraw coins</h2> + <p> + + Now you can withdraw coins into your wallet by going to our <a href="{{ bank_url }}">bank</a>. + + In this demo you're paying with KUDOS, an imaginary currency. When you + create an account at our bank, you'll get 100 KUDOS for free. + </p> + <p class="graybox"> + We can't check if you were able to complete this step, since websites + can't see the balance in your wallet. Please click on the Taler icon + in your browser to check your balance. + </p> + </article> + + <article> + <h2>Step 3: Pay</sup></h2> + We have two demo merchants where you can spend your coins: + <ul> + <li> + The <a href="{{ merchant_blog_url }}">essay store</a>, where you can pay KUDOS for + individual chapters of Richard Stallman's book "Free Software, Free + Society", which is also available for free at <a href="http://www.fsf.org/">the FSF</a>. + </li> + <li> + The <a href="{{ merchant_donations_url }}">project donation Web site</a>, where + you can show respect to a software project of your choice + by giving them KUDOS. + </li> + </ul> + </article> + <article> + <h2>Step 4: Back office</sup></h2> + Finally, you can take the perspective of the merchant, who just + sold articles using taler. + <ul> + <li> + The <a href="{{ merchant_blog_url }}/backoffice">back office Web site</a> + allows you to track the transactions of the merchant. + </li> + <li> + The <a href="{{ bank_url }}/public-accounts">public accounts page</a> at the bank + allow you to observe transactions of certain bank accounts, including + those of the shops, from the perspective of the bank. + </li> + </ul> + </article> + <article> + <h2>Step 5: Reach out to us</sup></h2> + Let us know what you think by <a href="mailto:demo-feedback@taler.net">contacting us</a>. + </article> + <hr /> + <div class="copyright"> + <p>Copyright © 2014—2017 INRIA</p> + <a href="javascript.html" data-jslicense="1" class="jslicenseinfo">JavaScript license information</a> + </div> + </section> +</body> +</html> |