| OLD | NEW |
| 1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved. | 1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved. |
| 2 * Use of this source code is governed by a BSD-style license that can be | 2 * Use of this source code is governed by a BSD-style license that can be |
| 3 * found in the LICENSE file. */ | 3 * found in the LICENSE file. */ |
| 4 | 4 |
| 5 /* This file defines styles for form controls. The order of rule blocks is | 5 /* This file defines styles for form controls. The order of rule blocks is |
| 6 * important as there are some rules with equal specificity that rely on order | 6 * important as there are some rules with equal specificity that rely on order |
| 7 * as a tiebreaker. These are marked with OVERRIDE. */ | 7 * as a tiebreaker. These are marked with OVERRIDE. */ |
| 8 | 8 |
| 9 @import url(action_link.css); | 9 @import url(action_link.css); |
| 10 | 10 |
| 11 /* Default state **************************************************************/ | 11 /* Default state **************************************************************/ |
| 12 | 12 |
| 13 :-webkit-any(button, | 13 :-webkit-any(button, |
| 14 input[type='button'], | 14 input[type='button'], |
| 15 input[type='submit']):not(.custom-appearance), | 15 input[type='submit']):not(.custom-appearance), |
| 16 select, | 16 select, |
| 17 input[type='checkbox'], | 17 input[type='checkbox'], |
| 18 input[type='radio'] { | 18 input[type='radio'] { |
| 19 -webkit-appearance: none; | 19 -webkit-appearance: none; |
| 20 -webkit-user-select: none; | |
| 21 background-image: -webkit-linear-gradient(#ededed, #ededed 38%, #dedede); | 20 background-image: -webkit-linear-gradient(#ededed, #ededed 38%, #dedede); |
| 22 border: 1px solid rgba(0, 0, 0, 0.25); | 21 border: 1px solid rgba(0, 0, 0, 0.25); |
| 23 border-radius: 2px; | 22 border-radius: 2px; |
| 24 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08), | 23 box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08), |
| 25 inset 0 1px 2px rgba(255, 255, 255, 0.75); | 24 inset 0 1px 2px rgba(255, 255, 255, 0.75); |
| 26 color: #444; | 25 color: #444; |
| 27 font: inherit; | 26 font: inherit; |
| 28 margin: 0 1px 0 0; | 27 margin: 0 1px 0 0; |
| 29 outline: none; | 28 outline: none; |
| 30 text-shadow: 0 1px 0 rgb(240, 240, 240); | 29 text-shadow: 0 1px 0 rgb(240, 240, 240); |
| 30 user-select: none; |
| 31 } | 31 } |
| 32 | 32 |
| 33 :-webkit-any(button, | 33 :-webkit-any(button, |
| 34 input[type='button'], | 34 input[type='button'], |
| 35 input[type='submit']):not(.custom-appearance), | 35 input[type='submit']):not(.custom-appearance), |
| 36 select { | 36 select { |
| 37 min-height: 2em; | 37 min-height: 2em; |
| 38 min-width: 4em; | 38 min-width: 4em; |
| 39 padding-top: 1px; | 39 padding-top: 1px; |
| 40 padding-bottom: 1px; | 40 padding-bottom: 1px; |
| (...skipping 70 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 111 input[type='search'] { | 111 input[type='search'] { |
| 112 -webkit-appearance: textfield; | 112 -webkit-appearance: textfield; |
| 113 /* NOTE: Keep a relatively high min-width for this so we don't obscure the end | 113 /* NOTE: Keep a relatively high min-width for this so we don't obscure the end |
| 114 * of the default text in relatively spacious languages (i.e. German). */ | 114 * of the default text in relatively spacious languages (i.e. German). */ |
| 115 min-width: 160px; | 115 min-width: 160px; |
| 116 } | 116 } |
| 117 | 117 |
| 118 /* Checked ********************************************************************/ | 118 /* Checked ********************************************************************/ |
| 119 | 119 |
| 120 input[type='checkbox']:checked::before { | 120 input[type='checkbox']:checked::before { |
| 121 -webkit-user-select: none; | |
| 122 background-image: url(../images/check.png); | 121 background-image: url(../images/check.png); |
| 123 background-size: 100% 100%; | 122 background-size: 100% 100%; |
| 124 content: ''; | 123 content: ''; |
| 125 display: block; | 124 display: block; |
| 126 height: 100%; | 125 height: 100%; |
| 126 user-select: none; |
| 127 width: 100%; | 127 width: 100%; |
| 128 } | 128 } |
| 129 | 129 |
| 130 input[type='radio']:checked::before { | 130 input[type='radio']:checked::before { |
| 131 background-color: #666; | 131 background-color: #666; |
| 132 border-radius: 100%; | 132 border-radius: 100%; |
| 133 bottom: 3px; | 133 bottom: 3px; |
| 134 content: ''; | 134 content: ''; |
| 135 display: block; | 135 display: block; |
| 136 left: 3px; | 136 left: 3px; |
| (...skipping 112 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 249 * | 249 * |
| 250 * <div class="checkbox"> | 250 * <div class="checkbox"> |
| 251 * <label> | 251 * <label> |
| 252 * <input type="checkbox"></input> | 252 * <input type="checkbox"></input> |
| 253 * <span> | 253 * <span> |
| 254 * </label> | 254 * </label> |
| 255 * </div> | 255 * </div> |
| 256 */ | 256 */ |
| 257 | 257 |
| 258 :-webkit-any(.checkbox, .radio) label { | 258 :-webkit-any(.checkbox, .radio) label { |
| 259 -webkit-user-select: none; | |
| 260 /* Don't expand horizontally: <http://crbug.com/112091>. */ | 259 /* Don't expand horizontally: <http://crbug.com/112091>. */ |
| 261 align-items: center; | 260 align-items: center; |
| 262 display: inline-flex; | 261 display: inline-flex; |
| 263 padding-bottom: 7px; | 262 padding-bottom: 7px; |
| 264 padding-top: 7px; | 263 padding-top: 7px; |
| 264 user-select: none; |
| 265 } | 265 } |
| 266 | 266 |
| 267 :-webkit-any(.checkbox, .radio) label input { | 267 :-webkit-any(.checkbox, .radio) label input { |
| 268 flex-shrink: 0; | 268 flex-shrink: 0; |
| 269 } | 269 } |
| 270 | 270 |
| 271 :-webkit-any(.checkbox, .radio) label input ~ span { | 271 :-webkit-any(.checkbox, .radio) label input ~ span { |
| 272 -webkit-margin-start: 0.6em; | 272 -webkit-margin-start: 0.6em; |
| 273 /* Make sure long spans wrap at the same horizontal position they start. */ | 273 /* Make sure long spans wrap at the same horizontal position they start. */ |
| 274 display: block; | 274 display: block; |
| 275 } | 275 } |
| 276 | 276 |
| 277 :-webkit-any(.checkbox, .radio) label:hover { | 277 :-webkit-any(.checkbox, .radio) label:hover { |
| 278 color: black; | 278 color: black; |
| 279 } | 279 } |
| 280 | 280 |
| 281 label > input:disabled:-webkit-any([type='checkbox'], [type='radio']) ~ span { | 281 label > input:disabled:-webkit-any([type='checkbox'], [type='radio']) ~ span { |
| 282 color: #999; | 282 color: #999; |
| 283 } | 283 } |
| 284 | 284 |
| 285 extensionview { | 285 extensionview { |
| 286 display: inline-block; | 286 display: inline-block; |
| 287 height: 300px; | 287 height: 300px; |
| 288 width: 300px; | 288 width: 300px; |
| 289 } | 289 } |
| OLD | NEW |