From a95089f1483b5e594a0c000c66b513643fe9d6a8 Mon Sep 17 00:00:00 2001 From: Valentin Popov Date: Tue, 24 Apr 2018 16:09:44 +0400 Subject: [PATCH] Decor form Signed-off-by: Valentin Popov --- _scss/components/theme/_form.scss | 67 +++++++++++++++++++++++++++++++ 1 file changed, 67 insertions(+) create mode 100644 _scss/components/theme/_form.scss diff --git a/_scss/components/theme/_form.scss b/_scss/components/theme/_form.scss new file mode 100644 index 0000000..6efcdcf --- /dev/null +++ b/_scss/components/theme/_form.scss @@ -0,0 +1,67 @@ +@import 'utilities/appearance'; +@import 'utilities/boxshadow'; + +input:not([type]), +input[type='color'], +input[type='date'], +input[type='datetime'], +input[type='datetime-local'], +input[type='email'], +input[type='month'], +input[type='number'], +input[type='password'], +input[type='search'], +input[type='tel'], +input[type='text'], +input[type='url'], +input[type='week'], +select, +textarea { + background-color: transparent; + border: .1rem solid $color-quaternary; + border-radius: .4rem; + box-sizing: inherit; + height: 3.8rem; + padding: .6rem 1rem; + width: 100%; + + @include appearance(none); + @include boxshadow(none); + + &:focus { + border-color: $color-primary; + outline: 0; + } +} + +select { + padding-right: 3rem; +} + +textarea { + min-height: 6.5rem; +} + +label, +legend { + display: block; + font-size: 1.6rem; + font-weight: 700; + margin-bottom: .5rem; +} + +fieldset { + border-width: 0; + padding: 0; +} + +input[type='checkbox'], +input[type='radio'] { + display: inline; +} + +.label-inline { + display: inline-block; + font-weight: normal; + margin-left: .5rem; +}