Skip to content
Snippets Groups Projects
Commit 92848538 authored by gbe's avatar gbe
Browse files

Unify things a bit

parent b69e3c11
No related branches found
No related tags found
No related merge requests found
.pure-g > div {
box-sizing: border-box;
/* box-sizing: border-box; */
}
div.box {
......@@ -10,6 +10,10 @@ div.pad-bottom {
padding-bottom: 0.2em;
}
div.pad-right {
padding-right: 1em;
}
.button-warning {
color: white;
border-radius: 4px;
......@@ -30,12 +34,11 @@ th.fill, td.fill {
div.content {
position: absolute;
top: 0;
bottom: 8em;
overflow: auto;
padding-left: 1em;
padding-right: 1em;
padding-top: 1em;
bottom: 8em;
}
footer {
......@@ -47,9 +50,14 @@ footer {
box-sizing: border-box;
border-top: 1px solid #cbcbcb;
}
padding-left: 1em;
padding-right: 1em;
div.smallfooter {
bottom: 4.5em;
}
footer.small {
height: 4.5em;
}
input.rating {
......@@ -80,10 +88,6 @@ input.name {
opacity: 0;
}
div.pad-right {
padding-right: 1em;
}
button.round {
border-radius: 100%;
height: 3em;
......@@ -99,7 +103,7 @@ div.centered {
display: flex;
}
.maxwidth {
max-width: 70em;
img.foto {
margin: auto;
max-width: 40%;
}
\ No newline at end of file
......@@ -3,32 +3,40 @@
{{ define "title" }}Details for {{ .Wine.Name }}{{ end }}
{{ define "content" }}
<div class="content pure-u-1">
{{ with .Wine }}
<form class="pure-form" method="POST">
<input type="hidden" name="id" value="{{ .ID }}">
<div class="pure-control-group">
<table class="pure-table">
<tr><td>ID</td><td>{{ .ID }}</td></tr>
<tr><td>Name</td><td><input type="text" name="name" value="{{ .Name }}" placeholder="Name"></td></tr>
<tr><td>Rating</td><td><input type="number" name="rating" value="{{ .Rating }}" placeholder="Rating"></td></tr>
</table>
</div>
<form class="pure-form pure-form-aligned" method="POST">
<div class="content smallfooter pure-u-1">
<div class="box">
<input type="hidden" name="id" value="{{ .Wine.ID }}">
<fieldset>
<div class="pure-control-group">
<label for="form-id">ID</label>
<input type="text" id="form-id" value="{{ .Wine.ID }}" disabled>
</div>
<button type="submit" class="pure-button pure-button-primary">Save</button>
</form>
<div class="pure-control-group">
<label for="form-name">Name</label>
<input id="form-name" type="text" name="name" value="{{ .Wine.Name }}" placeholder="Name">
</div>
<p>And here's a picture:<br/>
<div class="pure-control-group">
<label for="form-rating">Rating</label>
<input id="form-rating" type="number" name="rating" value="{{ .Wine.Rating }}" placeholder="Rating">
</div>
</fieldset>
<img class="pure-img" src="/details/img?id={{ .ID }}"/>
</div>
<p>And here's a picture:<br/>
<footer class="box pure-u-1">
<form class="pure-form" method="POST" action="/delete">
<input type="hidden" name="id" value="{{ .ID }}">
<button type="submit" class="right pure-button button-warning">Delete</button>
</form>
</footer>
{{ end }}
<img class="foto pure-img" src="/details/img?id={{ .Wine.ID }}"/>
</div>
</div>
<footer class="small pure-u-1">
<div class="box">
<!-- TODO: give these buttons values so that the Go code can decide what to do -->
<button type="submit" class="pure-button pure-button-primary">Save Changes</button>
<button type="submit" class="right pure-button button-warning">Delete</button>
</div>
</footer>
</form>
{{ end }}
\ No newline at end of file
......@@ -4,44 +4,48 @@
{{ define "content" }}
<div class="content pure-u-1">
<table class="maxwidth box pure-table">
<thead><tr><th>#</th><th>Rating</th><th class="fill">Name</th></tr></thead>
<tbody>
{{ range .Wines }}
<tr>
<td>{{ .ID }}</td>
<td>{{ .Rating }}</td>
<td><a href="/details?id={{ .ID }}">{{ .Name }}</a></td>
</tr>
{{ end }}
</tbody>
</table>
<div class="box">
<table class="pure-table">
<thead><tr><th>#</th><th>Rating</th><th class="fill">Name</th></tr></thead>
<tbody>
{{ range .Wines }}
<tr>
<td>{{ .ID }}</td>
<td>{{ .Rating }}</td>
<td><a href="/details?id={{ .ID }}">{{ .Name }}</a></td>
</tr>
{{ end }}
</tbody>
</table>
</div>
</div>
<footer class="box pure-u-1">
<form class="maxwidth pure-form" method="POST" enctype="multipart/form-data" action="/add">
<fieldset>
<div class="pure-g">
<div class="pad-right pure-u-3-4">
<div class="pad-bottom">
<input class="name" type="text" name="name" placeholder="Name" required>
<footer class="pure-u-1">
<div class="box">
<form class="pure-form" method="POST" enctype="multipart/form-data" action="/add">
<fieldset>
<div class="pure-g">
<div class="pure-u-3-4">
<div class="pad-bottom pad-right">
<input class="name" type="text" name="name" placeholder="Name" required>
</div>
<div class="upload-btn-wrapper">
<button class="pure-button">Select Picture</button>
<input type="file" name="picture" accept="image/png, image/jpeg">
</div>
</div>
<div class="upload-btn-wrapper">
<button class="pure-button">Select Picture</button>
<input type="file" name="picture" accept="image/png, image/jpeg">
</div>
</div>
<div class="pure-u-1-4">
<div class="pad-bottom">
<input class="rating" type="number" name="rating" placeholder="Rating">
</div>
<div class="centered">
<button type="submit" class="round pure-button pure-button-primary">+</button>
<div class="pure-u-1-4">
<div class="pad-bottom">
<input class="rating" type="number" name="rating" placeholder="Rating">
</div>
<div class="centered">
<button type="submit" class="round pure-button pure-button-primary">+</button>
</div>
</div>
</div>
</table>
</fieldset>
</form>
</table>
</fieldset>
</form>
</div>
</footer>
{{ end }}
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment