diff options
author | raylu <raylu@mixpanel.com> | 2011-07-16 23:29:34 -0700 |
---|---|---|
committer | raylu <raylu@mixpanel.com> | 2011-07-16 23:29:34 -0700 |
commit | 8fa4bab1dfd166fd567f2b1a3910f0628c6278e7 (patch) | |
tree | 828aed2c6ec160a9a86768bbe6dba2f622c18cab /webroot | |
parent | dcc965ab293655136c251afe4fb6f4f41ac5cb75 (diff) | |
download | otakuhub-8fa4bab1dfd166fd567f2b1a3910f0628c6278e7.tar.xz |
form styling
Diffstat (limited to 'webroot')
-rw-r--r-- | webroot/css/base.css | 17 | ||||
-rw-r--r-- | webroot/css/search.css | 8 | ||||
-rw-r--r-- | webroot/css/themes/light.css | 22 |
3 files changed, 30 insertions, 17 deletions
diff --git a/webroot/css/base.css b/webroot/css/base.css index 29fd2c3..da366c6 100644 --- a/webroot/css/base.css +++ b/webroot/css/base.css @@ -243,13 +243,16 @@ body.ie7 form, body.ie8 { form p { margin-bottom:15px; } -form input, form textarea { +form input, form textarea, form select { padding: 7px 5px; border: 1px solid #ccc; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; } +form select { + padding: 6px 5px; +} input[type="button"], input[type="submit"], button { padding: 6px 5px; /* looks high in FF at inherited 7 5 */ line-height: 18px; /* looks small in webkit at 6 5 */ @@ -257,24 +260,12 @@ input[type="button"], input[type="submit"], button { display: inline-block; font-weight: 700; outline: none; - background: #ddd; color: #444; text-shadow: 0 -1px 0 #eee; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; } -input[type="button"]:hover, input[type="submit"]:hover, button:hover { - background: #eee; -} -form select { - padding: 6px 5px; - border: 1px solid #ccc; - border-radius: 3px; - -moz-border-radius: 3px; - -webkit-border-radius: 3px; - background-color: #eee; -} div#login { text-align: center; diff --git a/webroot/css/search.css b/webroot/css/search.css index ff9907e..20ea164 100644 --- a/webroot/css/search.css +++ b/webroot/css/search.css @@ -16,13 +16,13 @@ p.more a { border-radius: 3px; background: #ddd; background: -moz-linear-gradient(top, #ddd, #bbb); - background: -webkit-linear-gradient(top, rgba(255,255,255,1), rgba(255,255,255,0)); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffffff00', GradientType=1); + background: -webkit-linear-gradient(top, #ddd, #bbb); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dddddd', endColorstr='#bbbbbb'); color: #111; } p.more a:hover { background: #eee; background: -moz-linear-gradient(top, #eee, #ccc); - background: -webkit-linear-gradient(top, rgba(255,255,255,1), rgba(255,255,255,0)); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffffff00', GradientType=1); + background: -webkit-linear-gradient(top, #eee, #ccc); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#cccccc'); } diff --git a/webroot/css/themes/light.css b/webroot/css/themes/light.css index b3b95ae..677557a 100644 --- a/webroot/css/themes/light.css +++ b/webroot/css/themes/light.css @@ -48,6 +48,28 @@ a.gradient:hover { color: #fff; } +form input, form textarea, form select { + background: #f7f7f7; + background: -moz-linear-gradient(top, #eee, #fff); + background: -webkit-linear-gradient(top, #eee, #fff); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eee', endColorstr='#fff'); +} +input[type="button"], input[type="submit"], button { + background: #ddd; + background: -moz-linear-gradient(top, #ddd, #eee); + background: -webkit-linear-gradient(top, #ddd, #eee); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ddd', endColorstr='#eee'); +} +form input:focus, form textarea:focus, select:focus { + border-color: #88c; +} +input[type="button"]:hover, input[type="submit"]:hover, button:hover { + background: #eee; + background: -moz-linear-gradient(top, #e0e0e0, #f7f7f7); + background: -webkit-linear-gradient(top, #e0e0e0, #f7f7f7); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e0e0e0', endColorstr='#f7f7f7'); +} + footer { color: #666; } |