0
0
mirror of https://github.com/wagtail/wagtail.git synced 2024-12-01 11:41:20 +01:00
wagtail/client/scss/components/forms/_title.scss
Thibaud Colas eac5e0bc2c Finish re-implementing form styles based on design feedback & code review
Co-authored-by: LB Johnston <mail@lb.ee>
2022-08-05 10:36:52 +02:00

35 lines
925 B
SCSS
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

// Styles for title fields throughout the page.
// The `title` class is meant to be applied by end users throughout different forms APIs.
.w-panel.title,
.w-field.title {
input,
textarea,
.Draftail-Editor .public-DraftEditor-content {
@apply w-h2;
color: $color-input-text;
}
}
// Styles for the title field when at the top of the page.
// Its the first panel when comments are disabled, second if enabled.
.w-panel.title:nth-child(1),
.w-panel.title:nth-child(2) {
.w-panel__header {
@apply w-sr-only;
}
input,
textarea,
.Draftail-Editor .public-DraftEditor-content {
@apply w-h1;
color: $color-input-text;
// Slightly out-dented so the fields is horizontally aligned.
padding-inline-start: theme('spacing[1.5]');
margin-inline-start: calc(-1 * theme('spacing[1.5]'));
&:not(:hover, :focus, [aria-invalid='true']) {
border-color: transparent;
}
}
}