alps theme: add event page layout

This commit is contained in:
Drew DeVault 2020-05-20 13:40:54 -04:00 committed by Simon Ser
parent 7fb2b65eaa
commit a892251387
No known key found for this signature in database
GPG key ID: 0FDE7BE0E88F5E48
3 changed files with 92 additions and 12 deletions

View file

@ -85,6 +85,9 @@ input[type="text"],
input[type="email"], input[type="email"],
input[type="password"], input[type="password"],
input[type="file"], input[type="file"],
input[type="number"],
input[type="date"],
input[type="time"],
textarea { textarea {
margin: 0; margin: 0;
border: none; border: none;
@ -188,13 +191,17 @@ main table td a { text-decoration: none; }
main table td a:hover { text-decoration: underline; } main table td a:hover { text-decoration: underline; }
main.message table { background-color: white; } main.message table,
main.message th { width: 5%;} main.event table { background-color: white; }
main.message h1 { font-size: 1.2rem; padding: 0.5rem;} main.message th,
main.event th { width: 5%;}
main.message h1,
main.event h1 { font-size: 1.2rem; padding: 0.5rem;}
main.message pre, main.message pre,
main.message iframe, main.message iframe,
main.contact .details { main.contact .details,
main.event pre {
flex: 1 auto; flex: 1 auto;
padding: 1rem; padding: 1rem;
margin: 0.3rem 0 0 0; margin: 0.3rem 0 0 0;
@ -203,7 +210,8 @@ main.contact .details {
max-width: 100%; max-width: 100%;
} }
main.message pre { main.message pre,
main.event pre {
white-space: pre-wrap; white-space: pre-wrap;
word-break: break-all; word-break: break-all;
} }
@ -250,6 +258,18 @@ main.create-update .actions > *:not(:last-child) {
margin-right: 1rem; margin-right: 1rem;
} }
main.create-update .event-date {
display: flex;
flex-direction: row;
align-items: center;
}
main.create-update .event-date input {
width: inherit;
flex-grow: 1;
margin-left: 0.3rem;
}
.actions h3 { .actions h3 {
align-self: center; align-self: center;
margin: 0 1.3rem 0 1rem; margin: 0 1.3rem 0 1rem;

59
themes/alps/event.html Normal file
View file

@ -0,0 +1,59 @@
{{template "head.html" .}}
{{template "nav.html" .}}
<div class="page-wrap">
<aside>
<a href="/calendar/create" class="new">New event</a>
<!-- TODO: fetch list of address books -->
<a href="#" class="active">{{.Calendar.Name}}</a>
<a href="#">Personal</a>
</aside>
<div class="container">
<main class="event">
<section class="actions">
<div class="actions-wrap">
<div class="actions-message">
<div class="action-group">
<a href="/calendar" class="button-link">« Back</a>
</div>
<div class="action-group">
<a href="{{.Event.URL}}/update" class="button-link">Edit</a>
</div>
<form
class="action-group"
action="{{.Event.URL}}/delete"
method="post"
>
<input type="submit" value="Delete">
</form>
<!-- TODO: Invite attendees -->
</div>
</div>
</section>
<section class="details">
{{$event := index .Event.Data.Events 0}}
<table>
<tr>
<th colspan="2">
<h1>{{$event.Props.Text "SUMMARY"}}</h1>
</th>
</tr>
<tr>
<th>Start date:</th>
<td>{{$event.DateTimeStart nil | formatdate}}</td>
</tr>
<tr>
<th>End date:</th>
<td>{{$event.DateTimeEnd nil | formatdate}}</td>
</tr>
<!-- TODO: List of attendees, room -->
</table>
<pre>{{$event.Props.Text "DESCRIPTION"}}</pre>
</section>
</main>
</div>
</div>
{{template "foot.html"}}

View file

@ -21,15 +21,16 @@
<input type="text" name="summary" id="summary" value="{{.Event.Props.Text "SUMMARY"}}"> <input type="text" name="summary" id="summary" value="{{.Event.Props.Text "SUMMARY"}}">
</label> </label>
<label> <label class="event-date">
<!-- TODO: inputs with time --> <span>Starts at</span>
<span>Start date</span> <input type="date" name="start" id="start" value="{{.Event.DateTimeStart nil | formatinputdate}}"/>
<input type="date" name="start" id="start" value="{{.Event.DateTimeStart nil | ornow | formatinputdate}}"/> <input type="time" name="start-time" id="start-time" value="{{.Event.DateTimeStart nil | formatinputtime}}"/>
</label> </label>
<label> <label class="event-date">
<span>End date</span> <span>Ends at</span>
<input type="date" name="end" id="end" value="{{.Event.DateTimeEnd nil | ornow | formatinputdate}}"/> <input type="date" name="end" id="end" value="{{.Event.DateTimeEnd nil | formatinputdate}}"/>
<input type="time" name="end-time" id="end-time" value="{{.Event.DateTimeEnd nil | formatinputtime}}"/>
</label> </label>
<textarea name="description" id="description">{{.Event.Props.Text "DESCRIPTION"}}</textarea> <textarea name="description" id="description">{{.Event.Props.Text "DESCRIPTION"}}</textarea>