Tweak some login-related spacing.

This commit is contained in:
Sage Vaillancourt 2022-10-02 09:45:40 -04:00
parent 56327d29e6
commit 234565b923
3 changed files with 31 additions and 24 deletions

View File

@ -119,7 +119,7 @@ select {
div.user { div.user {
line-height: 125%; line-height: 125%;
margin-bottom: 2em; margin-bottom: 1em;
} }
div.user form { div.user form {
@ -303,10 +303,11 @@ textarea {
position: absolute; position: absolute;
background: none; background: none;
border: none; border: none;
font-size: 2rem; font-size: 3rem;
font-weight: bold; font-weight: bold;
color: #444; color: #444;
margin: 0.25em; margin: 0.25em;
line-height: 100%;
top: 0; top: 0;
right: 0; right: 0;
} }
@ -328,7 +329,7 @@ textarea {
} }
input { input {
font-size: 115%; font-size: 115%;
width: 100%; flex-grow: 1;
padding: 0.3em; padding: 0.3em;
} }
.letter-form { .letter-form {
@ -410,6 +411,10 @@ textarea {
opacity: 0; opacity: 0;
} }
#create-account-form {
display: flex;
flex-direction: column;
}
#create-account-form div { #create-account-form div {
display: flex; display: flex;
flex-direction: column; flex-direction: column;

View File

@ -26,7 +26,7 @@
{% macro modal() %} {% macro modal() %}
<div id='modal' class='modal modal-background transparent' onclick="event.target.id === 'modal' && closeModal()"> <div id='modal' class='modal modal-background transparent' onclick="event.target.id === 'modal' && closeModal()">
<div class='modal modal-content'> <div class='modal modal-content'>
<button class='modal-close-button' onclick="closeModal()">X</button> <button class='modal-close-button' onclick="closeModal()">×</button>
<h2 id='modal-title'>Login Now</h2> <h2 id='modal-title'>Login Now</h2>
<form action="/login" method="post" id="create-account-form"> <form action="/login" method="post" id="create-account-form">
<div> <div>
@ -43,25 +43,27 @@
<input id="confirm-password" maxlength="32" minlength="4" name="confirm-password" type="password"> <input id="confirm-password" maxlength="32" minlength="4" name="confirm-password" type="password">
</div> </div>
<a href="javascript:void(0)" <div style="margin-top: 1em;">
id="create-account-form-button" <a href="javascript:void(0)"
class="wipe up-wipe" id="create-account-form-button"
{% if errors %} class="wipe up-wipe"
onclick="/*clearErrors();*/document.getElementById('create-account-form').submit()" {% if errors %}
{% else %} onclick="/*clearErrors();*/document.getElementById('create-account-form').submit()"
onclick="document.getElementById('create-account-form').submit()" {% else %}
{% endif %} onclick="document.getElementById('create-account-form').submit()"
>Create Account</a> {% endif %}
>Create Account</a>
<a href="javascript:void(0)" <a href="javascript:void(0)"
id="log-in-form-button" id="log-in-form-button"
class="wipe up-wipe" class="wipe up-wipe"
{% if errors %} {% if errors %}
onclick="/*clearErrors();*/document.getElementById('create-account-form').submit()" onclick="/*clearErrors();*/document.getElementById('create-account-form').submit()"
{% else %} {% else %}
onclick="document.getElementById('create-account-form').submit()" onclick="document.getElementById('create-account-form').submit()"
{% endif %} {% endif %}
>Log in</a> >Log in</a>
</div>
</form> </form>
</div> </div>
</div> </div>

View File

@ -43,8 +43,8 @@
{% else %} {% else %}
<div class="user logged-out"> <div class="user logged-out">
<form action="/create_account"> <form action="/create_account">
<div class="black-white-button" style="margin-right: 1em; padding: 0.4em;" onclick="showModal(false, 'Create your account')">Create account</div> <div class="black-white-button" style="margin-right: 1em; padding: 0.4em 1em;" onclick="showModal(false, 'Create your account')">Create account</div>
<div class="white-black-button" style="margin: 0; padding: 0.4em;" onclick="showModal(true, 'Login now')">Log in</div> <div class="white-black-button" style="margin: 0; padding: 0.4em 1em;" onclick="showModal(true, 'Login now')">Log in</div>
</form> </form>
</div> </div>
{% endif %} {% endif %}