79 lines
1.6 KiB
SCSS
79 lines
1.6 KiB
SCSS
@import "colors";
|
|
@import "constants";
|
|
|
|
// scss-lint:disable SelectorFormat
|
|
|
|
.procedure-form .page-title {
|
|
text-align: left;
|
|
}
|
|
|
|
.procedure-form__columns {
|
|
display: flex;
|
|
margin-top: -$sub-header-bottom-margin;
|
|
}
|
|
|
|
// We want to make the form as large as possible,
|
|
// without shrinking the preview too much.
|
|
//
|
|
// A balanced compromised seems to make the form
|
|
// slighly larger than the preview (flex 10/9), and
|
|
// to reduce the margins on the preview as much as
|
|
// possible.
|
|
.procedure-form__column--form {
|
|
flex: 10;
|
|
padding: 0 $default-padding;
|
|
background-color: $light-grey;
|
|
}
|
|
|
|
.procedure-form__column--preview {
|
|
flex: 9;
|
|
padding: 0 2 * $default-padding;
|
|
// Gain a little horizontal space by using the white
|
|
// space on the right as our margin.
|
|
padding-right: 0;
|
|
}
|
|
|
|
// Hide the preview panel on smaller screens
|
|
@media screen and (max-width: 800px) {
|
|
.procedure-form__column--preview {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
.procedure-form__preview .procedure-preview {
|
|
max-width: 450px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.procedure-form__preview-title {
|
|
font-size: 1.2rem;
|
|
font-weight: bold;
|
|
opacity: 0.5;
|
|
margin-top: $default-spacer * 4;
|
|
margin-bottom: $default-spacer * 8;
|
|
}
|
|
|
|
.procedure-form__actions {
|
|
display: flex;
|
|
margin-left: -$default-padding;
|
|
margin-right: -$default-padding;
|
|
padding: $default-spacer $default-padding;
|
|
background: $light-grey;
|
|
border-top: 1px solid $border-grey;
|
|
|
|
.button.send {
|
|
margin-left: auto;
|
|
}
|
|
}
|
|
|
|
.procedure-form__options-details {
|
|
margin-bottom: $default-padding;
|
|
}
|
|
|
|
.procedure-form__options-summary {
|
|
cursor: pointer;
|
|
|
|
.header-subsection {
|
|
display: inline-block;
|
|
}
|
|
}
|