diff --git a/public/css/app/aux.styl b/public/css/app/aux.styl index fdc90dc..bd4281f 100644 --- a/public/css/app/aux.styl +++ b/public/css/app/aux.styl @@ -23,20 +23,9 @@ input width: 100% - display: block - height: 35px - font-size: 14px - padding: 10px 0.5em margin-bottom: 15px - background-color: #f9fafa - border: 1px solid #eeeeee - color: #2e2d2d borderbox() - &:focus - border: 1px solid #a7d9eb - outline: 0px - button, .andyetLogin text-decoration: none text-align: center diff --git a/public/css/app/chat.styl b/public/css/app/chat.styl index 394a46e..6eb815d 100644 --- a/public/css/app/chat.styl +++ b/public/css/app/chat.styl @@ -148,8 +148,5 @@ padding: 5px borderbox() - &:focus - border-color: #bbb - &.editing background-color: yellow diff --git a/public/css/app/forms.styl b/public/css/app/forms.styl new file mode 100644 index 0000000..f19f4e7 --- /dev/null +++ b/public/css/app/forms.styl @@ -0,0 +1,25 @@ +input[type=text], input[type=email], input[type=search], textarea + -webkit-appearance: none + roundall(3px) + padding: 10px + background: white + border: 1px solid $grayOutline + font-size: 0.8em + borderbox() + + transition: border .2s ease-in 0 + -webkit-transition: border .2s ease-in 0 + -moz-transition: border .2s ease-in 0 + +input[type=text], input[type=email], input[type=search] + height: 8px + +textarea + resize: none + +input[type=text]:focus, +input[type=email]:focus, +input[type=search]:focus, +textarea:focus + outline: none + border: 1px solid lighten($activeBlue, 50%) \ No newline at end of file diff --git a/public/css/otalk.css b/public/css/otalk.css index a7b6b56..65dc143 100644 --- a/public/css/otalk.css +++ b/public/css/otalk.css @@ -612,9 +612,6 @@ td { -webkit-box-sizing: border-box; box-sizing: border-box; } -.chatBox textarea:focus { - border-color: #bbb; -} .chatBox textarea.editing { background-color: #ff0; } @@ -703,22 +700,11 @@ body #menu { } #loginbox input { width: 100%; - display: block; - height: 35px; - font-size: 14px; - padding: 10px 0.5em; margin-bottom: 15px; - background-color: #f9fafa; - border: 1px solid #eee; - color: #2e2d2d; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } -#loginbox input:focus { - border: 1px solid #a7d9eb; - outline: 0px; -} #loginbox button, #loginbox .andyetLogin { text-decoration: none; @@ -748,3 +734,43 @@ body #menu { padding-bottom: 10px; border-bottom: 1px solid #f8f8f8; } +input[type=text], +input[type=email], +input[type=search], +textarea { + -webkit-appearance: none; + -moz-border-radius: 3px; + -webkit-border-radius: 3px; + -khtml-border-radius: 3px; + -o-border-radius: 3px; + -border-radius: 3px; + border-radius: 3px; + padding: 10px; + background: #fff; + border: 1px solid #e4e4e4; + font-size: 0.8em; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; + -webkit-transition: border 0.2s ease-in 0; + -o-transition: border 0.2s ease-in 0; + transition: border 0.2s ease-in 0; + -moz-transition: border 0.2s ease-in 0; + -webkit-transition: border 0.2s ease-in 0; + -moz-transition: border 0.2s ease-in 0; +} +input[type=text], +input[type=email], +input[type=search] { + height: 8px; +} +textarea { + resize: none; +} +input[type=text]:focus, +input[type=email]:focus, +input[type=search]:focus, +textarea:focus { + outline: none; + border: 1px solid #78daff; +} diff --git a/public/css/otalk.styl b/public/css/otalk.styl index fa0affb..569c504 100644 --- a/public/css/otalk.styl +++ b/public/css/otalk.styl @@ -6,3 +6,4 @@ @import 'app/connectionStatus' @import 'app/layout' @import 'app/aux' +@import 'app/forms'