tandem
/
numerus
2
0
Fork 0
Code Issues 39 Pull Requests Packages Projects 1 Releases 1 Wiki Activity

Complete the style of the profile dialog

This commit is contained in:
jordi fita mas 2023-01-23 19:35:49 +01:00
parent 22509dd683
commit f9e22c0789
2 changed files with 86 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
web/static/numerus.css
View File

@ -189,6 +189,7 @@ p, h1, h2, h3, h4, h5, h6 {
} }
input[type="submit"], button { input[type="submit"], button {
min-width: 34rem;
background-color: var(--numerus--color--white); background-color: var(--numerus--color--white);
border: 2px solid var(--numerus--color--black); border: 2px solid var(--numerus--color--black);
text-transform: uppercase; text-transform: uppercase;
@ -279,6 +280,52 @@ input[type="text"], input[type="password"], input[type="email"], select {
transition: 0.2s; transition: 0.2s;
} }
fieldset {
border: none;
padding: 2rem 0 0;
margin-top: 3rem;
border-top: 1px solid var(--numerus--color--light-gray);
}
legend {
float: left;
font-style: italic;
margin-bottom: 3rem;
width: 100%;
}
legend + * {
clear: both;
}
fieldset {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.full-width {
gap: 2rem;
}
.full-width legend {
margin-bottom: initial;
}
.full-width .input {
flex: 1;
}
.full-width input {
width: 100%;
}
.dialog-content {
max-width: 120rem;
margin: 0 auto;
}
/* Profile Menu */ /* Profile Menu */
#profilemenu { #profilemenu {

14
web/template/profile.html
View File

@ -1,7 +1,8 @@
{{ define "content" }} {{ define "content" }}
<section class="dialog-content">
<h2>{{(pgettext "User Settings" "title")}}</h2> <h2>{{(pgettext "User Settings" "title")}}</h2>
<form method="POST" action="/profile"> <form method="POST" action="/profile">
<fieldset> <fieldset class="full-width">
<legend>{{( pgettext "User Access Data" "title" )}}</legend> <legend>{{( pgettext "User Access Data" "title" )}}</legend>
<div class="input"> <div class="input">
@ -14,7 +15,7 @@
<label for="email">{{( pgettext "Email" "input" )}}</label> <label for="email">{{( pgettext "Email" "input" )}}</label>
</div> </div>
</fieldset> </fieldset>
<fieldset> <fieldset class="full-width">
<legend>{{( pgettext "Password Change" "title" )}}</legend> <legend>{{( pgettext "Password Change" "title" )}}</legend>
<div class="input"> <div class="input">
@ -28,13 +29,18 @@
</div> </div>
</fieldset> </fieldset>
<label for="language">{{( pgettext "Language" "input" )}}</label> <fieldset>
<select id="language" name="language"> <legend id="language-legend">{{( pgettext "Language" "input" )}}</legend>
<select id="language" name="language" aria-labelledby="language-legend">
<option value="und">{{( pgettext "Automatic" "language option" )}}</option> <option value="und">{{( pgettext "Automatic" "language option" )}}</option>
{{- range $language := .Languages }} {{- range $language := .Languages }}
<option value="{{ .Tag }}" {{ if eq .Tag $.Language }}selected="selected"{{ end }}>{{ .Name }}</option> <option value="{{ .Tag }}" {{ if eq .Tag $.Language }}selected="selected"{{ end }}>{{ .Name }}</option>
{{- end }} {{- end }}
</select> </select>
<button type="submit">{{( pgettext "Save changes" "action" )}}</button> <button type="submit">{{( pgettext "Save changes" "action" )}}</button>
</fieldset>
</form> </form>
</section>
{{- end }} {{- end }}