Commit 6cce0138 authored by Pascal Hartig's avatar Pascal Hartig Committed by Sindre Sorhus

Bump Polymer dependencies

parent 2b868b1a
......@@ -3,7 +3,8 @@
"dependencies": {
"jquery": "~2.1.0",
"bootstrap": "~3.2.0",
"paper-tabs": "Polymer/paper-tabs#~0.4.0"
"paper-tabs": "polymerelements/paper-tabs#~1.0.10",
"iron-pages": "polymerelements/iron-pages#~1.0.3"
},
"devDependencies": {
"prefixfree": "91790e8aff6d807cd62018479db2307e1972b92a"
......
{
"name": "core-selection",
"private": true,
"dependencies": {
"polymer": "Polymer/polymer#^0.4.0"
},
"devDependencies": {
"polymer-test-tools": "Polymer/polymer-test-tools#master"
},
"homepage": "https://github.com/Polymer/core-selection",
"version": "0.4.1",
"_release": "0.4.1",
"_resolution": {
"type": "version",
"tag": "0.4.1",
"commit": "dd6919363a49f1f4ff52fa0dffef88e2bdfbbfdc"
},
"_source": "git://github.com/Polymer/core-selection.git",
"_target": "^0.4.0",
"_originalSource": "Polymer/core-selection"
}
\ No newline at end of file
core-selection
==============
See the [component page](http://polymer-project.org/docs/elements/core-elements.html#core-selection) for more information.
{
"name": "core-selection",
"private": true,
"dependencies": {
"polymer": "Polymer/polymer#^0.4.0"
},
"devDependencies": {
"polymer-test-tools": "Polymer/polymer-test-tools#master"
}
}
\ No newline at end of file
<!--
Copyright (c) 2014 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
-->
<!--
@group Polymer Core Elements
The `<core-selection>` element is used to manage selection state. It has no
visual appearance and is typically used in conjunction with another element.
For example, [core-selector](#core-selector)
use a `<core-selection>` to manage selection.
To mark an item as selected, call the `select(item)` method on
`<core-selection>`. The item itself is an argument to this method.
The `<core-selection>`element manages selection state for any given set of
items. When an item is selected, the `core-select` event is fired.
The attribute `multi` indicates if multiple items can be selected at once.
Example:
<polymer-element name="selection-example">
<template>
<style>
polyfill-next-selector { content: ':host > .selected'; }
::content > .selected {
font-weight: bold;
font-style: italic;
}
</style>
<ul on-tap="{{itemTapAction}}">
<content></content>
</ul>
<core-selection id="selection" multi
on-core-select="{{selectAction}}"></core-selection>
</template>
<script>
Polymer('selection-example', {
itemTapAction: function(e, detail, sender) {
this.$.selection.select(e.target);
},
selectAction: function(e, detail, sender) {
detail.item.classList.toggle('selected', detail.isSelected);
}
});
</script>
</polymer-element>
<selection-example>
<li>Red</li>
<li>Green</li>
<li>Blue</li>
</selection-example>
@element core-selection
-->
<!--
Fired when an item's selection state is changed. This event is fired both
when an item is selected or deselected. The `isSelected` detail property
contains the selection state.
@event core-select
@param {Object} detail
@param {boolean} detail.isSelected true for selection and false for de-selection
@param {Object} detail.item the item element
-->
<link rel="import" href="../polymer/polymer.html">
<polymer-element name="core-selection" attributes="multi" hidden>
<script>
Polymer('core-selection', {
/**
* If true, multiple selections are allowed.
*
* @attribute multi
* @type boolean
* @default false
*/
multi: false,
ready: function() {
this.clear();
},
clear: function() {
this.selection = [];
},
/**
* Retrieves the selected item(s).
* @method getSelection
* @returns Returns the selected item(s). If the multi property is true,
* getSelection will return an array, otherwise it will return
* the selected item or undefined if there is no selection.
*/
getSelection: function() {
return this.multi ? this.selection : this.selection[0];
},
/**
* Indicates if a given item is selected.
* @method isSelected
* @param {any} item The item whose selection state should be checked.
* @returns Returns true if `item` is selected.
*/
isSelected: function(item) {
return this.selection.indexOf(item) >= 0;
},
setItemSelected: function(item, isSelected) {
if (item !== undefined && item !== null) {
if (isSelected) {
this.selection.push(item);
} else {
var i = this.selection.indexOf(item);
if (i >= 0) {
this.selection.splice(i, 1);
}
}
this.fire("core-select", {isSelected: isSelected, item: item});
}
},
/**
* Set the selection state for a given `item`. If the multi property
* is true, then the selected state of `item` will be toggled; otherwise
* the `item` will be selected.
* @method select
* @param {any} item: The item to select.
*/
select: function(item) {
if (this.multi) {
this.toggle(item);
} else if (this.getSelection() !== item) {
this.setItemSelected(this.getSelection(), false);
this.setItemSelected(item, true);
}
},
/**
* Toggles the selection state for `item`.
* @method toggle
* @param {any} item: The item to toggle.
*/
toggle: function(item) {
this.setItemSelected(item, !this.isSelected(item));
}
});
</script>
</polymer-element>
<!DOCTYPE html>
<!--
Copyright (c) 2014 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>
<title>Selection</title>
<script src="../platform/platform.js"></script>
<link rel="import" href="core-selection.html">
</head>
<body unresolved>
<polymer-element name="selection-example">
<template>
<style>
polyfill-next-selector { content: 'ul > *'; }
::content > * {
cursor: pointer;
}
polyfill-next-selector { content: 'ul > .selected'; }
::content > .selected {
font-weight: bold;
font-style: italic;
}
</style>
<ul on-tap="{{itemTapAction}}">
<content></content>
</ul>
<core-selection id="selection" multi on-core-select="{{selectAction}}"></core-selection>
</template>
<script>
Polymer('selection-example', {
itemTapAction: function(e, detail, sender) {
this.$.selection.select(e.target);
},
selectAction: function(e, detail, sender) {
detail.item.classList.toggle('selected', detail.isSelected);
}
});
</script>
</polymer-element>
<selection-example>
<li>Red</li>
<li>Green</li>
<li>Blue</li>
</selection-example>
</body>
</html>
<!doctype html>
<!--
Copyright (c) 2014 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
The complete set of authors may be found at http://polymer.github.io/AUTHORS
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS
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
-->
<html>
<head>
<script src="../platform/platform.js"></script>
<link rel="import" href="../core-component-page/core-component-page.html">
</head>
<body unresolved>
<core-component-page></core-component-page>
</body>
</html>
{
"name": "core-selector",
"private": true,
"dependencies": {
"polymer": "Polymer/polymer#^0.4.0",
"core-selection": "Polymer/core-selection#^0.4.0"
},
"devDependencies": {
"polymer-test-tools": "Polymer/polymer-test-tools#master"
},
"homepage": "https://github.com/Polymer/core-selector",
"version": "0.4.1",
"_release": "0.4.1",
"_resolution": {
"type": "version",
"tag": "0.4.1",
"commit": "7d2a5d5b127d0ed3feb7bcb0bdaaeb95c4499cc9"
},
"_source": "git://github.com/Polymer/core-selector.git",
"_target": "^0.4.0",
"_originalSource": "Polymer/core-selector"
}
\ No newline at end of file
core-selector
==============
See the [component page](http://polymer-project.org/docs/elements/core-elements.html#core-selector) for more information.
{
"name": "core-selector",
"private": true,
"dependencies": {
"polymer": "Polymer/polymer#^0.4.0",
"core-selection": "Polymer/core-selection#^0.4.0"
},
"devDependencies": {
"polymer-test-tools": "Polymer/polymer-test-tools#master"
}
}
\ No newline at end of file
This diff is collapsed.
<!DOCTYPE html>
<!--
Copyright (c) 2014 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>
<title>Selector</title>
<script src="../platform/platform.js"></script>
<link rel="import" href="core-selector.html">
</head>
<body unresolved>
<polymer-element name="selector-examples">
<template>
<style>
.list {
display: block;
border: 1px solid #ccc;
border-bottom: none;
background: #666;
color: white;
list-style: none;
margin: 0;
padding: 0;
}
.list > * {
height: 40px;
line-height: 40px;
padding: 0 20px;
border-bottom: 1px solid #ccc;
}
.list > *.core-selected {
background: #333;
}
li {
height: 30px;
}
li.core-selected:after {
content: "\2713";
position: absolute;
padding-left: 10px;
}
</style>
<h2>basic</h2>
<core-selector class="list" selected="0">
<div>Item 0</div>
<div>Item 1</div>
<div>Item 2</div>
<div>Item 3</div>
<div>Item 4</div>
</core-selector>
<h2>multi-selection</h2>
<core-selector class="list" selected="{{multiSelected}}" multi>
<div>Item 0</div>
<div>Item 1</div>
<div>Item 2</div>
<div>Item 3</div>
<div>Item 4</div>
</core-selector>
<h2>list</h2>
<core-selector target="{{$.list}}" selected="0"></core-selector>
<ul id="list">
<li>Item 0</li>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
</ul>
<h2>binding of a group of radio buttons to a variable</h2>
<core-selector target="{{$.myForm}}" itemsSelector="input[type=radio]"
selected="{{color}}" valueattr="value" selectedProperty="checked"
activateEvent="change"></core-selector>
<form id="myForm">
<label><input type="radio" name="color" value="red"> Red</label> <br>
<label><input type="radio" name="color" value="green"> Green</label> <br>
<label><input type="radio" name="color" value="blue"> Blue</label> <br>
<p>color = {{color}}</p>
</form>
</template>
<script>
Polymer('selector-examples', {
ready: function() {
this.multiSelected = [1, 3];
this.color = 'green';
}
});
</script>
</polymer-element>
<selector-examples></selector-examples>
</body>
</html>
<!doctype html>
<!--
Copyright (c) 2014 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
The complete set of authors may be found at http://polymer.github.io/AUTHORS
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS
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
-->
<html>
<head>
<script src="../platform/platform.js"></script>
<link rel="import" href="../core-component-page/core-component-page.html">
</head>
<body unresolved>
<core-component-page></core-component-page>
</body>
</html>
<!--
@license
Copyright (c) 2014 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
-->
<x-meta id="core-selector" label="Selector" group="Core" isContainer>
<template>
<core-selector selected="0" style="width:100%;height:50px;"></core-selector>
</template>
<template>
<link rel="import" href="core-selector.html">
</template>
</x-meta>
\ No newline at end of file
This diff is collapsed.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
{
"name": "paper-ripple",
"version": "1.0.4",
"license": "http://polymer.github.io/LICENSE.txt",
"description": "Adds a material design ripple to any container",
"private": true,
"authors": [
"The Polymer Authors"
],
"keywords": [
"web-components",
"polymer",
"ripple"
],
"repository": {
"type": "git",
"url": "git://github.com/PolymerElements/paper-ripple.git"
},
"main": "paper-ripple.html",
"dependencies": {
"core-icon": "Polymer/core-icon#^0.4.0",
"core-icons": "Polymer/core-icons#^0.4.0",
"font-roboto": "Polymer/font-roboto#^0.4.0"
"polymer": "Polymer/polymer#^1.1.0",
"iron-a11y-keys-behavior": "polymerelements/iron-a11y-keys-behavior#^1.0.0"
},
"devDependencies": {
"polymer-test-tools": "Polymer/polymer-test-tools"
"iron-component-page": "polymerelements/iron-component-page#^1.0.0",
"iron-icon": "polymerelements/iron-icon#^1.0.0",
"iron-icons": "polymerelements/iron-icons#^1.0.0",
"paper-styles": "polymerelements/paper-styles#^1.0.0",
"test-fixture": "polymerelements/test-fixture#^1.0.0",
"web-component-tester": "*",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0"
},
"homepage": "https://github.com/Polymer/paper-ripple",
"version": "0.4.1",
"_release": "0.4.1",
"homepage": "https://github.com/PolymerElements/paper-ripple",
"_release": "1.0.4",
"_resolution": {
"type": "version",
"tag": "0.4.1",
"commit": "1a6458e7495c8f640651a5c42019f51eeb458e29"
"tag": "v1.0.4",
"commit": "5f5893ca7bd6a8413d2f777c092a1a179b6bd45e"
},
"_source": "git://github.com/Polymer/paper-ripple.git",
"_target": "^0.4.0",
"_originalSource": "Polymer/paper-ripple"
"_source": "git://github.com/PolymerElements/paper-ripple.git",
"_target": "^1.0.0",
"_originalSource": "PolymerElements/paper-ripple"
}
\ No newline at end of file
paper-ripple
============
See the [component page](http://www.polymer-project.org/docs/elements/paper-elements.html#paper-ripple) for more information.
`paper-ripple` provides a visual effect that other paper elements can
use to simulate a rippling effect emanating from the point of contact. The
effect can be visualized as a concentric circle with motion.
Example:
```html
<paper-ripple></paper-ripple>
```
`paper-ripple` listens to "mousedown" and "mouseup" events so it would display ripple
effect when touches on it. You can also defeat the default behavior and
manually route the down and up actions to the ripple element. Note that it is
important if you call downAction() you will have to make sure to call
upAction() so that `paper-ripple` would end the animation loop.
Example:
```html
<paper-ripple id="ripple" style="pointer-events: none;"></paper-ripple>
...
<script>
downAction: function(e) {
this.$.ripple.downAction({x: e.x, y: e.y});
},
upAction: function(e) {
this.$.ripple.upAction();
}
</script>
```
Styling ripple effect:
Use CSS color property to style the ripple:
```css
paper-ripple {
color: #4285f4;
}
```
Note that CSS color property is inherited so it is not required to set it on
the `paper-ripple` element directly.
By default, the ripple is centered on the point of contact. Apply the ``recenters`` attribute to have the ripple grow toward the center of its container.
```html
<paper-ripple recenters></paper-ripple>
```
Apply `center` to center the ripple inside its container from the start.
```html
<paper-ripple center></paper-ripple>
```
Apply `circle` class to make the rippling effect within a circle.
```html
<paper-ripple class="circle"></paper-ripple>
```
{
"name": "paper-ripple",
"version": "1.0.4",
"license": "http://polymer.github.io/LICENSE.txt",
"description": "Adds a material design ripple to any container",
"private": true,
"authors": [
"The Polymer Authors"
],
"keywords": [
"web-components",
"polymer",
"ripple"
],
"repository": {
"type": "git",
"url": "git://github.com/PolymerElements/paper-ripple.git"
},
"main": "paper-ripple.html",
"dependencies": {
"core-icon": "Polymer/core-icon#^0.4.0",
"core-icons": "Polymer/core-icons#^0.4.0",
"font-roboto": "Polymer/font-roboto#^0.4.0"
"polymer": "Polymer/polymer#^1.1.0",
"iron-a11y-keys-behavior": "polymerelements/iron-a11y-keys-behavior#^1.0.0"
},
"devDependencies": {
"polymer-test-tools": "Polymer/polymer-test-tools"
"iron-component-page": "polymerelements/iron-component-page#^1.0.0",
"iron-icon": "polymerelements/iron-icon#^1.0.0",
"iron-icons": "polymerelements/iron-icons#^1.0.0",
"paper-styles": "polymerelements/paper-styles#^1.0.0",
"test-fixture": "polymerelements/test-fixture#^1.0.0",
"web-component-tester": "*",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0"
}
}
<!--
@license
Copyright (c) 2014 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
-->
<!doctype html>
<html>
<head>
<title>paper-ripple</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<script src="../platform/platform.js"></script>
<link rel="import" href="../core-icons/core-icons.html">
<link rel="import" href="paper-ripple.html">
<link rel="import" href="../font-roboto/roboto.html">
<link rel="import" href="../core-icon/core-icon.html">
<style shim-shadowdom>
body {
background-color: #f9f9f9;
font-family: RobotoDraft, 'Helvetica Neue', Helvetica, Arial;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-touch-callout: none;
}
section {
padding: 30px 25px;
}
section > * {
margin: 10px
}
/* Button */
.button {
display: inline-block;
position: relative;
width: 120px;
height: 32px;
line-height: 32px;
border-radius: 2px;
font-size: 0.9em;
background-color: #fff;
color: #646464;
}
.button > paper-ripple {
border-radius: 2px;
overflow: hidden;
}
.button.narrow {
width: 60px;
}
.button.grey {
background-color: #eee;
}
.button.blue {
background-color: #4285f4;
color: #fff;
}
.button.green {
background-color: #0f9d58;
color: #fff;
}
.button.raised {
transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
transition-delay: 0.2s;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
}
.button.raised:active {
box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2);
transition-delay: 0s;
}
/* Icon Button */
.icon-button {
position: relative;
display: inline-block;
width: 56px;
height: 56px;
}
.icon-button > core-icon {
margin: 16px;
transition: -webkit-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.icon-button:hover > core-icon {
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
.icon-button > paper-ripple {
overflow: hidden;
color: #646464;
}
.icon-button.red > core-icon::shadow path {
fill: #db4437;
}
.icon-button.red > paper-ripple {
color: #db4437;
}
.icon-button.blue > core-icon::shadow path {
fill: #4285f4;
}
.icon-button.blue > paper-ripple {
color: #4285f4;
}
/* FAB */
.fab {
position: relative;
display: inline-block;
width: 56px;
height: 56px;
border-radius: 50%;
color: #fff;
overflow: hidden;
transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
transition-delay: 0.2s;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
}
.fab.red {
background-color: #d23f31;
}
.fab.blue {
background-color: #4285f4;
}
.fab.green {
background-color: #0f9d58;
}
.fab:active {
box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2);
transition-delay: 0s;
}
.fab > core-icon {
margin: 16px;
}
.fab > core-icon::shadow path {
fill: #fff;
}
/* Menu */
.menu {
display: inline-block;
width: 180px;
background-color: #fff;
box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2);
}
.item {
position: relative;
height: 48px;
line-height: 48px;
color: #646464;
font-size: 0.9em;
}
.menu.blue > .item {
color: #4285f4;
}
/* Card, Dialog */
.card, .dialog {
position: relative;
display: inline-block;
width: 300px;
height: 240px;
vertical-align: top;
background-color: #fff;
box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24);
}
.dialog {
box-sizing: border-box;
padding: 16px;
}
.dialog > .content {
height: 170px;
font-size: 0.9em;
}
.dialog > .content > .title {
font-size: 1.3em;
}
.dialog > .button {
width: 90px;
float: right;
}
.card.image {
background: url(http://lorempixel.com/300/240/nature/);
color: #fff;
}
/* Misc */
.center {
text-align: center;
}
.label {
padding: 0 16px;
}
.label-blue {
color: #4285f4;
}
.label-red {
color: #d23f31;
}
</style>
</head>
<body unresolved>
<section>
<div class="button raised">
<div class="center" fit>SUBMIT</div>
<paper-ripple fit></paper-ripple>
</div>
<div class="button raised grey">
<div class="center" fit>CANCEL</div>
<paper-ripple fit></paper-ripple>
</div>
<div class="button raised blue">
<div class="center" fit>COMPOSE</div>
<paper-ripple fit></paper-ripple>
</div>
<div class="button raised green">
<div class="center" fit>OK</div>
<paper-ripple fit></paper-ripple>
</div>
</section>
<section>
<div class="button raised grey narrow">
<div class="center" fit>+1</div>
<paper-ripple fit></paper-ripple>
</div>
<div class="button raised grey narrow label-blue">
<div class="center" fit>+1</div>
<paper-ripple fit></paper-ripple>
</div>
<div class="button raised grey narrow label-red">
<div class="center" fit>+1</div>
<paper-ripple fit></paper-ripple>
</div>
</section>
<section>
<div class="icon-button">
<core-icon icon="menu"></core-icon>
<paper-ripple class="circle recenteringTouch" fit></paper-ripple>
</div>
<div class="icon-button">
<core-icon icon="more-vert"></core-icon>
<paper-ripple class="circle recenteringTouch" fit></paper-ripple>
</div>
<div class="icon-button red">
<core-icon icon="delete"></core-icon>
<paper-ripple class="circle recenteringTouch" fit></paper-ripple>
</div>
<div class="icon-button blue">
<core-icon icon="account-box"></core-icon>
<paper-ripple class="circle recenteringTouch" fit></paper-ripple>
</div>
</section>
<section>
<div class="fab red">
<core-icon icon="add"></core-icon>
<paper-ripple class="circle recenteringTouch" fit></paper-ripple>
</div>
<div class="fab blue">
<core-icon icon="mail"></core-icon>
<paper-ripple class="circle recenteringTouch" fit></paper-ripple>
</div>
<div class="fab green">
<core-icon icon="create"></core-icon>
<paper-ripple class="circle recenteringTouch" fit></paper-ripple>
</div>
</section>
<section>
<div class="menu">
<div class="item">
<div class="label" fit>Mark as unread</div>
<paper-ripple fit></paper-ripple>
</div>
<div class="item">
<div class="label" fit>Mark as important</div>
<paper-ripple fit></paper-ripple>
</div>
<div class="item">
<div class="label" fit>Add to Tasks</div>
<paper-ripple fit></paper-ripple>
</div>
<div class="item">
<div class="label" fit>Create event</div>
<paper-ripple fit></paper-ripple>
</div>
</div>
<div class="menu blue">
<div class="item">
<div class="label" fit>Import</div>
<paper-ripple fit></paper-ripple>
</div>
<div class="item">
<div class="label" fit>Export</div>
<paper-ripple fit></paper-ripple>
</div>
<div class="item">
<div class="label" fit>Print</div>
<paper-ripple fit></paper-ripple>
</div>
<div class="item">
<div class="label" fit>Restore contacts</div>
<paper-ripple fit></paper-ripple>
</div>
</div>
</section>
<section>
<div class="dialog">
<div class="content">
<div class="title">Permission</div><br>
<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</div>
</div>
<div class="button label-blue">
<div class="center" fit>ACCEPT</div>
<paper-ripple fit></paper-ripple>
</div>
<div class="button">
<div class="center" fit>DECLINE</div>
<paper-ripple fit></paper-ripple>
</div>
</div>
<div class="card">
<paper-ripple class="recenteringTouch" fit></paper-ripple>
</div>
<div class="card image">
<paper-ripple class="recenteringTouch" fit></paper-ripple>
</div>
</section>
</body>
</html>
<!doctype html>
<!--
Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
@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
The complete set of authors may be found at http://polymer.github.io/AUTHORS
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS
......@@ -10,13 +11,17 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<html>
<head>
<script src="../platform/platform.js"></script>
<link rel="import" href="../core-component-page/core-component-page.html">
<title>paper-ripple</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<script src="../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../iron-component-page/iron-component-page.html">
</head>
<body unresolved>
<body>
<core-component-page></core-component-page>
<iron-component-page></iron-component-page>
</body>
</html>
<!--
@license
Copyright (c) 2014 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
-->
<x-meta id="paper-ripple" label="Ripple" group="Paper">
<template>
<paper-ripple style="width: 300px; height: 300px;"></paper-ripple>
</template>
<template id="imports">
<link rel="import" href="paper-ripple.html">
</template>
</x-meta>
This diff is collapsed.
{
"name": "paper-tabs",
"private": true,
"dependencies": {
"core-icons": "Polymer/core-icons#^0.4.0",
"core-selector": "Polymer/core-selector#^0.4.0",
"core-toolbar": "Polymer/core-toolbar#^0.4.0",
"font-roboto": "Polymer/font-roboto#^0.4.0",
"paper-icon-button": "Polymer/paper-icon-button#^0.4.0",
"paper-ripple": "Polymer/paper-ripple#^0.4.0"
},
"homepage": "https://github.com/Polymer/paper-tabs",
"version": "0.4.1",
"_release": "0.4.1",
"_resolution": {
"type": "version",
"tag": "0.4.1",
"commit": "c4ab5a81bd0c9bf96f9d24eb45b53a31910f210f"
},
"_source": "git://github.com/Polymer/paper-tabs.git",
"_target": "~0.4.0",
"_originalSource": "Polymer/paper-tabs"
}
\ No newline at end of file
paper-tabs
============
See the [component page](http://www.polymer-project.org/docs/elements/paper-elements.html#paper-tabs) for more information.
This diff is collapsed.
This diff is collapsed.
<!doctype html>
<!--
Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
@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
The complete set of authors may be found at http://polymer.github.io/AUTHORS
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS
......@@ -10,13 +11,15 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<html>
<head>
<script src="../platform/platform.js"></script>
<link rel="import" href="../core-component-page/core-component-page.html">
<title>paper-tabs</title>
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
<script src="../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../iron-component-page/iron-component-page.html">
</head>
<body unresolved>
<body>
<core-component-page sources='["paper-tabs.html", "paper-tab.html"]'></core-component-page>
<iron-component-page sources='["paper-tabs.html", "paper-tab.html"]'></iron-component-page>
</body>
</html>
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment