Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(232)

Side by Side Diff: third_party/polymer/v1_0/components-chromium/paper-radio-button/paper-radio-button.html

Issue 1363853002: Update Polymer (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: fix resources Created 5 years, 2 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <!-- 1 <!--
2 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. 2 Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
3 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt 3 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt
4 The complete set of authors may be found at http://polymer.github.io/AUTHORS.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/CONTRI BUTORS.txt 5 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt
6 Code distributed by Google as part of the polymer project is also 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/PATEN TS.txt 7 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt
8 --><html><head><link rel="import" href="../polymer/polymer.html"> 8 --><html><head><link rel="import" href="../polymer/polymer.html">
9 <link rel="import" href="../paper-ripple/paper-ripple.html"> 9 <link rel="import" href="../paper-ripple/paper-ripple.html">
10 <link rel="import" href="../paper-styles/default-theme.html"> 10 <link rel="import" href="../paper-styles/default-theme.html">
(...skipping 26 matching lines...) Expand all
37 `--paper-radio-button-checked-ink-color` | Selected/focus ripple color when the input is checked | `--default-primary-color` 37 `--paper-radio-button-checked-ink-color` | Selected/focus ripple color when the input is checked | `--default-primary-color`
38 `--paper-radio-button-label-color` | Label color | `--primary-text-color` 38 `--paper-radio-button-label-color` | Label color | `--primary-text-color`
39 39
40 @group Paper Elements 40 @group Paper Elements
41 @element paper-radio-button 41 @element paper-radio-button
42 @hero hero.svg 42 @hero hero.svg
43 @demo demo/index.html 43 @demo demo/index.html
44 --> 44 -->
45 45
46 </head><body><dom-module id="paper-radio-button"> 46 </head><body><dom-module id="paper-radio-button">
47 <template>
48 <style>
49 :host {
50 display: inline-block;
51 white-space: nowrap;
52 }
47 53
48 <link rel="import" type="css" href="paper-radio-button.css"> 54 :host(:focus) {
55 outline: none;
56 }
49 57
50 <template> 58 #radioContainer {
59 display: inline-block;
60 position: relative;
61 width: 16px;
62 height: 16px;
63 cursor: pointer;
64 vertical-align: middle;
65 }
66
67 :host #ink {
68 position: absolute;
69 top: -16px;
70 left: -16px;
71 width: 48px;
72 height: 48px;
73 color: var(--paper-radio-button-unchecked-ink-color, --primary-text-colo r);
74 opacity: 0.6;
75 pointer-events: none;
76 }
77
78 :host #ink[checked] {
79 color: var(--paper-radio-button-checked-ink-color, --default-primary-col or);
80 }
81
82 :host #offRadio {
83 position: absolute;
84 box-sizing: content-box;
85 top: 0px;
86 left: 0px;
87 width: 12px;
88 height: 12px;
89 border-radius: 50%;
90 border: solid 2px;
91 background-color: var(--paper-radio-button-unchecked-background-color, t ransparent);
92 border-color: var(--paper-radio-button-unchecked-color, --primary-text-c olor);
93 transition: border-color 0.28s;
94 }
95
96 :host #onRadio {
97 position: absolute;
98 box-sizing: content-box;
99 top: 4px;
100 left: 4px;
101 width: 8px;
102 height: 8px;
103 border-radius: 50%;
104 background-color: var(--paper-radio-button-checked-color, --default-prim ary-color);
105 -webkit-transform: scale(0);
106 transform: scale(0);
107 transition: -webkit-transform ease 0.28s;
108 transition: transform ease 0.28s;
109 }
110
111 :host([checked]) #offRadio {
112 border-color: var(--paper-radio-button-checked-color, --default-primary- color);
113 }
114
115 :host([checked]) #onRadio {
116 -webkit-transform: scale(1);
117 transform: scale(1);
118 }
119
120 #radioLabel {
121 position: relative;
122 display: inline-block;
123 vertical-align: middle;
124 margin-left: 10px;
125 white-space: normal;
126 pointer-events: none;
127 color: var(--paper-radio-button-label-color, --primary-text-color);
128 }
129
130 #radioLabel[hidden] {
131 display: none;
132 }
133
134 /* disabled state */
135 :host([disabled]) {
136 pointer-events: none;
137 }
138
139 :host([disabled]) #offRadio {
140 border-color: var(--paper-radio-button-unchecked-color, --primary-text-c olor);
141 opacity: 0.5;
142 }
143
144 :host([disabled][checked]) #onRadio {
145 background-color: var(--paper-radio-button-unchecked-color, --primary-te xt-color);
146 opacity: 0.5;
147 }
148
149 :host([disabled]) #radioLabel {
150 /* slightly darker than the button, so that it's readable */
151 opacity: 0.65;
152 }
153 </style>
51 154
52 <div id="radioContainer"> 155 <div id="radioContainer">
53 <div id="offRadio"></div> 156 <div id="offRadio"></div>
54 <div id="onRadio"></div> 157 <div id="onRadio"></div>
55 <paper-ripple id="ink" class="circle" center="" checked$="[[checked]]"></p aper-ripple> 158 <paper-ripple id="ink" class="circle" center="" checked$="[[checked]]"></p aper-ripple>
56 </div> 159 </div>
57 160
58 <div id="radioLabel"><content></content></div> 161 <div id="radioLabel"><content></content></div>
59 162
60 </template> 163 </template>
61 164
62 </dom-module> 165 </dom-module>
63 <script src="paper-radio-button-extracted.js"></script></body></html> 166 <script src="paper-radio-button-extracted.js"></script></body></html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698