discourse/app/assets/stylesheets/common/form-kit/_field.scss
Joffrey JAFFEUX 3a2e747cf6
FIX: applies full class to field (#29190)
Prior to this fix the format class was only applied to the child control, but in case of full we also need to ensure the parent wrapping field is also taking 100% width otherwise we are at risk of having a field of the width of its content.
2024-10-15 10:24:39 +09:00

65 lines
1.1 KiB
SCSS

.form-kit__field {
.form-kit__container-content {
align-items: flex-start;
flex-direction: column;
width: var(--form-kit-medium-input);
}
&.--full {
width: 100%;
}
&-textarea,
&-composer,
&-code,
&-image {
.form-kit__container-content {
width: var(--form-kit-large-input) !important;
}
}
&-checkbox {
.form-kit__container-content {
width: 100% !important;
}
}
&-toggle {
flex-direction: row;
align-items: center;
justify-content: space-between;
width: var(--form-kit-medium-input);
.form-kit__container-content {
align-items: flex-end;
}
.form-kit__container-title {
padding: 0;
}
}
.form-kit__container-description {
margin: 0;
font-size: var(--font-down-1-rem);
}
.form-kit__container-content {
&.--small {
width: var(--form-kit-small-input) !important;
}
&.--medium {
width: var(--form-kit-medium-input);
}
&.--large {
width: var(--form-kit-large-input);
}
&.--full {
width: 100% !important;
}
}
}