flounder

A simple gemini site builder
Log | Files | Refs | README | LICENSE

commit c119411f01c43e7e18898c5a283757e58e4cfe02
parent 464b29be73c7271a4fc587401060345adcdcebb1
Author: alex wennerberg <alex@alexwennerberg.com>
Date:   Tue, 29 Dec 2020 16:56:33 -0800

Frontend improvements, including more mobile friendly

Diffstat:
Mtemplates/login.html | 4++--
Mtemplates/me.html | 2+-
Mtemplates/my_site.html | 2+-
Mtemplates/register.html | 16++++++++--------
Mtemplates/static/style.css | 13+++++++++++--
5 files changed, 23 insertions(+), 14 deletions(-)

diff --git a/templates/login.html b/templates/login.html @@ -3,11 +3,11 @@ <form action="/login" method="post"> <p> <label for="username">Username or Email</label> - <input id="username" name="username" size="32" type="text" value="" /> + <input id="username" name="username" size="27" type="text" value="" /> </p> <p> <label for="password">Password</label> - <input id="password" name="password" size="32" type="password" value="" /> + <input id="password" name="password" size="27" type="password" value="" /> </p> {{ if .Error }} <div class="error"> diff --git a/templates/me.html b/templates/me.html @@ -15,7 +15,7 @@ </div> <div> <label for="email">Email</label><br> - <input id="email" name="email" size="64" type="text" value="{{.Email}}" /> + <input id="email" name="email" size="32" type="text" value="{{.Email}}" /> </div> <div class="error">{{ range .Errors}}{{.}}<br>{{end}} </div> <div> diff --git a/templates/my_site.html b/templates/my_site.html @@ -58,7 +58,7 @@ </table> <h3>Create file by name:</h3> <noscript>Create a new page by going to /edit/[filename]</noscript> -<input id="edit_new" size=32 placeholder="e.g. newfile.gmi or folder/newfile.gmi"> +<input type="text" id="edit_new" size=32 placeholder="e.g. newfile.gmi or folder/newfile.gmi"> <a href="#" id="create_new">Edit new file</a><br> <script> var input = document.getElementById('edit_new') diff --git a/templates/register.html b/templates/register.html @@ -6,25 +6,25 @@ <input id="username" name="username" - size="32" + size="27" type="text" value="" />.{{.Host}} </div> <div> - <label for="email">Email</label> - <input id="email" name="email" size="64" type="text" value="" /> + <label for="email">Email</label> <br> + <input id="email" name="email" size="27" type="text" value="" /> </div> <div> - <label for="password">Password</label> - <input id="password" name="password" size="55" type="password" value="" /> + <label for="password">Password</label> <br> + <input id="password" name="password" size="27" type="password" value="" /> </div> <div> - <label for="password2">Repeat Password</label> - <input id="password2" name="password2" size="55" type="password" value="" /> + <label for="password2">Repeat Password</label> <br> + <input id="password2" name="password2" size="27" type="password" value="" /> </div> <label for="reference">How did you find Flounder? Did an existing user invite you, if so, whom? Could you provide a link to your website or social media?</label> - <textarea id="reference" name="reference" class="textform" cols=4></textarea> + <textarea id="reference" name="reference" class="textform" rows=4></textarea> <div class="error">{{ range .Errors}}{{.}}<br>{{end}} </div> <div> <input diff --git a/templates/static/style.css b/templates/static/style.css @@ -16,11 +16,19 @@ a:visited { body, main { background: #1b262c; color: white; } a { color: #21e6c1 } a:visited { color: #21e6c1 } - input[type="text"], textarea { + input[type="text"], input[type="password"], textarea { color: white; background-color: #121212; } } +@media only screen and (max-width: 600px) { + body { + font-size: 16px + } + input[type="text"], input[type="password"], textarea { + font-size: 1rem; + } +} h1, h2, h3, h4, h5, h6{ margin-top:0; @@ -58,7 +66,6 @@ img { border: 1px solid #999999; margin: 5px 0; padding: 3px; - font-size: .9rem; resize: vertical; } @@ -80,8 +87,10 @@ resize: vertical; padding: 2px 5px; display: inline-block; margin: 0px; + font-size: 1rem; } + .button:hover { background-color: black; color: white;