Index: third_party/polymer/components/paper-input/demo.html |
diff --git a/third_party/polymer/components/paper-input/demo.html b/third_party/polymer/components/paper-input/demo.html |
deleted file mode 100644 |
index 21bae3198ca0d02a9e9810c019e7b910efb05044..0000000000000000000000000000000000000000 |
--- a/third_party/polymer/components/paper-input/demo.html |
+++ /dev/null |
@@ -1,190 +0,0 @@ |
-<!-- |
- @license |
- Copyright (c) 2014 The Polymer Project Authors. All rights reserved. |
- This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt |
- The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt |
- The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt |
- Code distributed by Google as part of the polymer project is also |
- subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt |
---> |
-<!doctype html> |
-<html> |
-<head> |
- |
- <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes"> |
- |
- <title>paper-input</title> |
- |
- <script src="../webcomponentsjs/webcomponents.js"></script> |
- |
- <link href="../font-roboto/roboto.html" rel="import"> |
- <link href="paper-autogrow-textarea.html" rel="import"> |
- <link href="paper-input-decorator.html" rel="import"> |
- <link href="paper-input.html" rel="import"> |
- |
- <style shim-shadowdom> |
- |
- body { |
- font-family: RobotoDraft, 'Helvetica Neue', Helvetica, Arial; |
- font-size: 14px; |
- margin: 0; |
- padding: 24px; |
- -webkit-tap-highlight-color: rgba(0,0,0,0); |
- -webkit-touch-callout: none; |
- } |
- |
- section { |
- padding: 20px 0; |
- } |
- |
- section > div { |
- padding: 14px; |
- font-size: 16px; |
- } |
- |
- paper-input { |
- width: 80%; |
- } |
- |
- paper-input-decorator { |
- max-width: 80%; |
- } |
- |
- paper-input.narrow { |
- width: 150px; |
- } |
- |
- .custom /deep/ ::-webkit-input-placeholder { |
- color: #f4b400; |
- } |
- |
- .custom /deep/ ::-moz-placeholder { |
- color: #f4b400; |
- } |
- |
- .custom /deep/ :-ms-input-placeholder { |
- color: #f4b400; |
- } |
- |
- .custom /deep/ .label-text, |
- .custom /deep/ .error { |
- color: #f4b400; |
- } |
- |
- .custom /deep/ .unfocused-underline { |
- background-color: #f4b400; |
- } |
- |
- .custom[focused] /deep/ .floated-label .label-text { |
- color: #0f9d58; |
- } |
- |
- .custom /deep/ .focused-underline { |
- background-color: #0f9d58; |
- } |
- |
- .custom.invalid /deep/ .floated-label .label-text, |
- .custom /deep/ .error { |
- color: #f06292; |
- } |
- |
- .custom.invalid /deep/ .focused-underline { |
- background-color: #f06292; |
- } |
- |
- .custom { |
- color: #1a237e; |
- } |
- |
- </style> |
- |
-</head> |
-<body unresolved> |
- |
- <section> |
- |
- <div>Standalone</div> |
- |
- <br> |
- |
- <paper-input label="label"></paper-input> |
- |
- <br> |
- |
- <paper-input label="floating label" floatingLabel></paper-input> |
- |
- </section> |
- |
- <section> |
- |
- <div>Decorator</div> |
- |
- <br> |
- |
- <paper-input-decorator label="with core-input"> |
- <input is="core-input"> |
- </paper-input-decorator> |
- |
- <br> |
- |
- <paper-input-decorator label="with core-input + floatingLabel" floatingLabel> |
- <input is="core-input"> |
- </paper-input-decorator> |
- |
- <br> |
- |
- <paper-input-decorator label="with autogrowing text area"> |
- <paper-autogrow-textarea> |
- <textarea></textarea> |
- </paper-autogrow-textarea> |
- </paper-input-decorator> |
- |
- <br> |
- |
- <paper-input-decorator label="with autogrowing text area + floatingLabel" floatingLabel> |
- <paper-autogrow-textarea> |
- <textarea></textarea> |
- </paper-autogrow-textarea> |
- </paper-input-decorator> |
- |
- </section> |
- |
- <section id="validate"> |
- |
- <div>Validation</div> |
- |
- <button onclick="validateAll()">click me to validate all</button> |
- |
- <paper-input-decorator label="required" floatingLabel error="input is required!"> |
- <input is="core-input" required> |
- </paper-input-decorator> |
- |
- <script> |
- function validateAll() { |
- var $d = document.getElementById('validate').querySelectorAll('paper-input-decorator'); |
- Array.prototype.forEach.call($d, function(d) { |
- d.isInvalid = !d.querySelector('input').validity.valid; |
- }); |
- } |
- </script> |
- |
- </section> |
- |
- <section> |
- |
- <div>Custom styling</div> |
- |
- <br> |
- |
- <paper-input class="custom" label="paper-input"></paper-input> |
- |
- <br> |
- |
- <paper-input-decorator class="custom" label="decorator"> |
- <input is="core-input"> |
- </paper-input-decorator> |
- |
- </section> |
- |
-</body> |
-</html> |