Deuxfleurs/alps
24
1
Fork 0
Code Issues Pull requests 1 Projects Releases Wiki Activity

alps theme: theme the login page

Browse source
This commit is contained in:
Drew DeVault 2020-05-13 14:48:02 -04:00 committed by Simon Ser
parent 5a73ca6ebb
commit 5fee600c6e
No known key found for this signature in database
GPG key ID: 0FDE7BE0E88F5E48
3 changed files with 66 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

46
themes/alps/assets/style.css
View file

@ -127,13 +127,40 @@ aside { flex: 0 0 180px; }
aside a { width: 100%; display: block; padding: 0.4rem 0 0.4rem 0.5rem; } aside a { width: 100%; display: block; padding: 0.4rem 0 0.4rem 0.5rem; }
aside a.active { font-weight: bold; color: black; text-decoration: none; } aside a.active { font-weight: bold; color: black; text-decoration: none; }
aside img { display: block; } aside img { display: block; }
main { flex: 1 100%; display: flex; flex-direction: column; padding: 0.5rem 1rem 0.5rem 0.5rem; min-width: 0; } main {
flex: 1 100%;
display: flex;
flex-direction: column;
padding: 0.5rem 1rem 0.5rem 0.5rem;
min-width: 0;
background-color: #f6f6f6;
}
main.login {
justify-content: center;
}
main.login > section {
align-self: center;
background: white;
min-width: 20rem;
padding: 1rem;
}
aside a.active, aside a.active,
main { background-color: #f6f6f6; } aside a.new.active {
aside a.new.active { color: #008d47; } background-color: #f6f6f6;
}
aside a.new.active {
color: #008d47;
}
aside a.new.active, aside a.new.active,
main.compose { background-color: #f6fff6; } main.compose {
background-color: #f6fff6;
}
main.compose { flex: 1 auto; padding: 1rem; } main.compose { flex: 1 auto; padding: 1rem; }
main.compose form { flex: 1 auto; display: flex; flex-direction: column; } main.compose form { flex: 1 auto; display: flex; flex-direction: column; }
main.compose form label { margin-top: 5px; } main.compose form label { margin-top: 5px; }
@ -316,14 +343,25 @@ main table tfoot {
margin-right: 0.3rem; margin-right: 0.3rem;
} }
.action-group:not(:last-child) {
margin-bottom: 1rem;
}
.actions-wrap .action-group { .actions-wrap .action-group {
margin-left: 0.3rem; margin-left: 0.3rem;
margin-bottom: 0;
} }
.action-group.grow { .action-group.grow {
flex-grow: 1; flex-grow: 1;
} }
.action-group label,
.action-group input {
display: block;
width: 100%;
}
.actions-message, .actions-message,
.actions-contacts { .actions-contacts {
display: flex; display: flex;

43
themes/alps/login.html
View file

@ -1,26 +1,29 @@
{{template "head.html" .}} {{template "head.html" .}}
<h1>alps webmail</h1>
<form method="post" action="/login"> <main class="login">
<p> <section>
<label> <h1>Webmail Login</h1>
<strong>Username</strong>
<br/> <form method="post" action="/login">
<div class="action-group">
<label for="username">
<strong>Username</strong>
</label>
<input type="text" name="username" id="username" autofocus /> <input type="text" name="username" id="username" autofocus />
</label> </div>
</p>
<br/> <div class="action-group">
<p> <label for="password">
<label> <strong>Password</strong>
<strong>Password</strong> </label>
<br/>
<input type="password" name="password" id="password" /> <input type="password" name="password" id="password" />
</label> </div>
</p>
<br/> <div class="action-group">
<p> <button type="submit">Sign in</button>
<button>Sign in</button> </div>
</p> </form>
</form> </section>
</main>
{{template "foot.html"}} {{template "foot.html"}}

2
themes/alps/nav.html
View file

@ -2,7 +2,7 @@
<nav> <nav>
{{$page := (index .GlobalData.Path 0)}} {{$page := (index .GlobalData.Path 0)}}
<a href="/" <a href="/"
{{ if or (eq $page "mailbox") (eq $page "message") }} {{ if or (eq $page "mailbox") (eq $page "message") (eq $page "compose") }}
class="active" class="active"
{{ end }} {{ end }}
>Email</a> >Email</a>