wbrawner/twigs
1
0
Fork 0
Code Issues Pull requests 2 Projects Releases Packages 1 Wiki Activity Actions

Fix some styling issues for forms
All checks were successful
Pull request workflow / Build and Test (pull_request) Successful in 3m34s
Details
Publish Docker image / Push Docker image to Forgejo Packages (push) Successful in 1h16m22s
Details

Browse source
This commit is contained in:
William Brawner 2024-07-07 10:54:49 -06:00
parent 5aef4630a6
commit 3434bf099c
Signed by: wbrawner
GPG key ID: 8FF12381C6C90D35
4 changed files with 68 additions and 49 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
web/src/main/resources/static/style.css
View file

@ -1,4 +1,5 @@
* { * {
box-sizing: border-box;
transition: 0.25s ease; transition: 0.25s ease;
} }
@ -129,6 +130,7 @@ header.row {
font-weight: bold; font-weight: bold;
padding: var(--input-padding); padding: var(--input-padding);
text-decoration: none; text-decoration: none;
text-align: center;
} }
.flex-full-width { .flex-full-width {
@ -261,11 +263,22 @@ a {
} }
@media all and (max-width: 400px) { @media all and (max-width: 400px) {
button { .button {
width: 100%; width: 100%;
} }
.center {
padding: 10px;
}
.flex-full-width { .flex-full-width {
flex-direction: column; flex-direction: column;
padding: 5px;
width: 100%;
}
.flex-full-width .button {
flex-direction: column;
margin: 5px;
} }
} }

28
web/src/main/resources/templates/budget-form.mustache
View file

@ -1,17 +1,19 @@
{{> partials/head }} {{> partials/head }}
<div id="app"> <div id="app">
<h1>{{title}}</h1> <main>
<div class="center"> <h1>{{title}}</h1>
{{#error }} <div class="center">
<p class="error">{{error}}</p> {{#error }}
{{/error}} <p class="error">{{error}}</p>
<form method="post"> {{/error}}
<label for="name">Name</label> <form method="post">
<input id="name" type="text" name="name" value="{{ budget.name }}"/> <label for="name">Name</label>
<label for="description">Description</label> <input id="name" type="text" name="name" value="{{ budget.name }}"/>
<textarea id="description" name="description">{{ budget.description }}</textarea> <label for="description">Description</label>
<input id="submit" type="submit" class="button button-primary" value="Save"/> <textarea id="description" name="description">{{ budget.description }}</textarea>
</form> <input id="submit" type="submit" class="button button-primary" value="Save"/>
</div> </form>
</div>
</main>
</div> </div>
{{>partials/foot}} {{>partials/foot}}

34
web/src/main/resources/templates/login.mustache
View file

@ -1,20 +1,22 @@
{{> partials/head }} {{> partials/head }}
<div id="app"> <div id="app">
<h1>{{title}}</h1> <main>
<div class="center"> <h1>{{title}}</h1>
<div class="logo"></div> <div class="center">
{{#error }} <div class="logo"></div>
<p class="error">{{error}}</p> {{#error }}
{{/error}} <p class="error">{{error}}</p>
<form action="/login" method="post"> {{/error}}
<label for="username">Username</label> <form action="/login" method="post">
<input id="username" type="text" name="username" value="{{ username }}"/> <label for="username">Username</label>
<label for="password">Password</label> <input id="username" type="text" name="username" value="{{ username }}"/>
<input id="password" type="password" name="password"/> <label for="password">Password</label>
<input id="submit" type="submit" class="button button-primary" value="Login"/> <input id="password" type="password" name="password"/>
</form> <input id="submit" type="submit" class="button button-primary" value="Login"/>
<a href="/resetpassword" style="padding: var(--input-padding)">Forgot your password?</a> </form>
<a href="/register" style="padding: var(--input-padding)">Create an account</a> <a href="/resetpassword" style="padding: var(--input-padding)">Forgot your password?</a>
</div> <a href="/register" style="padding: var(--input-padding)">Create an account</a>
</div>
</main>
</div> </div>
{{>partials/foot}} {{>partials/foot}}

40
web/src/main/resources/templates/register.mustache
View file

@ -1,23 +1,25 @@
{{> partials/head }} {{> partials/head }}
<div id="app"> <div id="app">
<h1>{{title}}</h1> <main>
<div class="center"> <h1>{{title}}</h1>
<div class="logo"></div> <div class="center">
{{#error }} <div class="logo"></div>
<p class="error">{{error}}</p> {{#error }}
{{/error}} <p class="error">{{error}}</p>
<form action="/register" method="post"> {{/error}}
<label for="username">Username</label> <form action="/register" method="post">
<input id="username" type="text" name="username" value="{{ username }}"/> <label for="username">Username</label>
<label for="email">Email</label> <input id="username" type="text" name="username" value="{{ username }}"/>
<input id="email" type="email" name="email" value="{{ email }}"/> <label for="email">Email</label>
<label for="password">Password</label> <input id="email" type="email" name="email" value="{{ email }}"/>
<input id="password" type="password" name="password"/> <label for="password">Password</label>
<label for="confirm-password">Confirm Password</label> <input id="password" type="password" name="password"/>
<input id="confirm-password" type="password" name="confirmPassword"/> <label for="confirm-password">Confirm Password</label>
<input type="submit" class="button button-primary" value="Login"/> <input id="confirm-password" type="password" name="confirmPassword"/>
</form> <input type="submit" class="button button-primary" value="Register"/>
<a href="/login" style="padding: var(--input-padding)">Login</a> </form>
</div> <a href="/login" style="padding: var(--input-padding)">Login</a>
</div>
</main>
</div> </div>
{{>partials/foot}} {{>partials/foot}}