added options to card details

This commit is contained in:
Arvind Tiwari 2017-08-30 19:35:23 +05:30
parent 5105b4583e
commit f45ec16091
4 changed files with 48 additions and 5 deletions

View file

@ -246,7 +246,8 @@
.settings-container h4 {
margin-bottom: 15px;
color: #999;
color: #333;
font-size: 14px;
}
.settings-container .card-expiry-element,
@ -287,4 +288,25 @@
.btn-wide {
min-width: 120px;
}
.caps_link {
font-weight: 600;
color: #8da4c0;
fill: #8da4c0;
padding: 6px 0;
display: block;
}
.caps_link:hover {
color: #627388;
fill: #627388;
text-decoration: none;
}
.settings-container .credit-card-details-opt {
padding-top: 15px;
}
.caps_link .un-icon {
margin-right: 5px;
}

View file

@ -568,6 +568,7 @@ a.unlink:hover {
border: 1px solid #a1a1a1;
border-radius: 3px;
padding: 5px;
margin-bottom: 15px;
}
.card-warning-error {
border: 1px solid #EB4D5C;
@ -725,12 +726,12 @@ a.unlink:hover {
@media (min-width: 768px) {
.dcl-billing {
padding-right: 50px;
padding-right: 65px;
border-right: 1px solid #eee;
}
.dcl-creditcard {
padding-left: 50px;
padding-left: 65px;
}
.tbl-tot {

View file

@ -0,0 +1,7 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Svg Vector Icons : http://www.onlinewebfonts.com/icon -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1000 1000" enable-background="new 0 0 1000 1000" xml:space="preserve">
<metadata> Svg Vector Icons : http://www.onlinewebfonts.com/icon </metadata>
<g><path d="M185,150h630c19.3,0,35-15.7,35-35s-15.7-35-35-35H605c0-38.7-31.3-70-70-70h-70c-38.7,0-70,31.3-70,70H185c-19.3,0-35,15.7-35,35S165.7,150,185,150z"/><path d="M885,220h-69.9c-0.1,0-0.3,0-0.4,0H395.1c0,0-0.1,0-0.1,0H185.3c-0.1,0-0.2,0-0.3,0h-70c-19.3,0-35,15.7-35,35c0,19.3,15.7,35,35,35h39.9l100.5,670.2C258,977.3,272.7,990,290,990h139.9c0,0,0,0,0,0c0,0,0,0,0,0h140c0,0,0,0,0,0c0,0,0,0,0,0H710c17.3,0,32-12.7,34.6-29.8L845.1,290H885c19.3,0,35-15.7,35-35C920,235.7,904.3,220,885,220z M463.3,920l-31.5-630h136.4l-31.5,630H463.3z M225.6,290h136.1l31.5,630h-73.1L225.6,290z M679.9,920h-73.1l31.5-630h136.1L679.9,920z"/></g>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View file

@ -27,14 +27,27 @@
<hr>
<div>
<div>
{% if credit_card_data.last4 %}
{% if not credit_card_data.last4 %}
<div class="credit-card-details">
<h5 class="billing-head">{% trans "Credit Card" %}</h5>
<h5 class="membership-lead">{% trans "Last" %} 4: *****{{credit_card_data.last4}}</h5>
<h5 class="membership-lead">{% trans "Type" %}: {{credit_card_data.cc_brand}}</h5>
<div class="credit-card-details-opt">
<div class="row">
<div class="col-xs-6">
<a class="caps_link" href=""><img src="{% static 'hosting/img/delete.svg' %}" class="un-icon">REMOVE CARD</a>
</div>
<div class="col-xs-6 text-right">
<a class="btn btn-sm btn-vm-contact" href="">{% trans "EDIT CARD" %}</a>
</div>
</div>
</div>
</div>
{% else %}
<h4>{% trans "Add a new Card." %}</h4>
<h4>
{% trans "Add a new Card." %}<br>
{% trans "We are using Stripe for payment and store your information in our database." %}
</h4>
<form action="" id="payment-form-new" class="credit-card-form" method="POST">
<input type="hidden" name="token"/>
<div class="credit-card-goup">