diff --git a/opentech/static_src/src/sass/public/components/_form.scss b/opentech/static_src/src/sass/public/components/_form.scss index cb57a3c915d579cc5203f42f3bacf9fd2e0b4630..1d816674003ee53ff23e93da1afc5777c4b4d9d9 100644 --- a/opentech/static_src/src/sass/public/components/_form.scss +++ b/opentech/static_src/src/sass/public/components/_form.scss @@ -25,16 +25,12 @@ position: relative; margin: 1rem 0; - &:nth-of-type(1) { - margin-top: 0; - } - @include media-query(tablet-portrait) { margin: 2rem 0; } - input[type='date']:last-child { - max-width: 385px; + &:nth-of-type(1) { + margin-top: 0; } &:last-child { @@ -43,6 +39,36 @@ margin-bottom: 0; } } + + &--wrap { + flex-wrap: wrap; + } + + &--checkbox { + display: flex; + align-items: center; + margin: 20px 0; + + .form__question { + margin: 0; + } + + .form__item { + position: relative; + top: -10px; + order: -1; + padding: 0; + } + + .form__help { + order: -2; + width: 100%; + } + } + + input[type='date']:last-child { + max-width: 385px; + } } &__question { @@ -73,6 +99,10 @@ } } } + + &--boolean_field { + font-size: 17px; + } // sass-lint:enddisable } @@ -266,6 +296,10 @@ // Checkbox specific input[type='checkbox'] { + & + label { + display: block; + } + & + label::before { transition: background-color $transition; } diff --git a/opentech/static_src/src/sass/public/components/_rich-text.scss b/opentech/static_src/src/sass/public/components/_rich-text.scss index b979962ba2e9cd0e6a1211748a220d340be9acc6..27d689e8d1396080de0c7534a131130fb4b0707d 100644 --- a/opentech/static_src/src/sass/public/components/_rich-text.scss +++ b/opentech/static_src/src/sass/public/components/_rich-text.scss @@ -1,6 +1,10 @@ .rich-text { margin-bottom: 2rem; + .form & { + margin-bottom: 0; + } + a { font-weight: $weight--bold; border-bottom: 1px solid transparent;