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

Side by Side Diff: third_party/polymer/v0_8/components-chromium/paper-toggle-button/paper-toggle-button.css

Issue 1162563004: Upgrade to 1.0 and switch clients to dom-repeat where needed. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Fix a layout import and remove the gzipped webanimation in reproduce.sh Created 5 years, 6 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 @license 2 @license
3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. 3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt 4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt
5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt
7 Code distributed by Google as part of the polymer project is also 7 Code distributed by Google as part of the polymer project is also
8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt 8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt
9 */ 9 */
10 10
11 :host { 11 :host {
12 display: inline-block; 12 display: inline-block;
13 } 13 }
14 14
15 :host([disabled]) { 15 :host([disabled]) {
16 opacity: 0.3;
17 pointer-events: none; 16 pointer-events: none;
18 } 17 }
19 18
20 :host(:focus) { 19 :host(:focus) {
21 outline:none; 20 outline:none;
22 } 21 }
23 22
24 :host .toggle-bar { 23 :host .toggle-bar {
25 background-color: var(--paper-toggle-button-unchecked-bar-color); 24 background-color: var(--paper-toggle-button-unchecked-bar-color);
26 } 25 }
(...skipping 25 matching lines...) Expand all
52 width: 36px; 51 width: 36px;
53 height: 14px; 52 height: 14px;
54 } 53 }
55 54
56 #toggleBar { 55 #toggleBar {
57 position: absolute; 56 position: absolute;
58 height: 100%; 57 height: 100%;
59 width: 100%; 58 width: 100%;
60 border-radius: 8px; 59 border-radius: 8px;
61 pointer-events: none; 60 pointer-events: none;
62 opacity: 0.26; 61 opacity: 0.4;
63 transition: background-color linear .08s; 62 transition: background-color linear .08s;
64 } 63 }
65 64
66 :host([checked]) #toggleBar { 65 :host([checked]) #toggleBar {
67 opacity: 0.5; 66 opacity: 0.5;
68 } 67 }
69 68
69 :host([disabled]) #toggleBar {
70 background-color: #000;
71 opacity: 0.12;
72 }
73
70 #toggleButton { 74 #toggleButton {
71 position: absolute; 75 position: absolute;
72 top: -3px; 76 top: -3px;
73 height: 20px; 77 height: 20px;
74 width: 20px; 78 width: 20px;
75 border-radius: 50%; 79 border-radius: 50%;
76 box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.4); 80 box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.6);
77 transition: -webkit-transform linear .08s, background-color linear .08s; 81 transition: -webkit-transform linear .08s, background-color linear .08s;
78 transition: transform linear .08s, background-color linear .08s; 82 transition: transform linear .08s, background-color linear .08s;
83 will-change: transform;
79 } 84 }
80 85
81 #toggleButton.dragging { 86 #toggleButton.dragging {
82 -webkit-transition: none; 87 -webkit-transition: none;
83 transition: none; 88 transition: none;
84 } 89 }
85 90
86 :host([checked]) #toggleButton { 91 :host([checked]) #toggleButton {
87 -webkit-transform: translate(16px, 0); 92 -webkit-transform: translate(16px, 0);
88 transform: translate(16px, 0); 93 transform: translate(16px, 0);
89 } 94 }
90 95
96 :host([disabled]) #toggleButton {
97 background-color: #bdbdbd;
98 opacity: 1;
99 }
100
91 #ink { 101 #ink {
92 position: absolute; 102 position: absolute;
93 top: -14px; 103 top: -14px;
94 left: -14px; 104 left: -14px;
95 width: 48px; 105 width: 48px;
96 height: 48px; 106 height: 48px;
97 pointer-events: none; 107 opacity: 0.5;
98 } 108 }
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698