435 lines
18 KiB
HTML
435 lines
18 KiB
HTML
<!DOCTYPE HTML>
|
|
<!--
|
|
Dimension by HTML5 UP
|
|
html5up.net | @ajlkn
|
|
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
|
-->
|
|
<html>
|
|
<head>
|
|
<title>Scan TiBillet</title>
|
|
<meta charset="utf-8"/>
|
|
{% load static %}
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
|
|
<link rel="stylesheet" href="{% static 'html5up-dimension/assets/css/main.css' %}"/>
|
|
<noscript>
|
|
<link rel="stylesheet" href="{% static 'html5up-dimension/assets/css/noscript.css' %}"/>
|
|
</noscript>
|
|
</head>
|
|
<body class="is-preload">
|
|
|
|
<!-- Wrapper -->
|
|
<div id="wrapper">
|
|
|
|
<!-- Header -->
|
|
<header id="header">
|
|
{# <div class="logo">#}
|
|
{# <span class="icon fa-gem"></span>#}
|
|
{# </div>#}
|
|
<div class="content">
|
|
<div class="inner">
|
|
<h1>Carte Cashless</h1>
|
|
<h1>{{ numero_carte }}</h1>
|
|
<h1>{{ client_name }}</h1>
|
|
{# <p>A fully responsive site template designed by <a href="https://html5up.net">HTML5 UP</a> and released<br />#}
|
|
{# for free under the <a href="https://html5up.net/license">Creative Commons</a> license.</p>#}
|
|
</div>
|
|
</div>
|
|
<nav>
|
|
<ul>
|
|
<li><a href="#recharger">Recharger</a></li>
|
|
<li><a href="#historique">Historique</a></li>
|
|
{% if carte_resto %}
|
|
<li><a href="/media/{{ carte_resto }}">Restaurant</a></li>
|
|
{% endif %}
|
|
{% if billetterie_bool %}
|
|
<li><a href="/">Billetterie</a></li>
|
|
{% endif %}
|
|
|
|
{% if site_web %}
|
|
<li><a href="{{ site_web }}">Site web</a></li>
|
|
{% endif %}
|
|
{# <li><a href="#elements">Elements</a></li>#}
|
|
|
|
</ul>
|
|
</nav>
|
|
</header>
|
|
|
|
<!-- Main -->
|
|
<div id="main">
|
|
|
|
<!-- Intro -->
|
|
<article id="recharger">
|
|
<h2 class="major">carte {{ numero_carte }}</h2>
|
|
<span class="image main"><img src="/media/{{ image_carte.med }}" alt=""/></span>
|
|
<form method="post" action="#">
|
|
{% csrf_token %}
|
|
<div class="fields">
|
|
<div class="field">
|
|
<label for="email">Email</label>
|
|
{% if email %}
|
|
<input type="email" name="email" id="Email" required="True" value="{{ email }}"/>
|
|
{% else %}
|
|
<input type="email" name="email" id="email" required="True"/>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label for="montant_recharge">Somme à recharger (€)</label>
|
|
<input id="montant_recharge" type="number" step="any" name="montant_recharge" required="True"/>
|
|
</div>
|
|
</div>
|
|
<ul class="actions">
|
|
<li><input type="submit" value="Payer" class="primary"/></li>
|
|
</ul>
|
|
</form>
|
|
|
|
</article>
|
|
|
|
<!-- Historique -->
|
|
<article id="historique">
|
|
<h2 class="major">Historique</h2>
|
|
<h4>carte : {{ numero_carte }}</h4>
|
|
<span class="image main"><img src="images/pic02.jpg" alt=""/></span>
|
|
<p>Adipiscing magna sed dolor elit. Praesent eleifend dignissim arcu, at eleifend sapien imperdiet ac.
|
|
Aliquam erat volutpat. Praesent urna nisi, fringila lorem et vehicula lacinia quam. Integer sollicitudin
|
|
mauris nec lorem luctus ultrices.</p>
|
|
<p>Nullam et orci eu lorem consequat tincidunt vivamus et sagittis libero. Mauris aliquet magna magna sed
|
|
nunc rhoncus pharetra. Pellentesque condimentum sem. In efficitur ligula tate urna. Maecenas laoreet
|
|
massa vel lacinia pellentesque lorem ipsum dolor. Nullam et orci eu lorem consequat tincidunt. Vivamus
|
|
et sagittis libero. Mauris aliquet magna magna sed nunc rhoncus amet feugiat tempus.</p>
|
|
</article>
|
|
|
|
<article id="success">
|
|
<h2 class="major">Rechargement OK</h2>
|
|
<h4>Vous avez bien rechargé la carte {{ numero_carte }}.</h4>
|
|
<div class="table-wrapper">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>Portefeuille :</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for asset in liste_assets %}
|
|
<tr>
|
|
<td>{{ asset }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<ul class="actions">
|
|
<li><a href="#historique" class="button primary">Voir l'historique</a></li>
|
|
</ul>
|
|
</article>
|
|
|
|
<article id="error">
|
|
<h2 class="major">ERREUR Rechargement</h2>
|
|
<h3>Le paiement semble ne pas être passé. Vérifiez votre paiement ou contacter un administrateur</h3>
|
|
<ul class="actions">
|
|
<li><a href="#historique" class="button primary">Voir l'historique</a></li>
|
|
</ul>
|
|
</article>
|
|
|
|
<!-- Contact -->
|
|
<article id="external">
|
|
<h2 class="major">Contact</h2>
|
|
<form method="post" action="#">
|
|
<div class="fields">
|
|
<div class="field half">
|
|
<label for="name">Name</label>
|
|
<input type="text" name="name" id="name"/>
|
|
</div>
|
|
<div class="field half">
|
|
<label for="email">Email</label>
|
|
<input type="text" name="email" id="email"/>
|
|
</div>
|
|
<div class="field">
|
|
<label for="message">Message</label>
|
|
<textarea name="message" id="message" rows="4"></textarea>
|
|
</div>
|
|
</div>
|
|
<ul class="actions">
|
|
<li><input type="submit" value="Send Message" class="primary"/></li>
|
|
<li><input type="reset" value="Reset"/></li>
|
|
</ul>
|
|
</form>
|
|
<ul class="icons">
|
|
<li><a href="#" class="icon brands fa-twitter"><span class="label">Twitter</span></a></li>
|
|
<li><a href="#" class="icon brands fa-facebook-f"><span class="label">Facebook</span></a></li>
|
|
<li><a href="#" class="icon brands fa-instagram"><span class="label">Instagram</span></a></li>
|
|
<li><a href="#" class="icon brands fa-github"><span class="label">GitHub</span></a></li>
|
|
</ul>
|
|
</article>
|
|
|
|
<!-- Elements -->
|
|
<article id="elements">
|
|
<h2 class="major">Elements</h2>
|
|
|
|
<section>
|
|
<h3 class="major">Text</h3>
|
|
<p>This is <b>bold</b> and this is <strong>strong</strong>. This is <i>italic</i> and this is <em>emphasized</em>.
|
|
This is <sup>superscript</sup> text and this is <sub>subscript</sub> text.
|
|
This is <u>underlined</u> and this is code: <code>for (;;) { ... }</code>. Finally, <a href="#">this
|
|
is a link</a>.</p>
|
|
<hr/>
|
|
<h2>Heading Level 2</h2>
|
|
<h3>Heading Level 3</h3>
|
|
<h4>Heading Level 4</h4>
|
|
<h5>Heading Level 5</h5>
|
|
<h6>Heading Level 6</h6>
|
|
<hr/>
|
|
<h4>Blockquote</h4>
|
|
<blockquote>Fringilla nisl. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget tempus
|
|
euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis
|
|
volutpat ac adipiscing accumsan faucibus. Vestibulum ante ipsum primis in faucibus lorem ipsum dolor
|
|
sit amet nullam adipiscing eu felis.
|
|
</blockquote>
|
|
<h4>Preformatted</h4>
|
|
<pre><code>i = 0;
|
|
|
|
while (!deck.isInOrder()) {
|
|
print 'Iteration ' + i;
|
|
deck.shuffle();
|
|
i++;
|
|
}
|
|
|
|
print 'It took ' + i + ' iterations to sort the deck.';</code></pre>
|
|
</section>
|
|
|
|
<section>
|
|
<h3 class="major">Lists</h3>
|
|
|
|
<h4>Unordered</h4>
|
|
<ul>
|
|
<li>Dolor pulvinar etiam.</li>
|
|
<li>Sagittis adipiscing.</li>
|
|
<li>Felis enim feugiat.</li>
|
|
</ul>
|
|
|
|
<h4>Alternate</h4>
|
|
<ul class="alt">
|
|
<li>Dolor pulvinar etiam.</li>
|
|
<li>Sagittis adipiscing.</li>
|
|
<li>Felis enim feugiat.</li>
|
|
</ul>
|
|
|
|
<h4>Ordered</h4>
|
|
<ol>
|
|
<li>Dolor pulvinar etiam.</li>
|
|
<li>Etiam vel felis viverra.</li>
|
|
<li>Felis enim feugiat.</li>
|
|
<li>Dolor pulvinar etiam.</li>
|
|
<li>Etiam vel felis lorem.</li>
|
|
<li>Felis enim et feugiat.</li>
|
|
</ol>
|
|
<h4>Icons</h4>
|
|
<ul class="icons">
|
|
<li><a href="#" class="icon brands fa-twitter"><span class="label">Twitter</span></a></li>
|
|
<li><a href="#" class="icon brands fa-facebook-f"><span class="label">Facebook</span></a></li>
|
|
<li><a href="#" class="icon brands fa-instagram"><span class="label">Instagram</span></a></li>
|
|
<li><a href="#" class="icon brands fa-github"><span class="label">Github</span></a></li>
|
|
</ul>
|
|
|
|
<h4>Actions</h4>
|
|
<ul class="actions">
|
|
<li><a href="#" class="button primary">Default</a></li>
|
|
<li><a href="#" class="button">Default</a></li>
|
|
</ul>
|
|
<ul class="actions stacked">
|
|
<li><a href="#" class="button primary">Default</a></li>
|
|
<li><a href="#" class="button">Default</a></li>
|
|
</ul>
|
|
</section>
|
|
|
|
<section>
|
|
<h3 class="major">Table</h3>
|
|
<h4>Default</h4>
|
|
<div class="table-wrapper">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th>Description</th>
|
|
<th>Price</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>Item One</td>
|
|
<td>Ante turpis integer aliquet porttitor.</td>
|
|
<td>29.99</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Item Two</td>
|
|
<td>Vis ac commodo adipiscing arcu aliquet.</td>
|
|
<td>19.99</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Item Three</td>
|
|
<td> Morbi faucibus arcu accumsan lorem.</td>
|
|
<td>29.99</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Item Four</td>
|
|
<td>Vitae integer tempus condimentum.</td>
|
|
<td>19.99</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Item Five</td>
|
|
<td>Ante turpis integer aliquet porttitor.</td>
|
|
<td>29.99</td>
|
|
</tr>
|
|
</tbody>
|
|
<tfoot>
|
|
<tr>
|
|
<td colspan="2"></td>
|
|
<td>100.00</td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
|
|
<h4>Alternate</h4>
|
|
<div class="table-wrapper">
|
|
<table class="alt">
|
|
<thead>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th>Description</th>
|
|
<th>Price</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>Item One</td>
|
|
<td>Ante turpis integer aliquet porttitor.</td>
|
|
<td>29.99</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Item Two</td>
|
|
<td>Vis ac commodo adipiscing arcu aliquet.</td>
|
|
<td>19.99</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Item Three</td>
|
|
<td> Morbi faucibus arcu accumsan lorem.</td>
|
|
<td>29.99</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Item Four</td>
|
|
<td>Vitae integer tempus condimentum.</td>
|
|
<td>19.99</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Item Five</td>
|
|
<td>Ante turpis integer aliquet porttitor.</td>
|
|
<td>29.99</td>
|
|
</tr>
|
|
</tbody>
|
|
<tfoot>
|
|
<tr>
|
|
<td colspan="2"></td>
|
|
<td>100.00</td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
</section>
|
|
|
|
<section>
|
|
<h3 class="major">Buttons</h3>
|
|
<ul class="actions">
|
|
<li><a href="#" class="button primary">Primary</a></li>
|
|
<li><a href="#" class="button">Default</a></li>
|
|
</ul>
|
|
<ul class="actions">
|
|
<li><a href="#" class="button">Default</a></li>
|
|
<li><a href="#" class="button small">Small</a></li>
|
|
</ul>
|
|
<ul class="actions">
|
|
<li><a href="#" class="button primary icon solid fa-download">Icon</a></li>
|
|
<li><a href="#" class="button icon solid fa-download">Icon</a></li>
|
|
</ul>
|
|
<ul class="actions">
|
|
<li><span class="button primary disabled">Disabled</span></li>
|
|
<li><span class="button disabled">Disabled</span></li>
|
|
</ul>
|
|
</section>
|
|
|
|
<section>
|
|
<h3 class="major">Form</h3>
|
|
<form method="post" action="#">
|
|
<div class="fields">
|
|
<div class="field half">
|
|
<label for="demo-name">Name</label>
|
|
<input type="text" name="demo-name" id="demo-name" value="" placeholder="Jane Doe"/>
|
|
</div>
|
|
<div class="field half">
|
|
<label for="demo-email">Email</label>
|
|
<input type="email" name="demo-email" id="demo-email" value=""
|
|
placeholder="jane@untitled.tld"/>
|
|
</div>
|
|
<div class="field">
|
|
<label for="demo-category">Category</label>
|
|
<select name="demo-category" id="demo-category">
|
|
<option value="">-</option>
|
|
<option value="1">Manufacturing</option>
|
|
<option value="1">Shipping</option>
|
|
<option value="1">Administration</option>
|
|
<option value="1">Human Resources</option>
|
|
</select>
|
|
</div>
|
|
<div class="field half">
|
|
<input type="radio" id="demo-priority-low" name="demo-priority" checked>
|
|
<label for="demo-priority-low">Low</label>
|
|
</div>
|
|
<div class="field half">
|
|
<input type="radio" id="demo-priority-high" name="demo-priority">
|
|
<label for="demo-priority-high">High</label>
|
|
</div>
|
|
<div class="field half">
|
|
<input type="checkbox" id="demo-copy" name="demo-copy">
|
|
<label for="demo-copy">Email me a copy</label>
|
|
</div>
|
|
<div class="field half">
|
|
<input type="checkbox" id="demo-human" name="demo-human" checked>
|
|
<label for="demo-human">Not a robot</label>
|
|
</div>
|
|
<div class="field">
|
|
<label for="demo-message">Message</label>
|
|
<textarea name="demo-message" id="demo-message" placeholder="Enter your message"
|
|
rows="6"></textarea>
|
|
</div>
|
|
</div>
|
|
<ul class="actions">
|
|
<li><input type="submit" value="Send Message" class="primary"/></li>
|
|
<li><input type="reset" value="Reset"/></li>
|
|
</ul>
|
|
</form>
|
|
</section>
|
|
|
|
</article>
|
|
|
|
</div>
|
|
|
|
<!-- Footer -->
|
|
<footer id="footer">
|
|
<p class="copyright">© Untitled. Design: <a href="https://html5up.net">HTML5 UP</a>.</p>
|
|
</footer>
|
|
|
|
</div>
|
|
|
|
<!-- BG -->
|
|
<div id="bg"></div>
|
|
|
|
<!-- Scripts -->
|
|
<script src="{% static 'html5up-dimension/assets/js/jquery.min.js' %}"></script>
|
|
<script src="{% static 'html5up-dimension/assets/js/browser.min.js' %}"></script>
|
|
<script src="{% static 'html5up-dimension/assets/js/breakpoints.min.js' %}"></script>
|
|
<script src="{% static 'html5up-dimension/assets/js/util.js' %}"></script>
|
|
<script src="{% static 'html5up-dimension/assets/js/main.js' %}"></script>
|
|
|
|
</body>
|
|
</html>
|