1 /* 2 Copyright (c) 2014 The Polymer Project Authors. All rights reserved. 3 This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt 4 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 5 The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt 6 Code distributed by Google as part of the polymer project is also 7 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt 8 */ 9 10 :host { 11 display: inline-block; 12 white-space: nowrap; 13 } 14 15 :host(:focus) { 16 outline: none; 17 } 18 19 #radioContainer { 20 position: relative; 21 width: 16px; 22 height: 16px; 23 cursor: pointer; 24 } 25 26 #radioContainer.labeled { 27 display: inline-block; 28 vertical-align: middle; 29 } 30 31 #ink { 32 position: absolute; 33 top: -16px; 34 left: -16px; 35 width: 48px; 36 height: 48px; 37 color: #5a5a5a; 38 } 39 40 #ink[checked] { 41 color: #0f9d58; 42 } 43 44 #offRadio { 45 position: absolute; 46 top: 0px; 47 left: 0px; 48 width: 12px; 49 height: 12px; 50 border-radius: 50%; 51 border: solid 2px; 52 border-color: #5a5a5a; 53 } 54 55 #onRadio { 56 position: absolute; 57 top: 0; 58 left: 0; 59 width: 16px; 60 height: 16px; 61 border-radius: 50%; 62 background-color: #0f9d58; 63 -webkit-transform: scale(0); 64 transform: scale(0); 65 transition: -webkit-transform ease 0.28s; 66 transition: transform ease 0.28s; 67 } 68 69 #onRadio.fill { 70 -webkit-transform: scale(1.1); 71 transform: scale(1.1); 72 } 73 74 #radioLabel { 75 position: relative; 76 display: inline-block; 77 vertical-align: middle; 78 margin-left: 10px; 79 white-space: normal; 80 pointer-events: none; 81 } 82 83 #radioLabel[hidden] { 84 display: none; 85 } 86 87 /* disabled state */ 88 :host([disabled]) { 89 pointer-events: none; 90 } 91 92 :host([disabled]) #offRadio { 93 border-color: #eaeaea !important; 94 } 95 96 :host([disabled]) #onRadio { 97 background-color: #eaeaea !important; 98 } 99
