Update placeOnline.gtpl
This commit is contained in:
s441433
parent
1c21f892b1
commit
3dd89fa6de
217
placeOnline.gtpl
217
placeOnline.gtpl
@ -1,111 +1,186 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="pl">
|
||||
<head>
|
||||
<center><img src="http://www.bronowicka.zs4.lublin.eu/wp-content/uploads/cutlery-297617_1280.png" width="150" height="100"/></center>
|
||||
<title>Płatnościline</title>
|
||||
<title>Stołówka ZPM Płatności Online</title>
|
||||
<h5><p style="text-align: right;">Zalogowano jako {{.UserView}} <button class="button button4"><a href="wylogowano" target="self">WYLOGUJ</a></button></p></h5>
|
||||
<link rel="shortcut icon" href="http://www.bronowicka.zs4.lublin.eu/wp-content/uploads/cutlery-297617_1280.png" />
|
||||
|
||||
<center><img src="http://www.bronowicka.zs4.lublin.eu/wp-content/uploads/cutlery-297617_1280.png" width="150" height="100"/></center>
|
||||
<style>
|
||||
body {
|
||||
font-family: Arial;
|
||||
font-size: 17px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.row {
|
||||
display: -ms-flexbox; /* IE10 */
|
||||
display: flex;
|
||||
-ms-flex-wrap: wrap; /* IE10 */
|
||||
flex-wrap: wrap;
|
||||
margin: 0 -16px;
|
||||
}
|
||||
|
||||
.col-25 {
|
||||
-ms-flex: 25%; /* IE10 */
|
||||
flex: 25%;
|
||||
}
|
||||
|
||||
.col-50 {
|
||||
-ms-flex: 50%; /* IE10 */
|
||||
flex: 50%;
|
||||
}
|
||||
|
||||
.col-75 {
|
||||
-ms-flex: 75%; /* IE10 */
|
||||
flex: 75%;
|
||||
}
|
||||
|
||||
.col-25,
|
||||
.col-50,
|
||||
.col-75 {
|
||||
padding: 0 16px;
|
||||
}
|
||||
|
||||
.container {
|
||||
background-color: #f2f2f2;
|
||||
padding: 5px 20px 15px 20px;
|
||||
border: 1px solid lightgrey;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
input[type=text] {
|
||||
width: 100%;
|
||||
margin-bottom: 20px;
|
||||
padding: 12px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
label {
|
||||
margin-bottom: 10px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.icon-container {
|
||||
margin-bottom: 20px;
|
||||
padding: 7px 0;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.btn {
|
||||
background-color: #4CAF50;
|
||||
color: white;
|
||||
padding: 12px;
|
||||
margin: 10px 0;
|
||||
border: none;
|
||||
width: 100%;
|
||||
border-radius: 3px;
|
||||
cursor: pointer;
|
||||
font-size: 17px;
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
background-color: #45a049;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #2196F3;
|
||||
}
|
||||
|
||||
hr {
|
||||
border: 1px solid lightgrey;
|
||||
}
|
||||
|
||||
span.price {
|
||||
float: right;
|
||||
color: grey;
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
.row {
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
.col-25 {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1><center>{{.UserView}}, poniżej suma niezapłaconych biletów.</center></h1>
|
||||
<br>
|
||||
<h4><b><p style="text-indent: 2%;"><a href="http://localhost:9197/panel">Cofnij do głównego MENU panelu użytkownika</a></p></b></h4>
|
||||
<br>
|
||||
<form action="/platnosci" method="POST">
|
||||
<style> td { border: 1px solid black; } </style>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<h2><td style="width: 15em; height: 2em" align="center"><b>Suma kosztów za bilety: {{.Zaplac}}</b></td></h2>
|
||||
</tr>
|
||||
<tr>
|
||||
<h3><b><p style="text-indent: 2%;"><a href="http://localhost:9197/platnosci/placeOnline">Zapłać online</a></p></b></h3>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</form>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
<h2>Responsive Checkout Form</h2>
|
||||
<p>Resize the browser window to see the effect. When the screen is less than 800px wide, make the two columns stack on top of each other instead of next to each other.</p>
|
||||
<div class="row">
|
||||
<div class="col-75">
|
||||
<div class="container">
|
||||
<form action="/action_page.php">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-50">
|
||||
<h3>Billing Address</h3>
|
||||
<label for="fname"><i class="fa fa-user"></i> Full Name</label>
|
||||
<input type="text" id="fname" name="firstname" placeholder="John M. Doe">
|
||||
<label for="email"><i class="fa fa-envelope"></i> Email</label>
|
||||
<input type="text" id="email" name="email" placeholder="john@example.com">
|
||||
<label for="adr"><i class="fa fa-address-card-o"></i> Address</label>
|
||||
<input type="text" id="adr" name="address" placeholder="542 W. 15th Street">
|
||||
<label for="city"><i class="fa fa-institution"></i> City</label>
|
||||
<input type="text" id="city" name="city" placeholder="New York">
|
||||
<h1><center>Formularz do płatności online</center></h1>
|
||||
<h4><b><p style="text-indent: 2%;"><a href="http://localhost:9197/platnosci">Anuluj</a></p></b></h4>
|
||||
<div class="row">
|
||||
<div class="col-75">
|
||||
<div class="container">
|
||||
<form action="/placeOnline" method="POST">
|
||||
<div class="row">
|
||||
<div class="col-50">
|
||||
<h3>Adres rozliczeniowy</h3>
|
||||
<label for="fname"><i class="fa fa-user"></i> Imie</label>
|
||||
<input type="text" id="fname" name="firstname" placeholder="Krystian Kłopocki">
|
||||
<label for="email"><i class="fa fa-envelope"></i> E-mail</label>
|
||||
<input type="text" id="email" name="email" placeholder="kryklo@st.amu.edu.pl">
|
||||
<label for="adr"><i class="fa fa-address-card-o"></i> Addres</label>
|
||||
<input type="text" id="adr" name="address" placeholder="os. Zielony Zakątek 73/1">
|
||||
<label for="city"><i class="fa fa-institution"></i> Miasto</label>
|
||||
<input type="text" id="city" name="city" placeholder="Poznań">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-50">
|
||||
<label for="state">State</label>
|
||||
<input type="text" id="state" name="state" placeholder="NY">
|
||||
<label for="state">Poczta (miasto)</label>
|
||||
<input type="text" id="state" name="state" placeholder="Poznań">
|
||||
</div>
|
||||
<div class="col-50">
|
||||
<label for="zip">Zip</label>
|
||||
<input type="text" id="zip" name="zip" placeholder="10001">
|
||||
<label for="zip">Kod pocztowy</label>
|
||||
<input type="text" id="zip" name="zip" placeholder="60-107">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-50">
|
||||
<h3>Payment</h3>
|
||||
<label for="fname">Accepted Cards</label>
|
||||
<h3>Zapłata</h3>
|
||||
<label for="fname">Akceptowane karty</label>
|
||||
<div class="icon-container">
|
||||
<i class="fa fa-cc-visa" style="color:navy;"></i>
|
||||
<i class="fa fa-cc-amex" style="color:blue;"></i>
|
||||
<i class="fa fa-cc-mastercard" style="color:red;"></i>
|
||||
<i class="fa fa-cc-discover" style="color:orange;"></i>
|
||||
</div>
|
||||
<label for="cname">Name on Card</label>
|
||||
<input type="text" id="cname" name="cardname" placeholder="John More Doe">
|
||||
<label for="ccnum">Credit card number</label>
|
||||
<label for="cname">Imię na karcie</label>
|
||||
<input type="text" id="cname" name="cardname" placeholder="Krystian Kłopocki">
|
||||
<label for="ccnum">Numer karty kredytowej</label>
|
||||
<input type="text" id="ccnum" name="cardnumber" placeholder="1111-2222-3333-4444">
|
||||
<label for="expmonth">Exp Month</label>
|
||||
<input type="text" id="expmonth" name="expmonth" placeholder="September">
|
||||
<label for="expmonth">Miesiąc ważności</label>
|
||||
<input type="text" id="expmonth" name="expmonth" placeholder="Maj">
|
||||
<div class="row">
|
||||
<div class="col-50">
|
||||
<label for="expyear">Exp Year</label>
|
||||
<input type="text" id="expyear" name="expyear" placeholder="2018">
|
||||
<label for="expyear">Rok ważności</label>
|
||||
<input type="text" id="expyear" name="expyear" placeholder="2021">
|
||||
</div>
|
||||
<div class="col-50">
|
||||
<label for="cvv">CVV</label>
|
||||
<input type="text" id="cvv" name="cvv" placeholder="352">
|
||||
<input type="text" id="cvv" name="cvv" placeholder="469">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<label>
|
||||
<input type="checkbox" checked="checked" name="sameadr"> Shipping address same as billing
|
||||
<input type="checkbox" checked="checked" name="sameadr"> Adres do faktury taki sam jak powyżej
|
||||
</label>
|
||||
<input type="submit" value="Continue to checkout" class="btn">
|
||||
<input type="submit" name="place" value="Kontynuuj płacenie" class="btn">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-25">
|
||||
<div class="container">
|
||||
<h4>Cart <span class="price" style="color:black"><i class="fa fa-shopping-cart"></i> <b>4</b></span></h4>
|
||||
<p><a href="#">Product 1</a> <span class="price">$15</span></p>
|
||||
<p><a href="#">Product 2</a> <span class="price">$5</span></p>
|
||||
<p><a href="#">Product 3</a> <span class="price">$8</span></p>
|
||||
<p><a href="#">Product 4</a> <span class="price">$2</span></p>
|
||||
<hr>
|
||||
<p>Total <span class="price" style="color:black"><b>$30</b></span></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-25">
|
||||
<div class="container">
|
||||
<p>Całkowity koszt <span class="price" style="color:black"><b>{{.Zaplac}} zł</b></span></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
Loading…
Reference in New Issue
Block a user