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

Side by Side Diff: third_party/polymer/components-chromium/core-tooltip/core-tooltip.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 The `core-tooltip` element creates a hover tooltip centered for the content
12 it contains. It can be positioned on the top|bottom|left|right of content using
13 the `position` attribute.
14
15 To include HTML in the tooltip, include the `tip` attribute on the relevant
16 content.
17
18 <b>Example</b>:
19
20 <core-tooltip label="I'm a tooltip">
21 <span>Hover over me.</span>
22 </core-tooltip>
23
24 <b>Example</b> - positioning the tooltip to the right:
25
26 <core-tooltip label="I'm a tooltip to the right" position="right">
27 <polymer-ui-icon-button icon="drawer"></polymer-ui-icon-button>
28 </core-tooltip>
29
30 <b>Example</b> - no arrow and showing by default:
31
32 <core-tooltip label="Tooltip with no arrow and always on" noarrow show>
33 <img src="image.jpg">
34 </core-tooltip>
35
36 <b>Example</b> - rich tooltip using the `tip` attribute:
37
38 <core-tooltip>
39 <div>Example of a rich information tooltip</div>
40 <div tip>
41 <img src="profile.jpg">Foo <b>Bar</b> - <a href="#">@baz</a>
42 </div>
43 </core-tooltip>
44
45 @group Polymer Core Elements
46 @element core-tooltip
47 @homepage http://polymer.github.io/core-tooltip
48 -->
49
50 <link rel="import" href="../polymer/polymer.html">
51
52 <!-- TODO: would be nice to inherit from label to get .htmlFor, and .control,
53 but the latter is readonly. -->
54 <!-- TODO: support off center arrows. -->
55 <!-- TODO: detect mobile and apply the .large class, instead of manual
56 control. -->
57 <!-- TODO: possibly reuse core-overlay. -->
58 <polymer-element name="core-tooltip" attributes="noarrow position label show" ta bindex="0" assetpath="">
59 <template>
60
61 <link rel="stylesheet" href="core-tooltip.css">
62
63 <div id="tooltip" class="polymer-tooltip {{position}} {{ {noarrow: noarrow, sh ow: show} | tokenList}}">
64 <content select="[tip]">{{label}}</content>
65 </div>
66
67 <content></content>
68
69 </template>
70
71 </polymer-element>
72 <script src="core-tooltip-extracted.js"></script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698