Created
February 18, 2015 16:33
-
-
Save khusnetdinov/87019ebfb3e0eea98226 to your computer and use it in GitHub Desktop.
Forms overloads
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@import "simple_ui/import/base"; | |
.l-page { | |
input, textarea, select, button { | |
font: #{$font-size}/#{$line-height} $font-family; | |
outline: none; | |
} | |
label { | |
// Stuff | |
} | |
/* | |
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` | |
* and `video` controls. | |
* 2. Corrects inability to style clickable `input` types in iOS. | |
*/ | |
button, | |
html input[type="button"], /* 1 */ | |
input[type="reset"], | |
input[type="submit"] { | |
-webkit-appearance: button; /* 2 */ | |
} | |
button, | |
input[type="button"], | |
input[type="reset"], | |
input[type="submit"] { | |
// Stuff | |
} | |
select { | |
option { | |
} | |
&[multiple] { | |
option { | |
} | |
} | |
} | |
/* | |
* 1. Addresses box sizing set to content-box in IE 8/9. | |
* 2. Removes excess padding in IE 8/9. | |
*/ | |
input[type="checkbox"], | |
input[type="radio"] { | |
box-sizing: border-box; /* 2 */ | |
padding: 0; /* 1 */ | |
} | |
/* | |
* 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome. | |
*/ | |
input[type="search"] { | |
-webkit-appearance: textfield; /* 1 */ | |
@include box-sizing(content-box); | |
} | |
/* | |
* Removes inner padding and search cancel button in Safari 5 and Chrome | |
* on OS X. | |
*/ | |
input[type="search"]::-webkit-search-cancel-button, | |
input[type="search"]::-webkit-search-decoration { | |
-webkit-appearance: none; | |
} | |
/* | |
* Removes inner padding and border in Firefox 3+. | |
*/ | |
button::-moz-focus-inner, | |
input::-moz-focus-inner { | |
border: 0; | |
padding: 0; | |
} | |
input[type="number"] { | |
text-align: right; | |
background: red !important; | |
&::-webkit-inner-spin-button, | |
&::-webkit-outer-spin-button { | |
-webkit-appearance: none; | |
margin: 0; | |
} | |
} | |
input.numeric { | |
} | |
#{$all-text-inputs}, select { | |
} | |
#{$all-text-inputs}, select, textarea { | |
&:hover { | |
} | |
&:focus { | |
} | |
&:disabled { | |
} | |
} | |
#{$all-text-inputs}, textarea { | |
@include placeholder { | |
color: black !important; | |
opacity: 1; | |
text-align: center; | |
} | |
} | |
/* | |
* 1. Removes default vertical scrollbar in IE 6/7/8/9. | |
* 2. Improves readability and alignment in all browsers. | |
*/ | |
textarea { | |
overflow: auto; /* 1 */ | |
vertical-align: top; /* 2 */ | |
} | |
input[type=password] { | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment