Style adjustments for forms.

This commit is contained in:
Fredrik Jonsson 2023-03-27 11:36:05 +02:00
commit 4ec8920b90
2 changed files with 10 additions and 6 deletions

View file

@ -11,7 +11,7 @@ body {
}
.footer {
border-top: 2px solid var(--color-brand);
border-top: 2px solid var(--color-border);
}
// Apply smaller text to blocks, footer etc.
@ -202,11 +202,6 @@ figure {
// Search
.search-input {
// Add vertical rhythm margins.
@include margin-block(1);
}
.search-text {
font-size: var(--fs-l);
max-width: 80%;

View file

@ -18,6 +18,7 @@ select {
@include margin-bottom(.75);
}
// Mark field as required if needed.
label {
&:has(+ :required) {
&::after {
@ -44,9 +45,17 @@ textarea {
width: Min(30em, 100%);
}
// For forms with multibple fields show submit button below the form.
input:not(:only-of-type),
textarea {
& + [type='submit'] {
display: block;
}
}
// For forms with single field add space between it and the submit button.
input:only-of-type {
&:has(+ [type='submit']) {
margin-right: .5rem;
}
}