frontend: ui tweaks

Signed-off-by: Ahmet Alp Balkan <ahmetb@google.com>
This commit is contained in:
Ahmet Alp Balkan 2018-06-26 20:55:11 -07:00
parent 22762b28bd
commit 3144c87e21
6 changed files with 14 additions and 12 deletions

View File

@ -126,7 +126,6 @@ func (fe *frontendServer) productHandler(w http.ResponseWriter, r *http.Request)
http.Error(w, fmt.Sprintf("failed to get product recommendations: %+v", err), http.StatusInternalServerError)
return
}
log.Printf("cart size=%d", len(cart))
product := struct {
Item *pb.Product

View File

@ -4,11 +4,13 @@
<main role="main">
<div class="py-5">
<div class="container bg-light py-3 px-lg-5 py-lg-5">
<h1>Shopping Cart</h1>
{{ if eq (len $.items) 0 }}
<p>Your shopping cart is empty.</p>
<a class="btn btn-primary" href="/" role="button">Browse Products</a>
<h3>Your shopping cart is empty!</h3>
<p>Items you add to your shopping cart will appear here.</p>
<a class="btn btn-primary" href="/" role="button">Browse Products &rarr; </a>
{{ else }}
<h3>{{ len $.items }} item {{- if gt (len $.items) 0}}s{{end}}
in your Shopping Cart</h3>
{{ end }}
{{ range $.items }}
@ -39,7 +41,7 @@
<form method="POST" action="/cart/empty">
<button class="btn btn-secondary" type="submit">Empty Cart</button>
</form>
<a class="btn btn-primary" href="/checkout" role="button">Proceed to Checkout</a>
<a class="btn btn-primary" href="/checkout" role="button">Proceed to Checkout &rarr;</a>
</div>
</div>
</div>

View File

@ -1,6 +1,6 @@
{{ define "footer" }}
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script>
<small class="text-muted mx-auto">This is a demo application.</small>
<small class="text-muted mx-auto">This is a demo application. ({{$.session_id}})</small>
</body>
</html>
{{ end }}

View File

@ -23,7 +23,7 @@
<option value="{{.}}" {{if eq . $.user_currency}}selected="selected"{{end}}>{{.}}</option>
{{end}}
</select>
<a class="btn btn-primary ml-2" href="/cart" role="button">View Cart ({{$.cart_size}})</a>
<a class="btn btn-primary btn-light ml-2" href="/cart" role="button">View Cart ({{$.cart_size}})</a>
</form>
</div>
</div>

View File

@ -30,15 +30,16 @@
<div class="input-group-prepend">
<label class="input-group-text" for="quantity">Quantity</label>
</div>
<select name="quantity" id="quantity" class="custom-select">
<select name="quantity" id="quantity" class="custom-select form-control form-control-lg">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>10</option>
</select>
</div>
<button type="submit" class="btn btn-secondary ml-3">Add to Cart</button>
<button type="submit" class="btn btn-info btn-lg ml-3">Add to Cart</button>
</form>
</div>
</div>

View File

@ -1,6 +1,6 @@
{{ define "recommendations" }}
<h5 class="text-muted">Similar products</h5>
<div class="row">
<h5 class="text-muted">Products you might like</h5>
<div class="row mt-2">
{{range . }}
<div class="col-3">
<div class="card mb-3 box-shadow">