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

Unified Diff: third_party/polymer/v0_8/components-chromium/paper-toggle-button/paper-toggle-button.html

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, 7 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 side-by-side diff with in-line comments
Download patch
Index: third_party/polymer/v0_8/components-chromium/paper-toggle-button/paper-toggle-button.html
diff --git a/third_party/polymer/v0_8/components-chromium/paper-toggle-button/paper-toggle-button.html b/third_party/polymer/v0_8/components-chromium/paper-toggle-button/paper-toggle-button.html
index 203e9c19e4f34fb679bbd5f203455c9141b80bfb..dca8ed24fb2e1fb6ef4348a684845f3d02781d87 100644
--- a/third_party/polymer/v0_8/components-chromium/paper-toggle-button/paper-toggle-button.html
+++ b/third_party/polymer/v0_8/components-chromium/paper-toggle-button/paper-toggle-button.html
@@ -12,40 +12,43 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<!--
`paper-toggle-button` provides a ON/OFF switch that user can toggle the state
-by tapping or by dragging the swtich.
+by tapping or by dragging the switch.
Example:
<paper-toggle-button></paper-toggle-button>
-Styling toggle-button:
- <style is="x-style">
- * {
- --paper-toggle-button-unchecked-bar-color: #FF4081;
- --paper-toggle-button-unchecked-button-color: #9c27b0;
- --paper-toggle-button-unchecked-ink-color: #009688;
- --paper-toggle-button-checked-bar-color: #5677fc;
- --paper-toggle-button-checked-button-color: #ff4081;
- --paper-toggle-button-checked-ink-color: #ff4081;
- }
- </style>
+### Styling
+
+The following custom properties and mixins are available for styling:
+
+Custom property | Description | Default
+----------------|-------------|----------
+`--paper-toggle-button-unchecked-bar-color` | Slider color when the input is not checked | `#000000`
+`--paper-toggle-button-unchecked-button-color` | Button color when the input is not checked | `--paper-grey-50`
+`--paper-toggle-button-unchecked-ink-color` | Selected/focus ripple color when the input is not checked | `--dark-primary-color`
+`--paper-toggle-button-checked-bar-color` | Slider button color when the input is checked | `--google-green-500`
+`--paper-toggle-button-checked-button-color` | Button color when the input is checked | `--google-green-500`
+`--paper-toggle-button-checked-ink-color` | Selected/focus ripple color when the input is checked | `--google-green-500`
@group Paper Elements
@element paper-toggle-button
+@hero hero.svg
+@demo demo/index.html
-->
+<style is="custom-style">
+ :root {
+ --paper-toggle-button-unchecked-bar-color: #000000;
+ --paper-toggle-button-unchecked-button-color: var(--paper-grey-50);
+ --paper-toggle-button-unchecked-ink-color: var(--dark-primary-color);
-</head><body><dom-module id="paper-toggle-button">
+ --paper-toggle-button-checked-bar-color: var(--google-green-500);
+ --paper-toggle-button-checked-button-color: var(--google-green-500);
+ --paper-toggle-button-checked-ink-color: var(--google-green-500);
+ }
+</style>
- <style is="x-style">
- * {
- --paper-toggle-button-unchecked-bar-color: #000000;
- --paper-toggle-button-unchecked-button-color: #f1f1f1;
- --paper-toggle-button-unchecked-ink-color: #bbb;
- --paper-toggle-button-checked-bar-color: #0f9d58;
- --paper-toggle-button-checked-button-color: #0f9d58;
- --paper-toggle-button-checked-ink-color: #0f9d58;
- }
- </style>
+</head><body><dom-module id="paper-toggle-button">
<link rel="import" type="css" href="paper-toggle-button.css">

Powered by Google App Engine
This is Rietveld 408576698