| Index: third_party/polymer/components/core-tooltip/demo.html
|
| diff --git a/third_party/polymer/components/core-tooltip/demo.html b/third_party/polymer/components/core-tooltip/demo.html
|
| deleted file mode 100644
|
| index bdb7b8c1ba661fc8c0e2adc866a0e52efefbba53..0000000000000000000000000000000000000000
|
| --- a/third_party/polymer/components/core-tooltip/demo.html
|
| +++ /dev/null
|
| @@ -1,171 +0,0 @@
|
| -<!doctype html>
|
| -<html lang="en">
|
| -<head>
|
| -
|
| - <meta charset="utf-8">
|
| - <title>Core Tooltip</title>
|
| -
|
| - <script src="../platform/platform.js"></script>
|
| -
|
| - <link rel="import" href="core-tooltip.html">
|
| -
|
| - <style>
|
| - body {
|
| - font-family: "Open Sans", sans-serif;
|
| - font-weight: 300;
|
| - padding: 24px;
|
| - }
|
| -
|
| - section {
|
| - display: flex;
|
| - justify-content: center;
|
| - align-items: center;
|
| - }
|
| -
|
| - .example {
|
| - margin: 35px 15px;
|
| - }
|
| -
|
| - .example > * {
|
| - margin: 0 15px;
|
| - }
|
| -
|
| - .fakebutton {
|
| - box-shadow: 0 0 3px #aaa inset;
|
| - border-radius: 3px;
|
| - padding: 7px 5px;
|
| - }
|
| - .fakebutton:hover {
|
| - background-color: white;
|
| - }
|
| -
|
| - img {
|
| - width: 400px;
|
| - height: 150px;
|
| - object-fit: cover;
|
| - }
|
| -
|
| - img.large {
|
| - border: 15px solid white;
|
| - box-sizing: border-box;
|
| - }
|
| -
|
| - .profile {
|
| - width: 60px;
|
| - height: auto;
|
| - border-radius: 50%;
|
| - vertical-align: middle;
|
| - }
|
| -
|
| - a {
|
| - color: currentcolor;
|
| - text-decoration: none;
|
| - }
|
| -
|
| - .rich {
|
| - background: hotpink;
|
| - color: white;
|
| - padding:20px;
|
| - border-radius: 5px;
|
| - }
|
| -
|
| - core-tooltip.fancy::shadow .polymer-tooltip {
|
| - opacity: 0;
|
| - -webkit-transition: all 300ms cubic-bezier(0,1.92,.99,1.07);
|
| - transition: all 300ms cubic-bezier(0,1.92,.99,1.07);
|
| - -webkit-transform: translate3d(0, -10px, 0);
|
| - transform: translate3d(0, -10px, 0);
|
| - }
|
| -
|
| - core-tooltip.fancy:hover::shadow .polymer-tooltip,
|
| - core-tooltip.fancy:focus::shadow .polymer-tooltip {
|
| - opacity: 1;
|
| - -webkit-transform: translate3d(0, 0, 0);
|
| - transform: translate3d(0, 0, 0);
|
| - }
|
| - </style>
|
| - <style shim-shadowdom2>
|
| - .on /deep/ .polymer-tooltip {
|
| - visibility: visible;
|
| - }
|
| - </style>
|
| -
|
| -</head>
|
| -<body unresolved>
|
| -
|
| - <article onclick="this.classList.toggle('on');">
|
| -
|
| - <em>click the page to toggle all examples...</em>
|
| -
|
| - <section class="small">
|
| -
|
| - <div class="example">
|
| -
|
| - <core-tooltip label='position="left"' position="left">
|
| - <div class="fakebutton">|||</div>
|
| - </core-tooltip>
|
| -
|
| - <core-tooltip label='position="top"' position="top">
|
| - <div class="fakebutton">|||</div>
|
| - </core-tooltip>
|
| -
|
| - <core-tooltip label='position="bottom"' position="bottom">
|
| - <div class="fakebutton">|||</div>
|
| - </core-tooltip>
|
| -
|
| - <core-tooltip label='position="right"' position="right">
|
| - <div class="fakebutton">|||</div>
|
| - </core-tooltip>
|
| -
|
| - </div>
|
| -
|
| - <div class="example">
|
| -
|
| - <core-tooltip label="Fancy effect" class="fancy">
|
| - <img src="https://pbs.twimg.com/profile_images/378800000548263523/c110b0a4c3e3e4d3dcce1d2020f3eded.jpeg
|
| - " class="profile">
|
| - </core-tooltip>
|
| -
|
| - </div>
|
| -
|
| - </section>
|
| -
|
| - <section>
|
| -
|
| - <div class="example">
|
| -
|
| - <core-tooltip>
|
| - <div class="rich">Rich tooltip with HTML</div>
|
| - <div tip>
|
| - <img src="https://pbs.twimg.com/profile_images/378800000548263523/c110b0a4c3e3e4d3dcce1d2020f3eded.jpeg
|
| - " class="profile" style="width: 40px;margin-right: 8px;">Eric <b>Bidelman</b> - <a href="#">@ebidel</a></div>
|
| - </core-tooltip>
|
| -
|
| - </div>
|
| -
|
| - <div class="example">
|
| -
|
| - <core-tooltip label="<core-tooltip large>" large>
|
| - Larger tooltips for mobile
|
| - </core-tooltip>
|
| -
|
| - </div>
|
| -
|
| - </section>
|
| -
|
| - <section>
|
| -
|
| - <div class="example">
|
| -
|
| - <core-tooltip label="Tooltip with no arrow and always on: <core-tooltip noarrow show>" position="bottom" noarrow show>
|
| - <img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/building.jpg" class="large">
|
| - </core-tooltip>
|
| -
|
| - </div>
|
| -
|
| - </section>
|
| -
|
| - </article>
|
| -
|
| -</body>
|
| -</html>
|
|
|