aboutsummaryrefslogtreecommitdiff
path: root/_scss/imports/scss/_Base.scss
diff options
context:
space:
mode:
authorValerio Virgillito2012-01-27 16:39:22 -0800
committerValerio Virgillito2012-01-27 16:39:22 -0800
commita53d4ef4d26d5c4c8e5f4859f8fd3e95ccce8c3b (patch)
tree436668182ef20ab30fb59701deb2e25c5da4498f /_scss/imports/scss/_Base.scss
parent302e3eb01037ff550bc93547cb8d5d0a0780b312 (diff)
parent01e7e2448bc58698fb5808d141c1a8a5dfbdaaf7 (diff)
downloadninja-a53d4ef4d26d5c4c8e5f4859f8fd3e95ccce8c3b.tar.gz
Merge pull request #2 from jreid01/pullrequest
Fixes to radio button base styles. Comment clean-up.
Diffstat (limited to '_scss/imports/scss/_Base.scss')
-rw-r--r--_scss/imports/scss/_Base.scss49
1 files changed, 26 insertions, 23 deletions
diff --git a/_scss/imports/scss/_Base.scss b/_scss/imports/scss/_Base.scss
index f9a1cfa3..75ccc07d 100644
--- a/_scss/imports/scss/_Base.scss
+++ b/_scss/imports/scss/_Base.scss
@@ -4,12 +4,12 @@
4// (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. 4// (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5// </copyright> 5// </copyright>
6 6
7/* 7
8 * Base.scss 8//Base.scss
9 * Base styles for entire application. 9//Base styles for entire application.
10 * Note that colors and font definitions go in 10//Note that colors and font definitions go in
11 * _scss/themes/themename/_colors.scss and _scss/themes/themename/_fonts.scss 11//_scss/themes/themename/_colors.scss and _scss/themes/themename/_fonts.scss
12 */ 12
13 13
14.clear { 14.clear {
15 display: block; 15 display: block;
@@ -42,8 +42,8 @@
42 float: right; 42 float: right;
43} 43}
44 44
45/* Begin: Basic skinning for form fields */ 45// Begin: Basic skinning for form fields
46/* Reset all */ 46// Reset all
47input.nj-skinned, 47input.nj-skinned,
48textarea.nj-skinned, 48textarea.nj-skinned,
49button.nj-skinned, 49button.nj-skinned,
@@ -54,7 +54,7 @@ button.nj-skinned {
54 outline: none; 54 outline: none;
55} 55}
56 56
57/* Base styles */ 57// Base styles
58input[type="text"].nj-skinned, 58input[type="text"].nj-skinned,
59input[type="password"].nj-skinned, 59input[type="password"].nj-skinned,
60input[type="search"].nj-skinned, 60input[type="search"].nj-skinned,
@@ -68,7 +68,7 @@ select.nj-skinned option {
68 font-family: 'Droid Sans', sans-serif; 68 font-family: 'Droid Sans', sans-serif;
69} 69}
70 70
71/* Disabled styles */ 71// Disabled styles
72input.nj-skinned:disabled, 72input.nj-skinned:disabled,
73textarea.nj-skinned:disabled, 73textarea.nj-skinned:disabled,
74select.nj-skinned:disabled, 74select.nj-skinned:disabled,
@@ -76,7 +76,7 @@ button.nj-skinned:disabled {
76 opacity: 0.4; 76 opacity: 0.4;
77} 77}
78 78
79/* Text inputs and select boxes */ 79// Text inputs and select boxes
80input[type="text"].nj-skinned, 80input[type="text"].nj-skinned,
81input[type="password"].nj-skinned, 81input[type="password"].nj-skinned,
82input[type="search"].nj-skinned, 82input[type="search"].nj-skinned,
@@ -84,7 +84,7 @@ select.nj-skinned,
84select.nj-skinned option { 84select.nj-skinned option {
85 height: 13px; 85 height: 13px;
86} 86}
87/* 87//
88input[type="text"].nj-skinned:focus, 88input[type="text"].nj-skinned:focus,
89input[type="password"].nj-skinned:focus, 89input[type="password"].nj-skinned:focus,
90input[type="search"].nj-skinned:focus, 90input[type="search"].nj-skinned:focus,
@@ -93,7 +93,7 @@ select.nj-skinned:focus,
93select.nj-skinned option:focus { 93select.nj-skinned option:focus {
94 -webkit-box-shadow: 0px 0px 3px $color-focus-outline; 94 -webkit-box-shadow: 0px 0px 3px $color-focus-outline;
95} 95}
96*/ 96
97 97
98select.nj-skinned { 98select.nj-skinned {
99 background-image: url("../images/dropdown-bg.png"); 99 background-image: url("../images/dropdown-bg.png");
@@ -118,13 +118,13 @@ input[type="search"].nj-skinned::-webkit-search-cancel-button:after {
118 content:"\2716"; 118 content:"\2716";
119} 119}
120 120
121/* Buttons */ 121// Buttons
122button.nj-skinned { 122button.nj-skinned {
123 font-size: 9px; 123 font-size: 9px;
124 cursor: pointer; 124 cursor: pointer;
125} 125}
126 126
127/* Radio buttons */ 127// Radio buttons
128input[type="radio"].nj-skinned { 128input[type="radio"].nj-skinned {
129 background-color: $color-menu-bg; 129 background-color: $color-menu-bg;
130 background-image: -webkit-linear-gradient(top, $color-radio-gradient-top 0%, $color-radio-gradient-bottom 100%); 130 background-image: -webkit-linear-gradient(top, $color-radio-gradient-top 0%, $color-radio-gradient-bottom 100%);
@@ -143,15 +143,18 @@ input[type="radio"].nj-skinned {
143 box-shadow: 0px 0px 2px $color-radio-shadow; 143 box-shadow: 0px 0px 2px $color-radio-shadow;
144} 144}
145input[type="radio"].nj-skinned:checked { 145input[type="radio"].nj-skinned:checked {
146 background-image: -webkit-linear-gradient(top, $color-radio-gradient-top 0%, $color-radio-gradient-bottom 100%); 146 background: -webkit-radial-gradient(center,
147 circle cover,
148 $color-radio 0%,
149 $color-radio 15%,
150 $color-radio 30%,
151 $color-transparent 31%),
152 -webkit-linear-gradient(top, $color-radio-gradient-top 0%, $color-radio-gradient-bottom 100%);
147 border: 2px solid $color-radio-border; 153 border: 2px solid $color-radio-border;
148} 154}
149input[type="radio"].nj-skinned:hover { 155input[type="radio"].nj-skinned:hover {
150 border: 2px solid $color-radio-border; 156 border: 2px solid $color-radio-border;
151} 157}
152input[type="radio"].nj-skinned:checked:after {
153 content:"\a0 \a0 \2022";
154}
155input[type="radio"].nj-skinned:active { 158input[type="radio"].nj-skinned:active {
156 background-image: -webkit-linear-gradient(top, $color-radio-gradient-bottom 0%, $color-radio-gradient-top 100%); 159 background-image: -webkit-linear-gradient(top, $color-radio-gradient-bottom 0%, $color-radio-gradient-top 100%);
157} 160}
@@ -160,7 +163,7 @@ input[type="radio"].nj-skinned:disabled {
160 border: 2px solid $color-radio-border; 163 border: 2px solid $color-radio-border;
161 cursor: default; 164 cursor: default;
162} 165}
163/* Checkboxes */ 166// Checkboxes
164input[type="checkbox"].nj-skinned { 167input[type="checkbox"].nj-skinned {
165 background-color: $color-menu-bg; 168 background-color: $color-menu-bg;
166 background-image: -webkit-linear-gradient(top, $color-radio-gradient-top 0%, $color-radio-gradient-bottom 100%); 169 background-image: -webkit-linear-gradient(top, $color-radio-gradient-top 0%, $color-radio-gradient-bottom 100%);
@@ -190,9 +193,9 @@ input[type="checkbox"].nj-skinned:disabled {
190 background-image: -webkit-linear-gradient(top, $color-radio-gradient-top 0%, $color-radio-gradient-bottom 100%); 193 background-image: -webkit-linear-gradient(top, $color-radio-gradient-top 0%, $color-radio-gradient-bottom 100%);
191 cursor: default; 194 cursor: default;
192} 195}
193/* End: Basic skinning for form fields */ 196// End: Basic skinning for form fields
194 197
195/* Begin: Basic skinning for visual dividers */ 198// Begin: Basic skinning for visual dividers
196.nj-divider { 199.nj-divider {
197 background-color: $color-divider-second; 200 background-color: $color-divider-second;
198 border-width: 0px; 201 border-width: 0px;
@@ -208,4 +211,4 @@ input[type="checkbox"].nj-skinned:disabled {
208 border-right: 1px solid $color-divider-third; 211 border-right: 1px solid $color-divider-third;
209 width: 1px; 212 width: 1px;
210} 213}
211/* End: Basic skinning for visual dividers */ 214// End: Basic skinning for visual dividers