Source

POS Front End Updated UI / build / web / checkOut.html

Full commit
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
    <head>
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <title id="systemName">Mobile POS</title>
        <link href="css/bootstrap.css" rel="stylesheet">
    </head>
    <body>
        <div class="navbar-inner ">
            <div class="container">
                <div class="navbar ">
                    <!-- HOME BTN -->
                    <a class="btn btn-info pull-left" href="product.html" style="display: inline-block">
                        <i class="icon-arrow-left"></i>Products </a>
                    <a class="brand" style="margin-left: 250px">&nbsp;&nbsp; Checkout </a>

                </div>
            </div>
        </div>

        <div class="container-fluid">


            <!--order summary -->
            <div class="span3">
                <legend>Order Summary</legend>
                <div class="row">
                    <div class="col span1">
                        <img class="img-rounded" src="http://www.placehold.it/60x60">
                    </div>
                    <div class="col span2">
                        Product Name 
                        </br>Price: $165
                        </br>Quantity: 
                    </div>
                </div>
                <br/>
                <div class="row">
                    <div class="col span1">
                        <img class="img-rounded" src="http://www.placehold.it/60x60">
                    </div>
                    <div class="col span2">
                        Product Name 
                        </br>Price: $165
                        </br>Quantity: 
                    </div>
                </div>
                <br/>
                <div class="row">
                    <b class="pull-right">Total $500</b>
                </div>
            </div>

            <!--payment information request-->
            <div class="span9">
                <br/>

                <!--Payment detail form -->
                <div class="row well" style="margin-left: 10px"> 
                    <form class="form-horizontal2 ">
                        <legend> Payment detail </legend>
                        <div class="control-group">
                            <label class="control-label" for="inputCC">Credit Card No. </label>
                            <div class="controls">
                                <input type="text" id="inputCC" placeholder="Credit Card Number">
                            </div>
                        </div>
                        <div class="control-group">
                            <label class="control-label" for="inputCW2">CW2/CV2</label>
                            <div class="controls">
                                <input type="text" id="inputCW2" placeholder="CW2/CV2">
                            </div>
                        </div>
                        <div class="control-group">
                            <label class="control-label" for="inputExpiryDate">Expiry Date</label>
                            <div class="controls">
                                <input type="text" id="inputExpiryDate" placeholder="Credit Card Expiry Date (MMYY)">
                            </div>
                        </div>
                    </form>

                    <button class="btn offset1  btn-info pull-right" id="btnFinish" type="button">Submit payment detail <i class="icon-arrow-right"></i></button>

                </div>

            </div>

        </div>

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
        <script src="js/bootstrap.min.js"></script>

        <script>
            $('#btnFinish').click(function() 
            {
               window.location.href = "checkOutStep2.html"; 
            });
        </script>
    </body>
</html>