| Index: third_party/polymer/v1_0/components-chromium/paper-toast/paper-toast.html
|
| diff --git a/third_party/polymer/v1_0/components-chromium/paper-toast/paper-toast.html b/third_party/polymer/v1_0/components-chromium/paper-toast/paper-toast.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..63489c810c99501c0840410927162ee283bc44c0
|
| --- /dev/null
|
| +++ b/third_party/polymer/v1_0/components-chromium/paper-toast/paper-toast.html
|
| @@ -0,0 +1,112 @@
|
| +<!--
|
| +@license
|
| +Copyright (c) 2015 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
|
| +--><html><head><link rel="import" href="../polymer/polymer.html">
|
| +<link rel="import" href="../iron-a11y-announcer/iron-a11y-announcer.html">
|
| +<link rel="import" href="../iron-overlay-behavior/iron-overlay-behavior.html">
|
| +
|
| +<!--
|
| +Material design: [Snackbars & toasts](https://www.google.com/design/spec/components/snackbars-toasts.html)
|
| +
|
| +`paper-toast` provides a subtle notification toast. Only one `paper-toast` will
|
| +be visible on screen.
|
| +
|
| +Use `opened` to show the toast:
|
| +
|
| +Example:
|
| +
|
| + <paper-toast text="Hello world!" opened></paper-toast>
|
| +
|
| +Also `open()` or `show()` can be used to show the toast:
|
| +
|
| +Example:
|
| +
|
| + <paper-button on-click="openToast">Open Toast</paper-button>
|
| + <paper-toast id="toast" text="Hello world!"></paper-toast>
|
| +
|
| + ...
|
| +
|
| + openToast: function() {
|
| + this.$.toast.open();
|
| + }
|
| +
|
| +Set `duration` to 0, a negative number or Infinity to persist the toast on screen:
|
| +
|
| +Example:
|
| +
|
| + <paper-toast text="Terms and conditions" opened duration="0">
|
| + <a href="#">Show more</a>
|
| + </paper-toast>
|
| +
|
| +
|
| +### Styling
|
| +The following custom properties and mixins are available for styling:
|
| +
|
| +Custom property | Description | Default
|
| +----------------|-------------|----------
|
| +`--paper-toast-background-color` | The paper-toast background-color | `#323232`
|
| +`--paper-toast-color` | The paper-toast color | `#f1f1f1`
|
| +
|
| +This element applies the mixin `--paper-font-common-base` but does not import `paper-styles/typography.html`.
|
| +In order to apply the `Roboto` font to this element, make sure you've imported `paper-styles/typography.html`.
|
| +
|
| +@group Paper Elements
|
| +@element paper-toast
|
| +@demo demo/index.html
|
| +@hero hero.svg
|
| +-->
|
| +
|
| +</head><body><dom-module id="paper-toast">
|
| + <template>
|
| + <style>
|
| + :host {
|
| + display: block;
|
| + position: fixed;
|
| + background-color: var(--paper-toast-background-color, #323232);
|
| + color: var(--paper-toast-color, #f1f1f1);
|
| + min-height: 48px;
|
| + min-width: 288px;
|
| + padding: 16px 24px;
|
| + box-sizing: border-box;
|
| + box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
|
| + border-radius: 2px;
|
| + margin: 12px;
|
| + font-size: 14px;
|
| + cursor: default;
|
| + -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
|
| + transition: transform 0.3s, opacity 0.3s;
|
| + opacity: 0;
|
| + -webkit-transform: translateY(100px);
|
| + transform: translateY(100px);
|
| + @apply --paper-font-common-base;
|
| + }
|
| +
|
| + :host(.capsule) {
|
| + border-radius: 24px;
|
| + }
|
| +
|
| + :host(.fit-bottom) {
|
| + width: 100%;
|
| + min-width: 0;
|
| + border-radius: 0;
|
| + margin: 0;
|
| + }
|
| +
|
| + :host(.paper-toast-open) {
|
| + opacity: 1;
|
| + -webkit-transform: translateY(0px);
|
| + transform: translateY(0px);
|
| + }
|
| + </style>
|
| +
|
| + <span id="label">{{text}}</span>
|
| + <slot></slot>
|
| + </template>
|
| +
|
| + </dom-module>
|
| +<script src="paper-toast-extracted.js"></script></body></html>
|
|
|
Chromium Code Reviews
Issue 2898303004:
[MD Bookmarks] Add toasts. (Closed)
