aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorJon Reid2012-01-31 17:26:56 -0800
committerJon Reid2012-01-31 17:26:56 -0800
commitea8b9e2e62b85ecc75baf0b6ead5acafd70f0ab3 (patch)
tree847f9ecb24cf9e0c1ff9181e2db243ccbefaf395
parent1d8af9fb2be85c33ce6a846f97360ba2ee17ea23 (diff)
downloadninja-ea8b9e2e62b85ecc75baf0b6ead5acafd70f0ab3.tar.gz
Added skin for html buttons.
-rw-r--r--_scss/compass_app_log.txt1
-rw-r--r--_scss/imports/scss/_Base.scss18
-rw-r--r--css/ninja.css6
3 files changed, 21 insertions, 4 deletions
diff --git a/_scss/compass_app_log.txt b/_scss/compass_app_log.txt
index 00a7f071..463846ba 100644
--- a/_scss/compass_app_log.txt
+++ b/_scss/compass_app_log.txt
@@ -106,3 +106,4 @@
1062012-01-27 16:12:29 overwrite ../css/ninja.css 1062012-01-27 16:12:29 overwrite ../css/ninja.css
1072012-01-27 16:13:46 overwrite ../css/ninja.css 1072012-01-27 16:13:46 overwrite ../css/ninja.css
1082012-01-27 16:14:02 overwrite ../css/ninja.css 1082012-01-27 16:14:02 overwrite ../css/ninja.css
1092012-01-31 17:22:02 overwrite ../css/ninja.css
diff --git a/_scss/imports/scss/_Base.scss b/_scss/imports/scss/_Base.scss
index 75ccc07d..77faa8f3 100644
--- a/_scss/imports/scss/_Base.scss
+++ b/_scss/imports/scss/_Base.scss
@@ -48,8 +48,7 @@ input.nj-skinned,
48textarea.nj-skinned, 48textarea.nj-skinned,
49button.nj-skinned, 49button.nj-skinned,
50select.nj-skinned, 50select.nj-skinned,
51select.nj-skinned option, 51select.nj-skinned option {
52button.nj-skinned {
53 -webkit-appearance: none; 52 -webkit-appearance: none;
54 outline: none; 53 outline: none;
55} 54}
@@ -122,6 +121,21 @@ input[type="search"].nj-skinned::-webkit-search-cancel-button:after {
122button.nj-skinned { 121button.nj-skinned {
123 font-size: 9px; 122 font-size: 9px;
124 cursor: pointer; 123 cursor: pointer;
124 display: block;
125 border: 0px;
126 margin: 0px;
127 padding: 4px;
128 border: 1px $color-input-border solid;
129 background-color: $color-menu-bg;
130 background-image: -webkit-linear-gradient(top, $color-radio-gradient-top 0%, $color-radio-gradient-bottom 100%);
131 border-radius: 4px;
132 color: $color-menu-text;
133 text-transform: uppercase;
134 cursor: pointer;
135 text-shadow: 1px 1px 1px $color-app-shadow
136}
137button.nj-skinned:hover {
138 background-image: -webkit-linear-gradient(top, $color-radio-gradient-bottom 0%, $color-radio-gradient-top 100%);
125} 139}
126 140
127// Radio buttons 141// Radio buttons
diff --git a/css/ninja.css b/css/ninja.css
index 9126c1d3..bf71955f 100644
--- a/css/ninja.css
+++ b/css/ninja.css
@@ -16,7 +16,7 @@
16 16
17.layout-table .flexor div:last-child { float: right; } 17.layout-table .flexor div:last-child { float: right; }
18 18
19input.nj-skinned, textarea.nj-skinned, button.nj-skinned, select.nj-skinned, select.nj-skinned option, button.nj-skinned { -webkit-appearance: none; outline: none; } 19input.nj-skinned, textarea.nj-skinned, button.nj-skinned, select.nj-skinned, select.nj-skinned option { -webkit-appearance: none; outline: none; }
20 20
21input[type="text"].nj-skinned, input[type="password"].nj-skinned, input[type="search"].nj-skinned, textarea.nj-skinned, select.nj-skinned, select.nj-skinned option { border: 1px solid #313131; color: white; background-color: #444444; font-size: 12px; font-family: 'Droid Sans', sans-serif; } 21input[type="text"].nj-skinned, input[type="password"].nj-skinned, input[type="search"].nj-skinned, textarea.nj-skinned, select.nj-skinned, select.nj-skinned option { border: 1px solid #313131; color: white; background-color: #444444; font-size: 12px; font-family: 'Droid Sans', sans-serif; }
22 22
@@ -34,7 +34,9 @@ input[type="search"].nj-skinned::-webkit-search-cancel-button { -webkit-appearan
34 34
35input[type="search"].nj-skinned::-webkit-search-cancel-button:after { content: "\2716"; } 35input[type="search"].nj-skinned::-webkit-search-cancel-button:after { content: "\2716"; }
36 36
37button.nj-skinned { font-size: 9px; cursor: pointer; } 37button.nj-skinned { font-size: 9px; cursor: pointer; display: block; border: 0px; margin: 0px; padding: 4px; border: 1px #313131 solid; background-color: #474747; background-image: -webkit-linear-gradient(top, #646464 0%, #3c3c3c 100%); border-radius: 4px; color: white; text-transform: uppercase; cursor: pointer; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); }
38
39button.nj-skinned:hover { background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #646464 100%); }
38 40
39input[type="radio"].nj-skinned { background-color: #474747; background-image: -webkit-linear-gradient(top, #646464 0%, #3c3c3c 100%); color: #c8c8c8; border: 2px solid #282828; width: 12px; height: 12px; overflow: hidden; border-radius: 10px; font-size: 16px; line-height: 7px; text-indent: -7px; cursor: pointer; -webkit-box-shadow: 0px 0px 2px rgba(200, 200, 200, 0.5); -moz-box-shadow: 0px 0px 2px rgba(200, 200, 200, 0.5); box-shadow: 0px 0px 2px rgba(200, 200, 200, 0.5); } 41input[type="radio"].nj-skinned { background-color: #474747; background-image: -webkit-linear-gradient(top, #646464 0%, #3c3c3c 100%); color: #c8c8c8; border: 2px solid #282828; width: 12px; height: 12px; overflow: hidden; border-radius: 10px; font-size: 16px; line-height: 7px; text-indent: -7px; cursor: pointer; -webkit-box-shadow: 0px 0px 2px rgba(200, 200, 200, 0.5); -moz-box-shadow: 0px 0px 2px rgba(200, 200, 200, 0.5); box-shadow: 0px 0px 2px rgba(200, 200, 200, 0.5); }
40 42