Commit 9a4859c6 authored by Vasavi Nukarapu's avatar Vasavi Nukarapu

popup

parent 0aa7e711
......@@ -386,26 +386,26 @@
</div>
<div class="row">
<div class="col-md-7">
<div class="content-box">
<div class="content-box payment-padding">
<div class="content-box__header">
Credit Card Payment
</div>
<form class="card-payment zero-padding">
<div class="form-group header-padding">
<div class="col-sm-6">
<div class="col-xs-6">
<label class="card-payment__name creditcard-font">Use Credit Card</label>
</div>
<div class="col-sm-6">
<div class="col-xs-6">
<label class="card-payment__name creditcard-font">Expiration</label>
</div>
</div>
<div class="form-group row-padding active-green">
<div class="col-sm-6">
<div class="col-xs-6">
<label class="card-text"><span><a href="#" class="visa-img">
<img src="img/credit-cards/visa.png" alt="">
</a></span>VISA that ends in 23421</label>
</div>
<div class="col-sm-6">
<div class="col-xs-6">
<label class="card-text">01-01-2017</label>
</div>
</div>
......
......@@ -11,7 +11,6 @@
<link rel="stylesheet" href="css/flags-with-shadow-icon.css">
<link rel="stylesheet" href="css/domain-icons-sprite.css">
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/style.css">
<script src="js/vendor/modernizr-2.8.3.min.js"></script>
</head>
......@@ -386,38 +385,38 @@
</div>
<div class="row">
<div class="col-md-7">
<div class="content-box">
<div class="content-box payment-padding">
<div class="content-box__header">
Credit Card Payment
</div>
<form class="card-payment zero-padding">
<div class="form-group header-padding">
<div class="col-sm-6">
<div class="col-xs-6">
<label class="card-payment__name creditcard-font">Use Credit Card</label>
</div>
<div class="col-sm-6">
<div class="col-xs-6">
<label class="card-payment__name creditcard-font">Expiration</label>
</div>
</div>
<div class="form-group row-padding active-green">
<div class="col-sm-6">
<div class="col-xs-6">
<label class="card-text">
<input type="checkbox" name="checkbox" value="value" class="checkbox"><span><a href="#" class="visa-img">
<img src="img/credit-cards/visa.png" alt="">
</a></span>VISA that ends in 23421</label>
</div>
<div class="col-sm-6">
<div class="col-xs-6">
<label class="card-text">01-01-2017</label>
</div>
</div>
<div class="form-group row-padding">
<div class="col-sm-6">
<div class="col-xs-6">
<label class="card-text">
<input type="checkbox" name="checkbox" value="value" class="checkbox"><span><a href="#" class="visa-img">
<img src="img/credit-cards/mastercard.png" alt="">
</a></span>Master that ends in 3334</label>
</div>
<div class="col-sm-6">
<div class="col-xs-6">
<label class="card-text">01-01-2017</label>
</div>
</div>
......@@ -428,7 +427,7 @@
<input type="submit" value="Save" class="btn-next credit-savebtn">
</div>
<div class="col-xs-12">
<a href="" class="btn-next credit-savebtn">Add New Card</a>
<a href="" class="btn-next credit-savebtn" data-toggle="modal" data-target="#AddCreditModal">Add New Card</a>
</div>
</div>
</div>
......@@ -673,6 +672,79 @@
</div>
</div>
</footer>
<div class="modal fade" id="AddCreditModal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="addcredit-modal">
<div class="row">
<div class="col-md-12 col-sm-12">
<div class="content-box">
<div class="content-box__header">
Add Credit Card
</div>
<form class="card-payment">
<div class="form-group">
<label class="card-payment__name">Name<span class="context-remark">(as appears on your card)</span></label>
<input type="text" id="name" class="form-control">
</div>
<div class="form-group">
<label class="card-payment__name">Card Number</label>
<div class="form-control__checked">
<input type="text" id="account_number" class="form-control icon-field" placeholder="1234 5678 9012 3456">
</div>
</div>
<div class="form-group">
<label class="card-payment__name">Expiration Date</label>
<select name="month" class="default-select select-conner card-payment__select-gap" id="month">
<option value="">01 - January</option>
<option value="">02 - February</option>
<option value="">03 - March</option>
</select>
<select name="year" class="default-select select-conner" id="year">
<option value="">2016</option>
<option value="">2017</option>
<option value="">2018</option>
</select>
</div>
<div class="form-group">
<label class="card-payment__name">Security Code<span class="context-remark">(3 on back, Amex: 4 on front)</span>
</label>
<input type="text" id="cvc" class="form-control cvc-cod-field">
<div class="image">
<img src="img/icons/credit-card_back_side_4.png" alt="">
</div>
<div class="image">
<img src="img/icons/credit-card_back_side_3.png" alt="">
</div>
</div>
<div class="form-group">
<label class="card-payment__name">
Set this card as primary</label>
<select class="default-select select-conner">
<option value="1">Yes</option>
<option value="0">No</option>
</select>
</div>
<div class="form-group creditcard-buttons">
<div class="col-sm-12">
<div class="col-sm-6">
<a class="btn-next credit-cancelbtn" href="#">Cancel</a>
</div>
<div class="col-sm-6">
<input type="submit" value="Save" class="btn-next credit-savebtn">
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- <script src="https://code.jquery.com/jquery-1.12.0.min.js"></script> -->
<script>
window.jQuery || document.write('<script src="app/js/vendor/jquery-1.12.0.min.js"><\/script>')
......
......@@ -386,26 +386,26 @@
</div>
<div class="row">
<div class="col-md-7">
<div class="content-box">
<div class="content-box payment-padding">
<div class="content-box__header">
Credit Card Payment
</div>
<form class="card-payment zero-padding">
<div class="form-group header-padding">
<div class="col-sm-6">
<div class="col-xs-6">
<label class="card-payment__name creditcard-font">Use Credit Card</label>
</div>
<div class="col-sm-6">
<div class="col-xs-6">
<label class="card-payment__name creditcard-font">Expiration</label>
</div>
</div>
<div class="form-group row-padding active-green">
<div class="col-sm-6">
<div class="col-xs-6">
<label class="card-text"><span><a href="#" class="visa-img">
<img src="img/credit-cards/visa.png" alt="">
</a></span>VISA that ends in 23421</label>
</div>
<div class="col-sm-6">
<div class="col-xs-6">
<label class="card-text busy">01-01-2017(expired)</label>
</div>
</div>
......
......@@ -24105,4 +24105,18 @@ background-color: #1b5bd2;
}
a.visa-img:focus, a.visa-img:hover {
text-decoration: none;
}
@media (max-width: 500px){
.payment-padding .header-padding{
padding: 20px 10px;
}
.payment-padding .row-padding{
padding: 20px 15px;
}
.payment-padding .card-text .checkbox {
left: -10px;
}
}
.addcredit-modal .content-box{
margin: 0;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment