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

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

Issue 592593002: Inline scripts were extracted from Polymer elements. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: s/echo ""/echo/ Created 6 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
(Empty)
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.g ithub.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/CONTRI BUTORS.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/PATEN TS.txt
8 -->
9
10 <!--
11 `paper-toggle-button` provides a ON/OFF switch that user can toggle the state
12 by tapping or by dragging the swtich.
13
14 Example:
15
16 <paper-toggle-button></paper-toggle-button>
17
18 Styling toggle button:
19
20 To change the ink color for checked state:
21
22 paper-toggle-button::shadow paper-radio-button::shadow #ink[checked] {
23 color: #4285f4;
24 }
25
26 To change the radio checked color:
27
28 paper-toggle-button::shadow paper-radio-button::shadow #onRadio {
29 background-color: #4285f4;
30 }
31
32 To change the bar color for checked state:
33
34 paper-toggle-button::shadow #toggleBar[checked] {
35 background-color: #4285f4;
36 }
37
38 To change the ink color for unchecked state:
39
40 paper-toggle-button::shadow paper-radio-button::shadow #ink {
41 color: #b5b5b5;
42 }
43
44 To change the radio unchecked color:
45
46 paper-toggle-button::shadow paper-radio-button::shadow #offRadio {
47 border-color: #b5b5b5;
48 }
49
50 To change the bar color for unchecked state:
51
52 paper-toggle-button::shadow #toggleBar {
53 background-color: red;
54 }
55
56 @group Paper Elements
57 @element paper-toggle-button
58 @homepage github.io
59 -->
60
61 <link rel="import" href="../paper-radio-button/paper-radio-button.html">
62
63 <polymer-element name="paper-toggle-button" attributes="checked" role="button" a ria-pressed="false" tabindex="0" assetpath="">
64 <template>
65
66 <link rel="stylesheet" href="paper-toggle-button.css">
67
68 <div id="toggleContainer">
69
70 <div id="toggleBar" checked?="{{checked}}"></div>
71
72 <paper-radio-button id="toggleRadio" toggles="" checked="{{checked}}" on-tra ckstart="{{trackStart}}" on-trackx="{{trackx}}" on-trackend="{{trackEnd}}"></pap er-radio-button>
73
74 </div>
75
76 </template>
77
78 </polymer-element>
79 <script src="paper-toggle-button-extracted.js"></script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698