1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00

update components

This commit is contained in:
Luke Pulverenti 2016-01-08 00:44:45 -05:00
parent 5c24b145bc
commit 2d4d70ed14
57 changed files with 724 additions and 758 deletions

View file

@ -16,12 +16,12 @@
}, },
"devDependencies": {}, "devDependencies": {},
"ignore": [], "ignore": [],
"version": "1.0.21", "version": "1.0.22",
"_release": "1.0.21", "_release": "1.0.22",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "1.0.21", "tag": "1.0.22",
"commit": "e341b097c05c31ec012e04dfbd0455ae9dfc4929" "commit": "2b5f83fc8011106b3b97f34a893f47e9a991830d"
}, },
"_source": "git://github.com/MediaBrowser/Emby.ApiClient.Javascript.git", "_source": "git://github.com/MediaBrowser/Emby.ApiClient.Javascript.git",
"_target": "~1.0.3", "_target": "~1.0.3",

View file

@ -1123,7 +1123,7 @@
if (options.updateDateLastAccessed !== false) { if (options.updateDateLastAccessed !== false) {
server.DateLastAccessed = new Date().getTime(); server.DateLastAccessed = new Date().getTime();
if (server.LastConnectionMode == ConnectionMode.Local) { if (connectionMode == ConnectionMode.Local) {
server.DateLastLocalConnection = new Date().getTime(); server.DateLastLocalConnection = new Date().getTime();
} }
} }

View file

@ -15,12 +15,12 @@
}, },
"devDependencies": {}, "devDependencies": {},
"ignore": [], "ignore": [],
"version": "1.0.14", "version": "1.0.15",
"_release": "1.0.14", "_release": "1.0.15",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "1.0.14", "tag": "1.0.15",
"commit": "a7a8baf260ab509c5f9b1750cbf6fe921883141c" "commit": "a87cc9a074a449a96302923191bf232ec7cc2911"
}, },
"_source": "git://github.com/MediaBrowser/emby-webcomponents.git", "_source": "git://github.com/MediaBrowser/emby-webcomponents.git",
"_target": "~1.0.0", "_target": "~1.0.0",

View file

@ -103,12 +103,23 @@
profile.DirectPlayProfiles = []; profile.DirectPlayProfiles = [];
var videoAudioCodecs = [];
if (canPlayMp3) {
videoAudioCodecs.push('mp3');
}
if (canPlayAac) {
videoAudioCodecs.push('aac');
}
if (canPlayAc3) {
videoAudioCodecs.push('ac3');
}
if (supportedFormats.indexOf('h264') != -1) { if (supportedFormats.indexOf('h264') != -1) {
profile.DirectPlayProfiles.push({ profile.DirectPlayProfiles.push({
Container: 'mp4,m4v', Container: 'mp4,m4v',
Type: 'Video', Type: 'Video',
VideoCodec: 'h264', VideoCodec: 'h264',
AudioCodec: 'aac' + (canPlayMp3 ? ',mp3' : '') + (canPlayAc3 ? ',ac3' : '') AudioCodec: videoAudioCodecs.join(',')
}); });
} }
@ -117,7 +128,7 @@
Container: 'mkv,mov', Container: 'mkv,mov',
Type: 'Video', Type: 'Video',
VideoCodec: 'h264', VideoCodec: 'h264',
AudioCodec: 'aac' + (canPlayMp3 ? ',mp3' : '') + (canPlayAc3 ? ',ac3' : '') AudioCodec: videoAudioCodecs.join(',')
}); });
} }
@ -160,17 +171,6 @@
} }
}); });
var videoAudioCodecs = [];
if (canPlayMp3) {
videoAudioCodecs.push('mp3');
}
if (canPlayAac) {
videoAudioCodecs.push('aac');
}
if (canPlayAc3) {
videoAudioCodecs.push('ac3');
}
// Can't use mkv on mobile because we have to use the native player controls and they won't be able to seek it // Can't use mkv on mobile because we have to use the native player controls and they won't be able to seek it
if (canPlayMkv && !browser.mobile) { if (canPlayMkv && !browser.mobile) {
profile.TranscodingProfiles.push({ profile.TranscodingProfiles.push({
@ -268,24 +268,6 @@
] ]
}); });
profile.CodecProfiles.push({
Type: 'VideoAudio',
Codec: 'aac,mp3',
Conditions: [
{
Condition: 'LessThanEqual',
Property: 'AudioChannels',
Value: videoAudioChannels
},
{
Condition: 'Equals',
Property: 'IsSecondaryAudio',
Value: 'false',
IsRequired: 'false'
}
]
});
profile.CodecProfiles.push({ profile.CodecProfiles.push({
Type: 'VideoAudio', Type: 'VideoAudio',
Conditions: [ Conditions: [

View file

@ -1,6 +1,6 @@
{ {
"name": "iron-icons", "name": "iron-icons",
"version": "1.1.0", "version": "1.1.1",
"description": "A set of icons for use with iron-icon", "description": "A set of icons for use with iron-icon",
"authors": [ "authors": [
"The Polymer Authors" "The Polymer Authors"
@ -34,11 +34,11 @@
"util", "util",
"update-icons.sh" "update-icons.sh"
], ],
"_release": "1.1.0", "_release": "1.1.1",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "v1.1.0", "tag": "v1.1.1",
"commit": "623d8dae77cd8658ce1f6834b30a4f3f6e2100ea" "commit": "77a8e0190d6c481d8b5df0495fa484928880ea53"
}, },
"_source": "git://github.com/PolymerElements/iron-icons.git", "_source": "git://github.com/PolymerElements/iron-icons.git",
"_target": "^1.0.0", "_target": "^1.0.0",

View file

@ -1,6 +1,6 @@
{ {
"name": "iron-icons", "name": "iron-icons",
"version": "1.1.0", "version": "1.1.1",
"description": "A set of icons for use with iron-icon", "description": "A set of icons for use with iron-icon",
"authors": [ "authors": [
"The Polymer Authors" "The Polymer Authors"

View file

@ -30,6 +30,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<link rel="import" href="../maps-icons.html"> <link rel="import" href="../maps-icons.html">
<link rel="import" href="../notification-icons.html"> <link rel="import" href="../notification-icons.html">
<link rel="import" href="../social-icons.html"> <link rel="import" href="../social-icons.html">
<link rel="import" href="../places-icons.html">
<style is="custom-style"> <style is="custom-style">

View file

@ -26,14 +26,14 @@
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0" "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
}, },
"main": "iron-meta.html", "main": "iron-meta.html",
"homepage": "https://github.com/polymerelements/iron-meta", "homepage": "https://github.com/PolymerElements/iron-meta",
"_release": "1.1.1", "_release": "1.1.1",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "v1.1.1", "tag": "v1.1.1",
"commit": "e171ee234b482219c9514e6f9551df48ef48bd9f" "commit": "e171ee234b482219c9514e6f9551df48ef48bd9f"
}, },
"_source": "git://github.com/polymerelements/iron-meta.git", "_source": "git://github.com/PolymerElements/iron-meta.git",
"_target": "^1.0.0", "_target": "^1.0.0",
"_originalSource": "polymerelements/iron-meta" "_originalSource": "PolymerElements/iron-meta"
} }

View file

@ -1,6 +1,7 @@
{ {
"name": "neon-animation", "name": "neon-animation",
"version": "1.0.8", "description": "A system for animating Polymer-based web components",
"version": "1.0.9",
"authors": [ "authors": [
"The Polymer Authors" "The Polymer Authors"
], ],
@ -29,12 +30,12 @@
"homepage": "https://github.com/PolymerElements/neon-animation", "homepage": "https://github.com/PolymerElements/neon-animation",
"ignore": [], "ignore": [],
"dependencies": { "dependencies": {
"polymer": "Polymer/polymer#^1.0.0", "polymer": "Polymer/polymer#^1.1.0",
"iron-meta": "PolymerElements/iron-meta#^1.0.0", "iron-meta": "PolymerElements/iron-meta#^1.0.0",
"iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^1.0.0", "iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^1.0.0",
"iron-selector": "PolymerElements/iron-selector#^1.0.0", "iron-selector": "PolymerElements/iron-selector#^1.0.0",
"paper-styles": "PolymerElements/paper-styles#^1.0.0", "paper-styles": "PolymerElements/paper-styles#^1.0.0",
"web-animations-js": "web-animations/web-animations-js#2.1.2" "web-animations-js": "web-animations/web-animations-js#2.1.3"
}, },
"devDependencies": { "devDependencies": {
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0", "iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
@ -48,11 +49,11 @@
"iron-icons": "PolymerElements/iron-icons#^1.0.0", "iron-icons": "PolymerElements/iron-icons#^1.0.0",
"paper-icon-button": "PolymerElements/paper-icon-button#^1.0.0" "paper-icon-button": "PolymerElements/paper-icon-button#^1.0.0"
}, },
"_release": "1.0.8", "_release": "1.0.9",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "v1.0.8", "tag": "v1.0.9",
"commit": "36656916b75a4715b025a03473620002c2650ee8" "commit": "ab40f4e4a777153cb5c27c9b62ee82b94d53eb76"
}, },
"_source": "git://github.com/polymerelements/neon-animation.git", "_source": "git://github.com/polymerelements/neon-animation.git",
"_target": "^1.0.0", "_target": "^1.0.0",

View file

@ -0,0 +1,22 @@
language: node_js
sudo: false
node_js: 4
addons:
firefox: latest
apt:
sources:
- google-chrome
packages:
- google-chrome-stable
before_script:
- npm install web-component-tester
- npm install bower
- 'export PATH=$PWD/node_modules/.bin:$PATH'
- bower install
script:
- xvfb-run wct
- "if [ \"${TRAVIS_PULL_REQUEST}\" = \"false\" ]; then wct -s 'default'; fi"
env:
global:
- secure: AnPpB3uzTWU0hmrDmPyOb/3mJZRv4BgPFJrpaT/mQ/9979IBeFfFHJX6MqQlgo894lJWvKSvAjEutgK5Z3LQh6cLB3JuhPBInwKgFPUx/V14VIju+Z7jwx6RycE3flb2f9Y6y5My13ovswsTNnhJEkpDGlbRnJlh5c+HeP+6D0oFPFaGWvULZsAHQnEykir1TMPL2TD8SfuYWifmBj7QYQ2vsYnqZoAkPNedv/OtdoA3rziFXSG3GqXX2NJVnYqlaLj/HiHK7xLlZu/ODfo6En12DMtqJajBP7NfJkEUAF72ScOsYxlwiI1aYcVSUy6upkxxPwkBj5x7wDZ0tRFmlautyq2skDAh/fgIfRw9AMe8kj/YLef+T8bmZNT9IIelNaNcpfTQHpYWcOpPk2uBT3iIOcmp+Ys8RZKqzYmekBtHTwCGmQcfQrjBXjrjz5xlUaoMH7vauh7Ct7SkD7Fu87XSUvks4v2yypxxmHXO8jUilKuUdtAzb3dtOboO0ptsoLuBm/qSeURco4be6KPyVnDxdWdbYOxIZtE8JeY2DbonS45OgFtL1NKeEIhiTQIcOuSs0qwJFFzaBBAfek1tkTvBhMJP3JPWpIbNJhdZWzSd0LUSe892sbiZJY67FA4xcY8vK5JZNWnxFyKX1+A8ljPEd1yBImxMzUDMNS9t0G0=
- secure: jdh0G/FDRghnjasav0/8nOZsYgXUd5DLKgD5XrDCVrBvPwXly+AnMXE+Hr/bztEXylcEmcqrWUUfB1ODUdVn1EGk8CJaYpHyKcoMcpJiEjHYS/3i1rXRsnHs2o3dcRO69rA8A5LZeG3yYfiPVUiKlyl7MWOal3pNohDGi8dZcT0CoWnA8UaV//0uXG3GGG3X8KcbVfB2hQvG1mK6wM6W4eHVOplcBaE2xnnFDMxfU2KnRgjLSPw66PeJGczWOBR9fZql9p6kV38ZM2s4qnUsMlTZkNqn0f6CuEPqcG6+S6Tk9+0dvAHet+Ky9fgiyJPq+p6sDGfdm1ZJwOjz5MoyudzGSuHAJHH2nscQf8pUBQ1gxKaGg7GV9LUj0cjLDAFWA2KpxTlabDZhZPIMoMKFpqpvJG49gDVga5gGabom21nd/+E1i/2vvoP16kY9rjf+Gd5+tIzajXCu8Tq06Xz63idZDJbt38GjArfFFqe5k7CqE+m2vpWx/iTwe+cT70wnIq/xigvaNq6CgUuNdzkVnVBj/C7yVqwwZkfbBC7HhRna9Nyzts/j2M2vwy0oYB73WzuhpYSweaAOZq2kcUIQ5ZMGO3UkZRjwWnHxAi5mrvZhRcRIqkvJJhoMQnjwJSTah/3cz0cJh19DL+Ozde24/tuY+vOnhFb+ddo1OKD6FtM=

View file

@ -8,7 +8,6 @@ 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 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--> -->
<link rel="import" href="../../polymer/polymer.html"> <link rel="import" href="../../polymer/polymer.html">
<link rel="import" href="../neon-shared-element-animation-behavior.html"> <link rel="import" href="../neon-shared-element-animation-behavior.html">
<link rel="import" href="../web-animations.html"> <link rel="import" href="../web-animations.html">

View file

@ -1,6 +1,7 @@
{ {
"name": "neon-animation", "name": "neon-animation",
"version": "1.0.8", "description": "A system for animating Polymer-based web components",
"version": "1.0.9",
"authors": [ "authors": [
"The Polymer Authors" "The Polymer Authors"
], ],
@ -29,12 +30,12 @@
"homepage": "https://github.com/PolymerElements/neon-animation", "homepage": "https://github.com/PolymerElements/neon-animation",
"ignore": [], "ignore": [],
"dependencies": { "dependencies": {
"polymer": "Polymer/polymer#^1.0.0", "polymer": "Polymer/polymer#^1.1.0",
"iron-meta": "PolymerElements/iron-meta#^1.0.0", "iron-meta": "PolymerElements/iron-meta#^1.0.0",
"iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^1.0.0", "iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^1.0.0",
"iron-selector": "PolymerElements/iron-selector#^1.0.0", "iron-selector": "PolymerElements/iron-selector#^1.0.0",
"paper-styles": "PolymerElements/paper-styles#^1.0.0", "paper-styles": "PolymerElements/paper-styles#^1.0.0",
"web-animations-js": "web-animations/web-animations-js#2.1.2" "web-animations-js": "web-animations/web-animations-js#2.1.3"
}, },
"devDependencies": { "devDependencies": {
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0", "iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",

View file

@ -17,17 +17,19 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<script src="../../../webcomponentsjs/webcomponents-lite.js"></script> <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../../../paper-styles/paper-styles.html"> <link rel="import" href="../../../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../neon-animated-pages.html"> <link rel="import" href="../../neon-animated-pages.html">
<link rel="import" href="../../neon-animations.html"> <link rel="import" href="../../neon-animations.html">
<link rel="import" href="../../../paper-styles/typography.html">
<link rel="import" href="x-card.html"> <link rel="import" href="x-card.html">
<link rel="import" href="x-cards-list.html"> <link rel="import" href="x-cards-list.html">
<style> <style is="custom-style">
body { body {
padding: 15px; padding: 15px;
@apply(--layout-fullbleed);
@apply(--paper-font-common-base);
} }
neon-animated-pages { neon-animated-pages {
@ -64,38 +66,40 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
left: 30px; left: 30px;
} }
.card-contents {
@apply(--layout-vertical);
@apply(--layout-center-center);
@apply(--layout-fit);
}
.button-container {
@apply(--layout-flex);
@apply(--layout-horizontal);
@apply(--layout-around-justified);
}
</style> </style>
</head> </head>
<body class="fullbleed"> <body>
<template is="dom-bind"> <template is="dom-bind">
<neon-animated-pages id="pages" selected="0"> <neon-animated-pages id="pages" selected="0">
<x-cards-list id="list"> <x-cards-list id="list">
<div class="card-contents">
<div class="fit layout vertical center-center">
<h2>Choose a subject</h2> <h2>Choose a subject</h2>
<div class="flex layout horizontal around-justified large"> <div class="button-container large">
<div class="blue raised button" on-click="_onPolymerClick"> <div class="blue raised button" on-click="_onPolymerClick">
POLYMER POLYMER
</div> </div>
<div class="blue raised button" on-click="_onAngularClick"> <div class="blue raised button" on-click="_onAngularClick">
ANGULAR ANGULAR
</div> </div>
</div> </div>
</div> </div>
</x-cards-list> </x-cards-list>
<x-card> <x-card>
<div class="card-contents">
<div class="fit layout vertical center-center">
<div class="raised back button" on-click="_onBackClick"> <div class="raised back button" on-click="_onBackClick">
BACK BACK
</div> </div>
@ -108,14 +112,11 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum. proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p> </p>
</div> </div>
</x-card> </x-card>
<x-card> <x-card>
<div class="card-contents">
<div class="fit layout vertical center-center">
<div class="raised back button" on-click="_onBackClick"> <div class="raised back button" on-click="_onBackClick">
BACK BACK
</div> </div>
@ -128,12 +129,10 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum. proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p> </p>
</div> </div>
</x-card> </x-card>
</neon-animated-pages>
</neon-animated-pages>
</template> </template>
<script> <script>

View file

@ -9,26 +9,24 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
--> -->
<link rel="import" href="../../../polymer/polymer.html"> <link rel="import" href="../../../polymer/polymer.html">
<link rel="import" href="../../../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../neon-shared-element-animatable-behavior.html"> <link rel="import" href="../../neon-shared-element-animatable-behavior.html">
<dom-module id="x-card"> <dom-module id="x-card">
<template>
<style> <style>
:host { :host {
display: block; display: block;
overflow: hidden; overflow: hidden;
} }
#placeholder { #placeholder {
opacity: 0; opacity: 0;
background-color: grey; background-color: grey;
@apply(--layout-fit);
} }
</style> </style>
<template>
<div id="placeholder" class="fit"></div>
<div id="placeholder"></div>
<div id="container"> <div id="container">
<content select="div"></content> <content select="div"></content>
</div> </div>

View file

@ -9,11 +9,12 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
--> -->
<link rel="import" href="../../../polymer/polymer.html"> <link rel="import" href="../../../polymer/polymer.html">
<link rel="import" href="../../../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../neon-shared-element-animatable-behavior.html"> <link rel="import" href="../../neon-shared-element-animatable-behavior.html">
<dom-module id="x-cards-list"> <dom-module id="x-cards-list">
<template>
<style> <style>
:host { :host {
display: block; display: block;
overflow: hidden; overflow: hidden;
@ -22,13 +23,11 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
#placeholder { #placeholder {
opacity: 0; opacity: 0;
background-color: grey; background-color: grey;
@apply(--layout-fit);
} }
</style> </style>
<template>
<div id="placeholder" class="fit"></div>
<div id="placeholder"></div>
<div id="container"> <div id="container">
<content select="div"></content> <content select="div"></content>
</div> </div>

View file

@ -17,24 +17,27 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<script src="../../../webcomponentsjs/webcomponents-lite.js"></script> <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../../../paper-styles/paper-styles.html"> <link rel="import" href="../../../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../../paper-styles/typography.html">
<link rel="import" href="../../../paper-styles/color.html">
<link rel="import" href="../../neon-animated-pages.html"> <link rel="import" href="../../neon-animated-pages.html">
<link rel="import" href="../../neon-animatable.html"> <link rel="import" href="../../neon-animatable.html">
<link rel="import" href="../../neon-animations.html"> <link rel="import" href="../../neon-animations.html">
<style> <style is="custom-style">
body { body {
overflow: hidden; overflow: hidden;
@apply(--layout-fullbleed);
@apply(--layout-vertical);
} }
.toolbar { .toolbar {
padding: 8px; padding: 8px;
} }
</style> neon-animated-pages {
@apply(--layout-flex);
<style is="custom-style"> }
neon-animatable { neon-animatable {
color: white; color: white;
@ -66,7 +69,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
</style> </style>
</head> </head>
<body class="fullbleed layout vertical"> <body>
<template is="dom-bind"> <template is="dom-bind">
@ -75,7 +78,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<button on-click="_onNextClick">&gt;&gt;</button> <button on-click="_onNextClick">&gt;&gt;</button>
</div> </div>
<neon-animated-pages id="pages" class="flex" selected="[[selected]]" entry-animation="[[entryAnimation]]" exit-animation="[[exitAnimation]]"> <neon-animated-pages id="pages" selected="[[selected]]" entry-animation="[[entryAnimation]]" exit-animation="[[exitAnimation]]">
<neon-animatable>1</neon-animatable> <neon-animatable>1</neon-animatable>
<neon-animatable>2</neon-animatable> <neon-animatable>2</neon-animatable>
<neon-animatable>3</neon-animatable> <neon-animatable>3</neon-animatable>

View file

@ -1,47 +0,0 @@
<!doctype html>
<!--
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.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>neon-animation demo: basic</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<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="my-animatable.html">
</head>
<body>
<template is="dom-bind">
<button on-click="_onButtonClick">click me</button>
<br>
<my-animatable></my-animatable>
</template>
<script>
var scope = document.querySelector('template[is="dom-bind"]');
scope._onButtonClick = function(event) {
var node = document.querySelector('my-animatable');
if (node) {
node.animate();
}
};
</script>
</body>
</html>

View file

@ -17,26 +17,42 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<script src="../../../webcomponentsjs/webcomponents-lite.js"></script> <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="my-animatable.html">
<link rel="import" href="my-dialog.html"> <link rel="import" href="my-dialog.html">
</head> </head>
<style>
my-animatable {
margin-top: 50px;
}
</style>
<body> <body>
<template is="dom-bind"> <template is="dom-bind">
<button on-click="_onButtonClick">Toggle</button> <button on-click="_onCircleButtonClick">toggle circle</button>
<button on-click="_onDialogButtonClick">toggle dialog</button>
<div style="text-align: center"> <div style="text-align: center">
<my-dialog>Hello World!</my-dialog> <my-dialog>Hello World!</my-dialog>
</div> </div>
<my-animatable></my-animatable>
</template> </template>
<script> <script>
var scope = document.querySelector('template[is="dom-bind"]'); var scope = document.querySelector('template[is="dom-bind"]');
scope._onButtonClick = function(event) { scope._onCircleButtonClick = function(event) {
var node = document.querySelector('my-animatable');
if (node) {
node.animate();
}
};
scope._onDialogButtonClick = function(event) {
var node = document.querySelector('my-dialog'); var node = document.querySelector('my-dialog');
if (node) { if (node) {
if (node.opened) { if (node.opened) {

View file

@ -11,9 +11,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<link rel="import" href="../../animations/scale-down-animation.html"> <link rel="import" href="../../animations/scale-down-animation.html">
<dom-module id="my-animatable"> <dom-module id="my-animatable">
<template>
<style> <style>
:host { :host {
display: inline-block; display: inline-block;
border-radius: 50%; border-radius: 50%;
@ -21,15 +20,10 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
height: 300px; height: 300px;
background: orange; background: orange;
} }
</style> </style>
<template>
<content></content> <content></content>
</template> </template>
</dom-module> </dom-module>
<script> <script>

View file

@ -7,30 +7,26 @@ 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 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--> -->
<link rel="import" href="../../../polymer/polymer.html"> <link rel="import" href="../../../polymer/polymer.html">
<link rel="import" href="../../../paper-styles/paper-styles.html"> <link rel="import" href="../../../paper-styles/shadow.html">
<link rel="import" href="../../neon-animation-runner-behavior.html"> <link rel="import" href="../../neon-animation-runner-behavior.html">
<link rel="import" href="../../animations/scale-up-animation.html"> <link rel="import" href="../../animations/scale-up-animation.html">
<link rel="import" href="../../animations/fade-out-animation.html"> <link rel="import" href="../../animations/fade-out-animation.html">
<dom-module id="my-dialog"> <dom-module id="my-dialog">
<template>
<style> <style>
:host { :host {
display: none; display: none;
padding: 16px; padding: 16px;
background: white; background: white;
color: black; color: black;
margin: 0 auto; margin: 0 auto;
z-index: 100;
position: absolute;
@apply(--shadow-elevation-2dp); @apply(--shadow-elevation-2dp);
} }
</style> </style>
<template>
<content></content> <content></content>
</template> </template>

View file

@ -7,14 +7,12 @@ 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 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--> -->
<link rel="import" href="../../../polymer/polymer.html"> <link rel="import" href="../../../polymer/polymer.html">
<link rel="import" href="../../../paper-styles/paper-styles.html"> <link rel="import" href="../../../paper-styles/shadow.html">
<link rel="import" href="../../neon-animation-runner-behavior.html"> <link rel="import" href="../../neon-animation-runner-behavior.html">
<dom-module id="animated-dropdown"> <dom-module id="animated-dropdown">
<template>
<style> <style>
:host { :host {
display: none; display: none;
padding: 16px; padding: 16px;
@ -23,15 +21,9 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
@apply(--shadow-elevation-2dp); @apply(--shadow-elevation-2dp);
} }
</style> </style>
<template>
<content></content> <content></content>
</template> </template>
</dom-module> </dom-module>
<script> <script>

View file

@ -17,7 +17,6 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<script src="../../../webcomponentsjs/webcomponents-lite.js"></script> <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../../../paper-styles/paper-styles.html">
<link rel="import" href="../../neon-animated-pages.html"> <link rel="import" href="../../neon-animated-pages.html">
<link rel="import" href="../../neon-animations.html"> <link rel="import" href="../../neon-animations.html">
<link rel="import" href="animated-dropdown.html"> <link rel="import" href="animated-dropdown.html">

View file

@ -7,13 +7,14 @@ 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 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--> -->
<link rel="import" href="../../../polymer/polymer.html"> <link rel="import" href="../../../polymer/polymer.html">
<link rel="import" href="../../../paper-styles/paper-styles.html"> <link rel="import" href="../../../paper-styles/typography.html">
<link rel="import" href="../../../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../neon-shared-element-animatable-behavior.html"> <link rel="import" href="../../neon-shared-element-animatable-behavior.html">
<link rel="import" href="../shared-styles.html">
<dom-module id="animated-grid"> <dom-module id="animated-grid">
<template>
<link rel="import" type="css" href="../shared.css"> <style include="shared-styles"></style>
<style> <style>
:host { :host {
@ -67,11 +68,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
width: calc(100% / 6); width: calc(100% / 6);
height: calc(100% / 3); height: calc(100% / 3);
} }
</style> </style>
<template>
<template is="dom-repeat" items="[[config]]"> <template is="dom-repeat" items="[[config]]">
<div class$="[[_computeTileClass(item.color)]]"> <div class$="[[_computeTileClass(item.color)]]">
<span>[[item.value]]</span> <span>[[item.value]]</span>
@ -79,7 +77,6 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
</template> </template>
</template> </template>
</dom-module> </dom-module>
<script> <script>

View file

@ -8,12 +8,12 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
--> -->
<link rel="import" href="../../../polymer/polymer.html"> <link rel="import" href="../../../polymer/polymer.html">
<link rel="import" href="../../neon-shared-element-animatable-behavior.html"> <link rel="import" href="../../neon-shared-element-animatable-behavior.html">
<link rel="import" href="../../../paper-styles/color.html">
<link rel="import" href="../shared-styles.html">
<dom-module id="fullsize-page-with-card"> <dom-module id="fullsize-page-with-card">
<template>
<link rel="import" type="css" href="../shared.css"> <style include="shared-styles"></style>
<style> <style>
:host { :host {
@ -36,10 +36,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
</style> </style>
<template>
<div id="fixed" class$="[[_computeFixedBackgroundClass(color)]]"></div> <div id="fixed" class$="[[_computeFixedBackgroundClass(color)]]"></div>
<div id="card" class$="[[_computeCardClass(color)]]"></div> <div id="card" class$="[[_computeCardClass(color)]]"></div>
</template> </template>

View file

@ -17,38 +17,31 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<script src="../../../webcomponentsjs/webcomponents-lite.js"></script> <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../../../paper-styles/paper-styles.html">
<link rel="import" href="../../neon-animated-pages.html"> <link rel="import" href="../../neon-animated-pages.html">
<link rel="import" href="../../neon-animations.html"> <link rel="import" href="../../neon-animations.html">
<link rel="import" href="animated-grid.html"> <link rel="import" href="animated-grid.html">
<link rel="import" href="fullsize-page-with-card.html"> <link rel="import" href="fullsize-page-with-card.html">
<style> <style is="custom-style">
body { body {
overflow: hidden; overflow: hidden;
@apply(--layout-fullbleed);
} }
neon-animated-pages { neon-animated-pages {
height: 100%; height: 100%;
} }
</style> </style>
</head> </head>
<body class="fullbleed"> <body>
<template is="dom-bind"> <template is="dom-bind">
<neon-animated-pages id="pages" selected="0"> <neon-animated-pages id="pages" selected="0">
<animated-grid on-tile-click="_onTileClick"></animated-grid> <animated-grid on-tile-click="_onTileClick"></animated-grid>
<fullsize-page-with-card id="fullsize-card" hero-id="hero" on-click="_onFullsizeClick"> <fullsize-page-with-card id="fullsize-card" hero-id="hero" on-click="_onFullsizeClick">
</fullsize-page-with-card> </fullsize-page-with-card>
</neon-animated-pages> </neon-animated-pages>
</template> </template>
<script> <script>

View file

@ -1,7 +1,45 @@
<a href="declarative/index.html">declarative</a><br> <!doctype html>
<a href="dropdown/index.html">dropdown</a><br> <!--
<a href="grid/index.html">grid</a><br> @license
<a href="list/index.html">list</a><br> Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
<a href="load/index.html">load</a><br> This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
<a href="tiles/index.html">tiles</a><br> The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
<a href="card/index.html">card</a><br> 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 lang="en">
<head>
<title>neon-animated pages demo</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<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="../../paper-styles/demo-pages.html">
</head>
<style>
a {
display: block;
margin-bottom: 10px;
}
</style>
<body unresolved>
<div class="horizontal-section-container">
<div>
<h4>Sample demos</h4>
<div class="horizontal-section">
<a href="doc/index.html">basic</a>
<a href="declarative/index.html">declarative</a>
<a href="dropdown/index.html">dropdown</a>
<a href="grid/index.html">grid</a>
<a href="list/index.html">list</a>
<a href="load/index.html">load</a>
<a href="tiles/index.html">tiles</a>
<a href="card/index.html">card</a>
</div>
</div>
</div>
</body>
</html>

View file

@ -7,13 +7,13 @@ 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 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--> -->
<link rel="import" href="../../../polymer/polymer.html"> <link rel="import" href="../../../polymer/polymer.html">
<link rel="import" href="../../../paper-styles/paper-styles.html"> <link rel="import" href="../../../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../../paper-styles/shadow.html">
<link rel="import" href="../../neon-animatable-behavior.html"> <link rel="import" href="../../neon-animatable-behavior.html">
<dom-module id="full-view"> <dom-module id="full-view">
<template>
<style> <style>
:host { :host {
@apply(--layout-vertical); @apply(--layout-vertical);
} }
@ -43,11 +43,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
#e0e0e0 16px #e0e0e0 16px
); );
} }
</style> </style>
<template>
<paper-toolbar class="medium-tall"> <paper-toolbar class="medium-tall">
<paper-icon-button id="button" icon="clear" on-click="_onClearButtonClick"></paper-icon-button> <paper-icon-button id="button" icon="clear" on-click="_onClearButtonClick"></paper-icon-button>
</paper-toolbar> </paper-toolbar>
@ -60,7 +56,6 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
</div> </div>
</template> </template>
</dom-module> </dom-module>
<script> <script>

View file

@ -14,16 +14,21 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes"> <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
<script src="../../../webcomponentsjs/webcomponents-lite.js"></script> <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../../../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../../paper-styles/paper-styles.html">
<link rel="import" href="list-demo.html"> <link rel="import" href="list-demo.html">
</head> </head>
<body class="fullbleed relative"> <style is="custom-style">
body {
<list-demo class="fit"></list-demo> @apply(--layout-fullbleed);
}
list-demo {
@apply(--layout-fit);
}
</style>
<body>
<list-demo></list-demo>
</body> </body>
</html> </html>

View file

@ -7,7 +7,6 @@ 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 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--> -->
<link rel="import" href="../../../polymer/polymer.html"> <link rel="import" href="../../../polymer/polymer.html">
<link rel="import" href="../../../paper-styles/paper-styles.html">
<link rel="import" href="../../../paper-toolbar/paper-toolbar.html"> <link rel="import" href="../../../paper-toolbar/paper-toolbar.html">
<link rel="import" href="../../neon-animated-pages.html"> <link rel="import" href="../../neon-animated-pages.html">
<link rel="import" href="../../neon-animations.html"> <link rel="import" href="../../neon-animations.html">
@ -15,29 +14,19 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<link rel="import" href="full-view.html"> <link rel="import" href="full-view.html">
<dom-module id="list-demo"> <dom-module id="list-demo">
<template>
<style> <style>
:host { :host {
display: block; display: block;
} }
neon-animated-pages { neon-animated-pages {
height: 100%; height: 100%;
} }
</style> </style>
<template>
<neon-animated-pages id="pages" selected="0"> <neon-animated-pages id="pages" selected="0">
<list-view data="[[fileData]]" on-item-click="_onItemClick"></list-view> <list-view data="[[fileData]]" on-item-click="_onItemClick"></list-view>
<full-view on-close="_onClose"></full-view> <full-view on-close="_onClose"></full-view>
</neon-animated-pages> </neon-animated-pages>
</template> </template>
</dom-module> </dom-module>

View file

@ -9,16 +9,16 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<link rel="import" href="../../../polymer/polymer.html"> <link rel="import" href="../../../polymer/polymer.html">
<link rel="import" href="../../../iron-icons/iron-icons.html"> <link rel="import" href="../../../iron-icons/iron-icons.html">
<link rel="import" href="../../../iron-icon/iron-icon.html"> <link rel="import" href="../../../iron-icon/iron-icon.html">
<link rel="import" href="../../../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../../paper-icon-button/paper-icon-button.html"> <link rel="import" href="../../../paper-icon-button/paper-icon-button.html">
<link rel="import" href="../../../paper-item/paper-item.html"> <link rel="import" href="../../../paper-item/paper-item.html">
<link rel="import" href="../../../paper-item/paper-item-body.html"> <link rel="import" href="../../../paper-item/paper-item-body.html">
<link rel="import" href="../../../paper-styles/paper-styles.html"> <link rel="import" href="../../../paper-styles/color.html">
<link rel="import" href="../../neon-animatable-behavior.html"> <link rel="import" href="../../neon-animatable-behavior.html">
<dom-module id="list-view"> <dom-module id="list-view">
<template>
<style> <style>
:host { :host {
@apply(--layout-vertical); @apply(--layout-vertical);
} }
@ -31,11 +31,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
iron-icon { iron-icon {
color: var(--google-grey-500); color: var(--google-grey-500);
} }
</style> </style>
<template>
<paper-toolbar class="medium-tall"> <paper-toolbar class="medium-tall">
<paper-icon-button id="button" icon="arrow-back"></paper-icon-button> <paper-icon-button id="button" icon="arrow-back"></paper-icon-button>
</paper-toolbar> </paper-toolbar>

View file

@ -7,15 +7,16 @@ 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 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--> -->
<link rel="import" href="../../../polymer/polymer.html"> <link rel="import" href="../../../polymer/polymer.html">
<link rel="import" href="../../../paper-styles/paper-styles.html"> <link rel="import" href="../../../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../neon-shared-element-animatable-behavior.html"> <link rel="import" href="../../neon-shared-element-animatable-behavior.html">
<link rel="import" href="../../../paper-styles/typography.html">
<link rel="import" href="../../../paper-styles/color.html">
<link rel="import" href="../shared-styles.html">
<dom-module id="animated-grid"> <dom-module id="animated-grid">
<template>
<link rel="import" type="css" href="../shared.css"> <style include="shared-styles"></style>
<style> <style>
:host { :host {
display: block; display: block;
background: #000; background: #000;
@ -67,11 +68,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
width: calc(100% / 6); width: calc(100% / 6);
height: calc(100% / 3); height: calc(100% / 3);
} }
</style> </style>
<template>
<template is="dom-repeat" items="[[config]]"> <template is="dom-repeat" items="[[config]]">
<div class$="[[_computeTileClass(item.color)]]"> <div class$="[[_computeTileClass(item.color)]]">
<span>[[item.value]]</span> <span>[[item.value]]</span>

View file

@ -7,15 +7,15 @@ 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 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--> -->
<link rel="import" href="../../../polymer/polymer.html"> <link rel="import" href="../../../polymer/polymer.html">
<link rel="import" href="../../../paper-styles/paper-styles.html"> <link rel="import" href="../../../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../neon-animatable-behavior.html"> <link rel="import" href="../../neon-animatable-behavior.html">
<link rel="import" href="../../neon-animation-runner-behavior.html"> <link rel="import" href="../../neon-animation-runner-behavior.html">
<link rel="import" href="../../../paper-styles/shadow.html">
<link rel="import" href="animated-grid.html"> <link rel="import" href="animated-grid.html">
<dom-module id="full-page"> <dom-module id="full-page">
<template>
<style> <style>
:host { :host {
background: black; background: black;
visibility: hidden; visibility: hidden;
@ -33,17 +33,12 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
height: calc(100% - 72px); height: calc(100% - 72px);
@apply(--layout-flex); @apply(--layout-flex);
} }
</style> </style>
<template>
<div id="toolbar" class="toolbar"></div> <div id="toolbar" class="toolbar"></div>
<animated-grid id="grid"></animated-grid> <animated-grid id="grid"></animated-grid>
</template> </template>
</dom-module> </dom-module>
<script> <script>

View file

@ -16,22 +16,24 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes"> <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
<script src="../../../webcomponentsjs/webcomponents-lite.js"></script> <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../../../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../../paper-styles/paper-styles.html">
<link rel="import" href="../../neon-animated-pages.html"> <link rel="import" href="../../neon-animated-pages.html">
<link rel="import" href="../../neon-animations.html"> <link rel="import" href="../../neon-animations.html">
<link rel="import" href="full-page.html"> <link rel="import" href="full-page.html">
<style> <style is="custom-style">
body { body {
overflow: hidden; overflow: hidden;
@apply(--layout-fullbleed);
}
full-page {
@apply(--layout-fit);
} }
</style> </style>
</head> </head>
<body class="fullbleed relative"> <body>
<full-page class="fit"></full-page> <full-page></full-page>
<script> <script>

View file

@ -7,13 +7,15 @@ 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 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--> -->
<link rel="import" href="../../../polymer/polymer.html"> <link rel="import" href="../../../polymer/polymer.html">
<link rel="import" href="../../../paper-styles/paper-styles.html"> <link rel="import" href="../../../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../neon-shared-element-animatable-behavior.html"> <link rel="import" href="../../neon-shared-element-animatable-behavior.html">
<link rel="import" href="../../../paper-styles/typography.html">
<link rel="import" href="../../../paper-styles/color.html">
<link rel="import" href="../shared-styles.html">
<dom-module id="animated-grid"> <dom-module id="animated-grid">
<template>
<link rel="import" type="css" href="../shared.css"> <style include="shared-styles"></style>
<style> <style>
:host { :host {
@ -70,8 +72,6 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
</style> </style>
<template>
<template is="dom-repeat" items="[[config]]"> <template is="dom-repeat" items="[[config]]">
<div class$="[[_computeTileClass(item.color)]]"> <div class$="[[_computeTileClass(item.color)]]">
<span>[[item.value]]</span> <span>[[item.value]]</span>

View file

@ -8,12 +8,11 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
--> -->
<link rel="import" href="../../../polymer/polymer.html"> <link rel="import" href="../../../polymer/polymer.html">
<link rel="import" href="../../neon-shared-element-animatable-behavior.html"> <link rel="import" href="../../neon-shared-element-animatable-behavior.html">
<link rel="import" href="../shared-styles.html">
<dom-module id="fullsize-page-with-card"> <dom-module id="fullsize-page-with-card">
<template>
<link rel="import" type="css" href="../shared.css"> <style include="shared-styles"></style>
<style> <style>
:host { :host {
@ -36,14 +35,10 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
</style> </style>
<template>
<div id="fixed" class$="[[_computeFixedBackgroundClass(color)]]"></div> <div id="fixed" class$="[[_computeFixedBackgroundClass(color)]]"></div>
<div id="card" class$="[[_computeCardClass(color)]]"></div> <div id="card" class$="[[_computeCardClass(color)]]"></div>
</template> </template>
</dom-module> </dom-module>
<script> <script>

View file

@ -16,33 +16,29 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes"> <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
<script src="../../../webcomponentsjs/webcomponents-lite.js"></script> <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../../../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../../paper-styles/paper-styles.html">
<link rel="import" href="../../neon-animations.html"> <link rel="import" href="../../neon-animations.html">
<link rel="import" href="reprojected-pages.html"> <link rel="import" href="reprojected-pages.html">
<link rel="import" href="animated-grid.html"> <link rel="import" href="animated-grid.html">
<link rel="import" href="fullsize-page-with-card.html"> <link rel="import" href="fullsize-page-with-card.html">
<style> <style is="custom-style">
body {
neon-animated-pages { overflow: hidden;
@apply(--layout-fullbleed);
}
reprojected-pages {
height: 100%; height: 100%;
} }
</style> </style>
</head> </head>
<body class="fullbleed"> <body>
<template is="dom-bind"> <template is="dom-bind">
<reprojected-pages id="pages" selected="0"> <reprojected-pages id="pages" selected="0">
<animated-grid on-tile-click="_onTileClick"></animated-grid> <animated-grid on-tile-click="_onTileClick"></animated-grid>
<fullsize-page-with-card id="fullsize-card" hero-id="hero" on-click="_onFullsizeClick"> <fullsize-page-with-card id="fullsize-card" hero-id="hero" on-click="_onFullsizeClick">
</fullsize-page-with-card> </fullsize-page-with-card>
</reprojected-pages> </reprojected-pages>
</template> </template>

View file

@ -11,15 +11,17 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<link rel="import" href="../../neon-animated-pages.html"> <link rel="import" href="../../neon-animated-pages.html">
<dom-module id="reprojected-pages"> <dom-module id="reprojected-pages">
<template> <template>
<style>
neon-animated-pages {
height: 100%;
}
</style>
<neon-animated-pages selected="{{selected}}"> <neon-animated-pages selected="{{selected}}">
<content></content> <content></content>
</neon-animated-pages> </neon-animated-pages>
</template> </template>
</dom-module> </dom-module>
<script> <script>

View file

@ -0,0 +1,47 @@
<!--
@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.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
-->
<dom-module id="shared-styles">
<template>
<style>
.red-100 {
background: var(--google-red-100);
}
.yellow-100 {
background: var(--google-yellow-100);
}
.blue-100 {
background: var(--google-blue-100);
}
.green-100 {
background: var(--google-green-100);
}
.red-300 {
background: var(--google-red-300);
}
.yellow-300 {
background: var(--google-yellow-300);
}
.blue-300 {
background: var(--google-blue-300);
}
.green-300 {
background: var(--google-green-300);
}
</style>
</template>
</dom-module>

View file

@ -1,40 +0,0 @@
/*
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.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
*/
.red-100 {
background: var(--google-red-100);
}
.yellow-100 {
background: var(--google-yellow-100);
}
.blue-100 {
background: var(--google-blue-100);
}
.green-100 {
background: var(--google-green-100);
}
.red-300 {
background: var(--google-red-300);
}
.yellow-300 {
background: var(--google-yellow-300);
}
.blue-300 {
background: var(--google-blue-300);
}
.green-300 {
background: var(--google-green-300);
}

View file

@ -7,13 +7,12 @@ 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 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--> -->
<link rel="import" href="../../../polymer/polymer.html"> <link rel="import" href="../../../polymer/polymer.html">
<link rel="import" href="../../../paper-styles/paper-styles.html"> <link rel="import" href="../../../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../neon-shared-element-animatable-behavior.html"> <link rel="import" href="../../neon-shared-element-animatable-behavior.html">
<dom-module id="circles-page"> <dom-module id="circles-page">
<template>
<style> <style>
:host { :host {
@apply(--layout-horizontal); @apply(--layout-horizontal);
@apply(--layout-center-center); @apply(--layout-center-center);
@ -28,11 +27,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
border-radius: 50%; border-radius: 50%;
background: var(--color-one); background: var(--color-one);
} }
</style> </style>
<template>
<div> <div>
<div class="circle"></div> <div class="circle"></div>
<div class="circle"></div> <div class="circle"></div>

View file

@ -17,44 +17,36 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<script src="../../../webcomponentsjs/webcomponents-lite.js"></script> <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../../../paper-styles/paper-styles.html"> <link rel="import" href="../../../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../../neon-animated-pages.html"> <link rel="import" href="../../neon-animated-pages.html">
<link rel="import" href="../../neon-animations.html"> <link rel="import" href="../../neon-animations.html">
<link rel="import" href="../../../paper-styles/color.html">
<link rel="import" href="circles-page.html"> <link rel="import" href="circles-page.html">
<link rel="import" href="squares-page.html"> <link rel="import" href="squares-page.html">
<style> <style is="custom-style">
body { body {
overflow: hidden; overflow: hidden;
@apply(--layout-fullbleed);
} }
neon-animated-pages { neon-animated-pages {
height: 100%; height: 100%;
} }
</style>
<style is="custom-style">
:root { :root {
--color-one: #4dd0e1; --color-one: var(--paper-cyan-300);
--color-two: #ff9800; --color-two: var(--paper-orange-500);
} }
</style> </style>
</head> </head>
<body class="fullbleed"> <body>
<template is="dom-bind"> <template is="dom-bind">
<neon-animated-pages id="pages" selected="0"> <neon-animated-pages id="pages" selected="0">
<circles-page on-circle-click="_onCircleClick"></circles-page> <circles-page on-circle-click="_onCircleClick"></circles-page>
<squares-page on-click="_onSquaresClick"></squares-page> <squares-page on-click="_onSquaresClick"></squares-page>
</neon-animated-pages> </neon-animated-pages>
</template> </template>

View file

@ -7,13 +7,11 @@ 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 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
--> -->
<link rel="import" href="../../../polymer/polymer.html"> <link rel="import" href="../../../polymer/polymer.html">
<link rel="import" href="../../../paper-styles/paper-styles.html">
<link rel="import" href="../../neon-shared-element-animatable-behavior.html"> <link rel="import" href="../../neon-shared-element-animatable-behavior.html">
<dom-module id="squares-page"> <dom-module id="squares-page">
<template>
<style> <style>
.header { .header {
height: 40%; height: 40%;
background: var(--color-one); background: var(--color-one);
@ -31,11 +29,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
margin: 8px; margin: 8px;
background: var(--color-two); background: var(--color-two);
} }
</style> </style>
<template>
<div id="header" class="header"></div> <div id="header" class="header"></div>
<div class="body"> <div class="body">

View file

@ -141,7 +141,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
* or a map of animation type to array of configuration objects. * or a map of animation type to array of configuration objects.
*/ */
getAnimationConfig: function(type) { getAnimationConfig: function(type) {
var map = []; var map = {};
var allConfigs = []; var allConfigs = [];
this._getAnimationConfigRecursive(type, map, allConfigs); this._getAnimationConfigRecursive(type, map, allConfigs);
// append the configurations saved in the map to the array // append the configurations saved in the map to the array

View file

@ -9,7 +9,6 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
--> -->
<link rel="import" href="../../polymer/polymer.html"> <link rel="import" href="../../polymer/polymer.html">
<link rel="import" href="../../paper-styles/paper-styles.html">
<link rel="import" href="../neon-shared-element-animatable-behavior.html"> <link rel="import" href="../neon-shared-element-animatable-behavior.html">
<link rel="import" href="../../iron-resizable-behavior/iron-resizable-behavior.html"> <link rel="import" href="../../iron-resizable-behavior/iron-resizable-behavior.html">

View file

@ -1,6 +1,6 @@
{ {
"name": "paper-input", "name": "paper-input",
"version": "1.1.3", "version": "1.1.4",
"description": "Material design text fields", "description": "Material design text fields",
"authors": [ "authors": [
"The Polymer Authors" "The Polymer Authors"
@ -16,6 +16,7 @@
"paper-input-behavior.html", "paper-input-behavior.html",
"paper-input-container.html", "paper-input-container.html",
"paper-input-error.html", "paper-input-error.html",
"paper-input-addon-behavior.html",
"paper-input-char-counter.html" "paper-input-char-counter.html"
], ],
"private": true, "private": true,
@ -27,7 +28,7 @@
"homepage": "https://github.com/PolymerElements/paper-input", "homepage": "https://github.com/PolymerElements/paper-input",
"ignore": [], "ignore": [],
"dependencies": { "dependencies": {
"polymer": "Polymer/polymer#^1.1.0", "polymer": "Polymer/polymer#^1.2.0",
"iron-autogrow-textarea": "PolymerElements/iron-autogrow-textarea#^1.0.0", "iron-autogrow-textarea": "PolymerElements/iron-autogrow-textarea#^1.0.0",
"iron-behaviors": "PolymerElements/iron-behaviors#^1.0.0", "iron-behaviors": "PolymerElements/iron-behaviors#^1.0.0",
"iron-form-element-behavior": "PolymerElements/iron-form-element-behavior#^1.0.0", "iron-form-element-behavior": "PolymerElements/iron-form-element-behavior#^1.0.0",
@ -46,13 +47,13 @@
"web-component-tester": "Polymer/web-component-tester#^3.4.0", "web-component-tester": "Polymer/web-component-tester#^3.4.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0" "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
}, },
"_release": "1.1.3", "_release": "1.1.4",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "v1.1.3", "tag": "v1.1.4",
"commit": "f070288446f9e78fbe16b032ddb429a8e8015ee7" "commit": "8ca01ac3cafc61abd980d262875ffca0c79640fa"
}, },
"_source": "git://github.com/PolymerElements/paper-input.git", "_source": "git://github.com/polymerelements/paper-input.git",
"_target": "^1.0.0", "_target": "^1.0.9",
"_originalSource": "PolymerElements/paper-input" "_originalSource": "polymerelements/paper-input"
} }

View file

@ -1,6 +1,6 @@
{ {
"name": "paper-input", "name": "paper-input",
"version": "1.1.3", "version": "1.1.4",
"description": "Material design text fields", "description": "Material design text fields",
"authors": [ "authors": [
"The Polymer Authors" "The Polymer Authors"
@ -16,6 +16,7 @@
"paper-input-behavior.html", "paper-input-behavior.html",
"paper-input-container.html", "paper-input-container.html",
"paper-input-error.html", "paper-input-error.html",
"paper-input-addon-behavior.html",
"paper-input-char-counter.html" "paper-input-char-counter.html"
], ],
"private": true, "private": true,
@ -27,7 +28,7 @@
"homepage": "https://github.com/PolymerElements/paper-input", "homepage": "https://github.com/PolymerElements/paper-input",
"ignore": [], "ignore": [],
"dependencies": { "dependencies": {
"polymer": "Polymer/polymer#^1.1.0", "polymer": "Polymer/polymer#^1.2.0",
"iron-autogrow-textarea": "PolymerElements/iron-autogrow-textarea#^1.0.0", "iron-autogrow-textarea": "PolymerElements/iron-autogrow-textarea#^1.0.0",
"iron-behaviors": "PolymerElements/iron-behaviors#^1.0.0", "iron-behaviors": "PolymerElements/iron-behaviors#^1.0.0",
"iron-form-element-behavior": "PolymerElements/iron-form-element-behavior#^1.0.0", "iron-form-element-behavior": "PolymerElements/iron-form-element-behavior#^1.0.0",

View file

@ -117,10 +117,10 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<h3>Inputs can have prefixes and suffixes</h3> <h3>Inputs can have prefixes and suffixes</h3>
<demo-snippet class="horizontal"> <demo-snippet class="horizontal">
<template> <template>
<paper-input class="short" label="total" type="number"> <paper-input label="total" type="number">
<div prefix>$</div> <div prefix>$</div>
</paper-input> </paper-input>
<paper-input class="short" label="username" id="inputWithButton"> <paper-input label="username" id="inputWithButton">
<iron-icon icon="mail" prefix></iron-icon> <iron-icon icon="mail" prefix></iron-icon>
<div suffix>@email.com</div> <div suffix>@email.com</div>
<paper-icon-button suffix onclick="clearInput()" <paper-icon-button suffix onclick="clearInput()"

View file

@ -60,6 +60,9 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
/** /**
* Returns true if the value is invalid. Bind this to both the `<paper-input-container>`'s * Returns true if the value is invalid. Bind this to both the `<paper-input-container>`'s
* and the input's `invalid` property. * and the input's `invalid` property.
*
* If `autoValidate` is true, the `invalid` attribute is managed automatically,
* which can clobber attempts to manage it manually.
*/ */
invalid: { invalid: {
type: Boolean, type: Boolean,

View file

@ -172,8 +172,10 @@ This element is `display:block` by default, but you can set the `inline` attribu
} }
.label-and-input-container { .label-and-input-container {
@apply(--layout-flex); @apply(--layout-flex-auto);
@apply(--layout-relative); @apply(--layout-relative);
width: 100%;
max-width: 100%;
} }
.input-content { .input-content {
@ -189,6 +191,7 @@ This element is `display:block` by default, but you can set the `inline` attribu
top: 0; top: 0;
right: 0; right: 0;
left: 0; left: 0;
width: 100%;
font: inherit; font: inherit;
color: var(--paper-input-container-color, --secondary-text-color); color: var(--paper-input-container-color, --secondary-text-color);
@ -201,8 +204,8 @@ This element is `display:block` by default, but you can set the `inline` attribu
.input-content.label-is-floating ::content .paper-input-label { .input-content.label-is-floating ::content .paper-input-label {
-webkit-transform: translateY(-75%) scale(0.75); -webkit-transform: translateY(-75%) scale(0.75);
transform: translateY(-75%) scale(0.75); transform: translateY(-75%) scale(0.75);
-webkit-transition: -webkit-transform 0.25s; -webkit-transition: -webkit-transform 0.25s, width 0.25s;
transition: transform 0.25s; transition: transform 0.25s, width 0.25s;
-webkit-transform-origin: left top; -webkit-transform-origin: left top;
transform-origin: left top; transform-origin: left top;
@ -250,6 +253,7 @@ This element is `display:block` by default, but you can set the `inline` attribu
box-shadow: none; box-shadow: none;
padding: 0; padding: 0;
width: 100%; width: 100%;
max-width: 100%;
background: transparent; background: transparent;
border: none; border: none;
color: var(--paper-input-container-input-color, --primary-text-color); color: var(--paper-input-container-input-color, --primary-text-color);
@ -263,11 +267,13 @@ This element is `display:block` by default, but you can set the `inline` attribu
::content [prefix] { ::content [prefix] {
@apply(--paper-font-subhead); @apply(--paper-font-subhead);
@apply(--paper-input-prefix); @apply(--paper-input-prefix);
@apply(--layout-flex-none);
} }
::content [suffix] { ::content [suffix] {
@apply(--paper-font-subhead); @apply(--paper-font-subhead);
@apply(--paper-input-suffix); @apply(--paper-input-suffix);
@apply(--layout-flex-none);
} }
/* Firefox sets a min-width on the input, which can cause layout issues */ /* Firefox sets a min-width on the input, which can cause layout issues */

View file

@ -1,6 +1,6 @@
{ {
"name": "paper-styles", "name": "paper-styles",
"version": "1.1.1", "version": "1.1.2",
"description": "Common (global) styles for Material Design elements.", "description": "Common (global) styles for Material Design elements.",
"authors": [ "authors": [
"The Polymer Authors" "The Polymer Authors"
@ -29,11 +29,11 @@
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0", "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
"iron-component-page": "polymerelements/iron-component-page#^1.0.0" "iron-component-page": "polymerelements/iron-component-page#^1.0.0"
}, },
"_release": "1.1.1", "_release": "1.1.2",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "v1.1.1", "tag": "v1.1.2",
"commit": "fc3ca8dcfc69b9c7a7261e51eefc9741d0f113f8" "commit": "7b97fa9d2c190bec9ef2d771d91f47b40a27f3be"
}, },
"_source": "git://github.com/PolymerElements/paper-styles.git", "_source": "git://github.com/PolymerElements/paper-styles.git",
"_target": "^1.0.0", "_target": "^1.0.0",

View file

@ -1,6 +1,6 @@
{ {
"name": "paper-styles", "name": "paper-styles",
"version": "1.1.1", "version": "1.1.2",
"description": "Common (global) styles for Material Design elements.", "description": "Common (global) styles for Material Design elements.",
"authors": [ "authors": [
"The Polymer Authors" "The Polymer Authors"

View file

@ -16,24 +16,16 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
:root { :root {
/* /*
* Light background theme * You can use these generic variables in your elements for easy theming.
* For example, if all your elements use `--primary-text-color` as its main
* color, then switching from a light to a dark theme is just a matter of
* changing the value of `--primary-text-color` in your application.
*/ */
--light-theme-background-color: #ffffff; --primary-text-color: var(--light-theme-text-color);
--light-theme-base-color: #000000; --primary-background-color: var(--light-theme-background-color);
--light-theme-text-color: #212121; --secondary-text-color: var(--light-theme-secondary-color);
--light-theme-secondary-color: #737373; /* for secondary text and icons */ --disabled-text-color: var(--light-theme-disabled-color);
--light-theme-disabled-color: #9b9b9b; /* disabled/hint text */ --divider-color: var(--light-theme-divider-color);
--light-theme-divider-color: #dbdbdb;
/*
* Dark background theme
*/
--dark-theme-background-color: #212121;
--dark-theme-base-color: #ffffff;
--dark-theme-text-color: #ffffff;
--dark-theme-secondary-color: #bcbcbc; /* for secondary text and icons */
--dark-theme-disabled-color: #646464; /* disabled/hint text */
--dark-theme-divider-color: #3c3c3c;
/* /*
* Primary and accent colors. Also see color.html for more colors. * Primary and accent colors. Also see color.html for more colors.
@ -46,16 +38,32 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
--light-accent-color: #ff80ab; /* --paper-pink-a100 */ --light-accent-color: #ff80ab; /* --paper-pink-a100 */
--dark-accent-color: #f50057; /* --paper-pink-a400 */ --dark-accent-color: #f50057; /* --paper-pink-a400 */
/*
* Material Design Light background theme
*/
--light-theme-background-color: #ffffff;
--light-theme-base-color: #000000;
--light-theme-text-color: #212121;
--light-theme-secondary-color: #737373; /* for secondary text and icons */
--light-theme-disabled-color: #9b9b9b; /* disabled/hint text */
--light-theme-divider-color: #dbdbdb;
/*
* Material Design Dark background theme
*/
--dark-theme-background-color: #212121;
--dark-theme-base-color: #ffffff;
--dark-theme-text-color: #ffffff;
--dark-theme-secondary-color: #bcbcbc; /* for secondary text and icons */
--dark-theme-disabled-color: #646464; /* disabled/hint text */
--dark-theme-divider-color: #3c3c3c;
/* /*
* Deprecated values because of their confusing names. * Deprecated values because of their confusing names.
*/ */
--primary-text-color: var(--light-theme-text-color);
--text-primary-color: var(--dark-theme-text-color); --text-primary-color: var(--dark-theme-text-color);
--primary-background-color: var(--light-theme-background-color);
--secondary-text-color: var(--light-theme-secondary-color);
--disabled-text-color:var(--light-theme-disabled-color);
--divider-color: var(--light-theme-divider-color);
--default-primary-color: var(--primary-color); --default-primary-color: var(--primary-color);
} }
</style> </style>

View file

@ -1,6 +1,6 @@
{ {
"name": "paper-toggle-button", "name": "paper-toggle-button",
"version": "1.0.13", "version": "1.0.14",
"description": "A material design toggle button control", "description": "A material design toggle button control",
"authors": [ "authors": [
"The Polymer Authors" "The Polymer Authors"
@ -36,11 +36,11 @@
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0" "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
}, },
"main": "paper-toggle-button.html", "main": "paper-toggle-button.html",
"_release": "1.0.13", "_release": "1.0.14",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "1.0.13", "tag": "v1.0.14",
"commit": "dbc3924b8d9c16ee6376704dd80c39d12aee72c8" "commit": "131f32adf5ce831f94be7f80c436865b44d7cd95"
}, },
"_source": "git://github.com/PolymerElements/paper-toggle-button.git", "_source": "git://github.com/PolymerElements/paper-toggle-button.git",
"_target": "~1.0.5", "_target": "~1.0.5",

View file

@ -1,6 +1,6 @@
{ {
"name": "paper-toggle-button", "name": "paper-toggle-button",
"version": "1.0.13", "version": "1.0.14",
"description": "A material design toggle button control", "description": "A material design toggle button control",
"authors": [ "authors": [
"The Polymer Authors" "The Polymer Authors"

View file

@ -9,6 +9,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
--> -->
<link rel="import" href="../polymer/polymer.html"> <link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../paper-styles/color.html"> <link rel="import" href="../paper-styles/color.html">
<link rel="import" href="../paper-styles/default-theme.html"> <link rel="import" href="../paper-styles/default-theme.html">
<link rel="import" href="../paper-ripple/paper-ripple.html"> <link rel="import" href="../paper-ripple/paper-ripple.html">
@ -55,6 +56,8 @@ Custom property | Description | Default
<style> <style>
:host { :host {
display: inline-block; display: inline-block;
@apply(--layout-horizontal);
@apply(--layout-center);
} }
:host([disabled]) { :host([disabled]) {
@ -142,11 +145,13 @@ Custom property | Description | Default
position: relative; position: relative;
width: 36px; width: 36px;
height: 14px; height: 14px;
/* The toggle button has an absolute position of -3px; The extra 1px
/* accounts for the toggle button shadow box. */
margin: 4px 1px;
} }
.toggle-label { .toggle-label {
position: relative; position: relative;
top: -2px;
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
padding-left: var(--paper-toggle-button-label-spacing, 8px); padding-left: var(--paper-toggle-button-label-spacing, 8px);

View file

@ -28,14 +28,14 @@
"web-animations-next-lite.dev.html", "web-animations-next-lite.dev.html",
"web-animations-next-lite.dev.js" "web-animations-next-lite.dev.js"
], ],
"version": "2.1.2", "version": "2.1.3",
"_release": "2.1.2", "_release": "2.1.3",
"_resolution": { "_resolution": {
"type": "version", "type": "version",
"tag": "2.1.2", "tag": "2.1.3",
"commit": "28e527353b67a9d74f6f7cdffe6ccefa3c54e94b" "commit": "4f0c0ee122de4178853cb52fa0784df4a06a8a0f"
}, },
"_source": "git://github.com/web-animations/web-animations-js.git", "_source": "git://github.com/web-animations/web-animations-js.git",
"_target": "2.1.2", "_target": "2.1.3",
"_originalSource": "web-animations/web-animations-js" "_originalSource": "web-animations/web-animations-js"
} }