Skip to content

Commit

Permalink
img
Browse files Browse the repository at this point in the history
  • Loading branch information
CedricBds committed Jan 27, 2022
1 parent ad3df92 commit d4a492f
Show file tree
Hide file tree
Showing 3 changed files with 125 additions and 95 deletions.
Binary file added public/assets/img/cb.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/assets/img/paypal.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
220 changes: 125 additions & 95 deletions templates/formulaires/userform.html.twig
Original file line number Diff line number Diff line change
Expand Up @@ -16,17 +16,17 @@
{% block body %}
<script src="/assets/js/toggler.js"></script>
<main>
{% if app.user %}
<div class="py-5 text-center mt-5">
<h1>Modifier votre compte utilisateur</h1>
</div>
{% else %}
<div class="py-5 text-center mt-5">
<h1>Inscription utilisateur</h1>
<p class="lead">Veuillez compléter le formulaire utilisateur ci-dessous afin d'enregistrer vos informations.</p>
</div>
{% endif %}
{% if app.user %}
<div class="py-5 text-center mt-5">
<h1>Modifier votre compte utilisateur</h1>
</div>
{% else %}
<div class="py-5 text-center mt-5">
<h1>Inscription utilisateur</h1>
<p class="lead">Veuillez compléter le formulaire utilisateur ci-dessous afin d'enregistrer vos informations.</p>
</div>
{% endif %}


<div class="container">
<div class="row background">
Expand All @@ -38,87 +38,117 @@
})
}}

<div class="row">
<div class="col-6">
{{ form_row(form_user.firstname) }}
{{ form_row(form_user.username) }}
</div>
<div class="col-6">
{{ form_row(form_user.lastname) }}
</div>
{{ form_row(form_user.adress) }}
<div class="row">
<div class="col-6">
{{ form_row(form_user.code_postal) }}
{{ form_row(form_user.tel) }}
{{ form_row(form_user.country) }}
</div>
<div class="col-6">
{{ form_row(form_user.email) }}
{{ form_row(form_user.password) }}
</div>

<hr class="my-4">


<!-- Button trigger modal -->
<button type="button" class="buttonpay nav-link" data-bs-toggle="modal" data-bs-target="#exampleModal">
Mes informations de paiements
</button>

<hr class="my-4">

{{ form_row(form_user.save) }}

</div>
{{ form_end(form_user) }}


</form>


<!-- Modal -->
<div class="modale modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">
<div class="text-right"> <i class="fa fa-close close" data-dismiss="modal"></i> </div>
<div class="tabs mt-3">
<ul class="nav nav-tabs" id="myTab" role="tablist">
<li class="nav-item" role="presentation"> <a class="nav-link active" id="cardsBtn" data-toggle="tab" href="#visa" role="tab" aria-controls="visa" aria-selected="true"> <img src="https://i.imgur.com/sB4jftM.png" width="80"> </a> </li>
<li class="nav-item" role="presentation"> <a class="nav-link" id="paypalBtn" data-toggle="tab" href="#paypal" role="tab" aria-controls="paypal" aria-selected="false"> <img src="https://i.imgur.com/yK7EDD1.png" width="80"> </a> </li>
</ul>
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active" id="cardsContent" role="tabpanel" aria-labelledby="visa-tab">
<div class="mt-4 mx-4">
<div class="text-center">
<h5>Credit card</h5>
</div>
<div class="form mt-3">
<div class="inputbox"> <input type="text" name="name" class="form-control" required="required"> <span>Cardholder Name</span> </div>
<div class="inputbox"> <input type="text" name="name" min="1" max="999" class="form-control" required="required"> <span>Card Number</span> <i class="fa fa-eye"></i> </div>
<div class="d-flex flex-row">
<div class="inputbox"> <input type="text" name="name" min="1" max="999" class="form-control" required="required"> <span>Expiration Date</span> </div>
<div class="inputbox"> <input type="text" name="name" min="1" max="999" class="form-control" required="required"> <span>CVV</span> </div>
</div>
<div class="px-5 pay"> <button class="btn btn-success btn-block">Add card</button> </div>
</div>
</div>
</div>
<div class="tab-pane fade show" id="paypalContent" role="tabpanel" aria-labelledby="paypal">
<div class="px-5 mt-5">
<div class="inputbox"> <input type="text" name="name" class="form-control" required="required"> <span>Paypal Email Address</span> </div>
<div class="pay px-5"> <button class="btn btn-primary btn-block">Add paypal</button> </div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

</main>

{% endblock %}

<div class="row">
<div class="col-6">
{{ form_row(form_user.firstname) }}
{{ form_row(form_user.username) }}
</div>
<div class="col-6">
{{ form_row(form_user.lastname) }}
</div>
{{ form_row(form_user.adress) }}
<div class="row">
<div class="col-6">
{{ form_row(form_user.code_postal) }}
{{ form_row(form_user.tel) }}
{{ form_row(form_user.country) }}
</div>
<div class="col-6">
{{ form_row(form_user.email) }}
{{ form_row(form_user.password) }}
</div>

<hr
class="my-4">


<!-- Button trigger modal -->
<button type="button" class="buttonpay nav-link" data-bs-toggle="modal" data-bs-target="#exampleModal">
Mes informations de paiements
</button>

<hr class="my-4">

{{ form_row(form_user.save) }}

</div>
{{ form_end(form_user) }}


</form>


<!-- Modal -->
<div class="modale modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">
<div class="text-right">
<i class="fa fa-close close" data-dismiss="modal"></i>
</div>
<div class="tabs mt-3">
<ul class="nav nav-tabs" id="myTab" role="tablist">
<li class="nav-item" role="presentation">
<a class="nav-link active" id="cardsBtn" data-toggle="tab" href="#visa" role="tab" aria-controls="visa" aria-selected="true">
<img src="/assets/img/cb.png" width="80">
</a>
</li>
<li class="nav-item" role="presentation">
<a class="nav-link" id="paypalBtn" data-toggle="tab" href="#paypal" role="tab" aria-controls="paypal" aria-selected="false">
<img src="/assets/img/paypal.png" width="80">
</a>
</li>
</ul>
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active" id="cardsContent" role="tabpanel" aria-labelledby="visa-tab">
<div class="mt-4 mx-4">
<div class="text-center">
<h5>Credit card</h5>
</div>
<div class="form mt-3">
<div class="inputbox">
<input type="text" name="name" class="form-control" required="required">
<span>Cardholder Name</span>
</div>
<div class="inputbox">
<input type="text" name="name" min="1" max="999" class="form-control" required="required">
<span>Card Number</span>
<i class="fa fa-eye"></i>
</div>
<div class="d-flex flex-row">
<div class="inputbox">
<input type="text" name="name" min="1" max="999" class="form-control" required="required">
<span>Expiration Date</span>
</div>
<div class="inputbox">
<input type="text" name="name" min="1" max="999" class="form-control" required="required">
<span>CVV</span>
</div>
</div>
<div class="px-5 pay">
<button class="btn btn-success btn-block">Add card</button>
</div>
</div>
</div>
</div>
<div class="tab-pane fade show" id="paypalContent" role="tabpanel" aria-labelledby="paypal">
<div class="px-5 mt-5">
<div class="inputbox">
<input type="text" name="name" class="form-control" required="required">
<span>Paypal Email Address</span>
</div>
<div class="pay px-5">
<button class="btn btn-primary btn-block">Add paypal</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

</main>

{% endblock %}

0 comments on commit d4a492f

Please sign in to comment.