diff options
Diffstat (limited to '_scss/imports/scss/_Base.scss')
-rw-r--r-- | _scss/imports/scss/_Base.scss | 49 |
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 |
47 | input.nj-skinned, | 47 | input.nj-skinned, |
48 | textarea.nj-skinned, | 48 | textarea.nj-skinned, |
49 | button.nj-skinned, | 49 | button.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 |
58 | input[type="text"].nj-skinned, | 58 | input[type="text"].nj-skinned, |
59 | input[type="password"].nj-skinned, | 59 | input[type="password"].nj-skinned, |
60 | input[type="search"].nj-skinned, | 60 | input[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 |
72 | input.nj-skinned:disabled, | 72 | input.nj-skinned:disabled, |
73 | textarea.nj-skinned:disabled, | 73 | textarea.nj-skinned:disabled, |
74 | select.nj-skinned:disabled, | 74 | select.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 |
80 | input[type="text"].nj-skinned, | 80 | input[type="text"].nj-skinned, |
81 | input[type="password"].nj-skinned, | 81 | input[type="password"].nj-skinned, |
82 | input[type="search"].nj-skinned, | 82 | input[type="search"].nj-skinned, |
@@ -84,7 +84,7 @@ select.nj-skinned, | |||
84 | select.nj-skinned option { | 84 | select.nj-skinned option { |
85 | height: 13px; | 85 | height: 13px; |
86 | } | 86 | } |
87 | /* | 87 | // |
88 | input[type="text"].nj-skinned:focus, | 88 | input[type="text"].nj-skinned:focus, |
89 | input[type="password"].nj-skinned:focus, | 89 | input[type="password"].nj-skinned:focus, |
90 | input[type="search"].nj-skinned:focus, | 90 | input[type="search"].nj-skinned:focus, |
@@ -93,7 +93,7 @@ select.nj-skinned:focus, | |||
93 | select.nj-skinned option:focus { | 93 | select.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 | ||
98 | select.nj-skinned { | 98 | select.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 |
122 | button.nj-skinned { | 122 | button.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 |
128 | input[type="radio"].nj-skinned { | 128 | input[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 | } |
145 | input[type="radio"].nj-skinned:checked { | 145 | input[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 | } |
149 | input[type="radio"].nj-skinned:hover { | 155 | input[type="radio"].nj-skinned:hover { |
150 | border: 2px solid $color-radio-border; | 156 | border: 2px solid $color-radio-border; |
151 | } | 157 | } |
152 | input[type="radio"].nj-skinned:checked:after { | ||
153 | content:"\a0 \a0 \2022"; | ||
154 | } | ||
155 | input[type="radio"].nj-skinned:active { | 158 | input[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 |
164 | input[type="checkbox"].nj-skinned { | 167 | input[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 |