milligram/src/_Form.sass

58 lines
1.5 KiB
Sass
Raw Normal View History

2015-12-26 01:56:59 +00:00
// Form
//
input[type='email'],
input[type='number'],
2015-12-27 17:43:13 +00:00
input[type='password'],
2015-12-26 01:56:59 +00:00
input[type='search'],
input[type='tel'],
2015-12-27 17:43:13 +00:00
input[type='text'],
2015-12-26 01:56:59 +00:00
input[type='url'],
textarea,
select
appearance: none // Removes awkward default styles on some inputs for iOS
background-color: transparent
border: .1rem solid $color-quaternary
border-radius: .4rem
box-shadow: none
height: 3.8rem
padding: .6rem 1.0rem // The .6rem vertically centers text on FF, ignored by Webkit
width: 100%
&:focus
border: .1rem solid $color-primary
outline: 0
2016-01-08 11:37:11 +00:00
select
2016-08-08 02:35:10 +00:00
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="14" viewBox="0 0 29 14" width="29"><path fill="#d1d1d1" d="M9.37727 3.625l5.08154 6.93523L19.54036 3.625"/></svg>') center right no-repeat
padding-right: 3.0rem
2016-01-08 11:37:11 +00:00
&:focus
2016-08-08 02:35:10 +00:00
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="14" viewBox="0 0 29 14" width="29"><path fill="#9b4dca" d="M9.37727 3.625l5.08154 6.93523L19.54036 3.625"/></svg>')
2016-01-08 11:37:11 +00:00
2015-12-26 01:56:59 +00:00
textarea
padding-bottom: .6rem
padding-top: .6rem
min-height: 6.5rem
label,
legend
font-size: 1.6rem
font-weight: 700
display: block
margin-bottom: .5rem
fieldset
border-width: 0
padding: 0
input[type='checkbox'],
input[type='radio']
display: inline
.label-inline
font-weight: normal
display: inline-block
margin-left: .5rem