← Back to branch summary

~didrocks/+junk/face-detection-15.04

« back to all changes in this revision

Viewing changes to facedetection/www/bower_components/paper-tooltip/README.md

  • Committer: Didier Roche
  • Date: 2016-05-10 23:09:11 UTC
  • Revision ID: didier.roche@canonical.com-20160510230911-c7xr490zrj3yrzxd
New version

Show diffs side-by-side

added added

removed removed

Lines of Context:
facedetection/www/bower_components/paper-tooltip/README.md
 
1
 
 
2
<!---
 
3
 
 
4
This README is automatically generated from the comments in these files:
 
5
paper-tooltip.html
 
6
 
 
7
Edit those files, and our readme bot will duplicate them over here!
 
8
Edit this file, and the bot will squash your changes :)
 
9
 
 
10
The bot does some handling of markdown. Please file a bug if it does the wrong
 
11
thing! https://github.com/PolymerLabs/tedium/issues
 
12
 
 
13
-->
 
14
 
 
15
[![Build status](https://travis-ci.org/PolymerElements/paper-tooltip.svg?branch=master)](https://travis-ci.org/PolymerElements/paper-tooltip)
 
16
 
 
17
_[Demo and API docs](https://elements.polymer-project.org/elements/paper-tooltip)_
 
18
 
 
19
 
 
20
##&lt;paper-tooltip&gt;
 
21
 
 
22
Material design: [Tooltips](https://www.google.com/design/spec/components/tooltips.html)
 
23
 
 
24
`<paper-tooltip>` is a label that appears on hover and focus when the user
 
25
hovers over an element with the cursor or with the keyboard. It will be centered
 
26
to an anchor element specified in the `for` attribute, or, if that doesn't exist,
 
27
centered to the parent node containing it.
 
28
 
 
29
Example:
 
30
 
 
31
```html
 
32
<div style="display:inline-block">
 
33
  <button>Click me!</button>
 
34
  <paper-tooltip>Tooltip text</paper-tooltip>
 
35
</div>
 
36
 
 
37
<div>
 
38
  <button id="btn">Click me!</button>
 
39
  <paper-tooltip for="btn">Tooltip text</paper-tooltip>
 
40
</div>
 
41
```
 
42
 
 
43
The tooltip can be positioned on the top|bottom|left|right of the anchor using
 
44
the `position` attribute. The default position is bottom.
 
45
 
 
46
```html
 
47
<paper-tooltip for="btn" position="left">Tooltip text</paper-tooltip>
 
48
<paper-tooltip for="btn" position="top">Tooltip text</paper-tooltip>
 
49
```
 
50
 
 
51
### Styling
 
52
 
 
53
The following custom properties and mixins are available for styling:
 
54
 
 
55
| Custom property | Description | Default |
 
56
| --- | --- | --- |
 
57
| `--paper-tooltip-background` | The background color of the tooltip | `#616161` |
 
58
| `--paper-tooltip-opacity` | The opacity of the tooltip | `0.9` |
 
59
| `--paper-tooltip-text-color` | The text color of the tooltip | `white` |
 
60
| `--paper-tooltip` | Mixin applied to the tooltip | `{}` |
 
61
 
 
62