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

Side by Side Diff: third_party/polymer/components-chromium/paper-dialog/paper-dialog.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 Provides a dialog overlay.
12
13 Child elements that include a `dismissive` attribute are positioned in the lower left corner of the dialog. Elements that use the `affirmative` attribute are po sitioned in the lower right corner.
14
15 Child elements that include the `dismissive` or `affirmative` attribute will aut omatically toggle the dialog when clicked.
16
17 One child element should have the `autofocus` attribute so that the Enter key wi ll automatically take action. This is
18 especially important for screen reader environments.
19
20 Example:
21
22 <paper-dialog heading="Title for dialog">
23 <p>Lorem ipsum ....</p>
24 <p>Id qui scripta ...</p>
25 <paper-button label="More Info..." dismissive></paper-button>
26 <paper-button label="Decline" affirmative></paper-button>
27 <paper-button label="Accept" affirmative autofocus></paper-button>
28 </paper-dialog>
29
30 #### Transitions
31
32 `<paper-dialog>` can be used with `<paper-transition>` to transition the overlay open and close.
33
34 To use a transition, import `paper-dialog-transition.html` alongside paper-dialo g:
35
36 <link rel="import" href="paper-dialog/paper-dialog-transition.html">
37
38 Then set the `transition` attribute:
39
40 <paper-dialog heading="Title for dialog" transition="paper-transition-center ">
41
42 <paper-dialog heading="Title for dialog" transition="paper-transition-bottom ">
43
44 @group Paper Elements
45 @element paper-dialog
46 @homepage github.io
47 -->
48 <!--
49 Fired when the dialog's `opened` property changes.
50
51 @event core-overlay-open
52 @param {Object} detail
53 @param {Object} detail.opened the opened state
54 -->
55 <link href="../polymer/polymer.html" rel="import">
56 <link href="../core-overlay/core-overlay.html" rel="import">
57 <link href="../paper-shadow/paper-shadow.html" rel="import">
58
59 <polymer-element name="paper-dialog" attributes="opened heading transition autoC loseDisabled backdrop layered closeSelector" role="dialog" assetpath="">
60
61 <template>
62
63 <link href="paper-dialog.css" rel="stylesheet">
64
65 <div id="shadow">
66 <paper-shadow z="3" hasposition=""></paper-shadow>
67 </div>
68
69 <core-overlay id="overlay" opened="{{opened}}" autoclosedisabled?="{{autoClo seDisabled}}" backdrop?="{{backdrop}}" layered?="{{layered}}" target="{{}}" sizi ngtarget="{{$.container}}" closeselector="{{closeSelector}}" transition="{{trans ition}}" margin="20"></core-overlay>
70
71 <div id="container" layout="" vertical="">
72
73 <div id="actions" layout="" horizontal="">
74 <content select="[dismissive]"></content>
75 <div flex="" auto=""></div>
76 <content select="[affirmative]"></content>
77 </div>
78
79 <div id="main" flex="" auto="">
80 <h1>{{heading}}</h1>
81 <content></content>
82 </div>
83
84 </div>
85
86 </template>
87
88
89
90 </polymer-element>
91 <script src="paper-dialog-extracted.js"></script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698