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

update button styles

Browse source
This commit is contained in:
Luke Pulverenti 2016-06-04 23:50:07 -04:00
parent 217234f89d
commit b33a3302ed
109 changed files with 474 additions and 733 deletions
Download patch file Download diff file Expand all files Collapse all files

5
dashboard-ui/bower_components/emby-collapsible/emby-collapsible.html vendored
View file

@ -1,6 +1,5 @@
<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../iron-icon/iron-icon.html">
<link rel="import" href="../paper-button/paper-button.html">
<link rel="import" href="../neon-animation/neon-animation-runner-behavior.html">
<link rel="import" href="../neon-animation/animations/transform-animation.html">
<link rel="import" href="../iron-collapse/iron-collapse.html">
@ -37,11 +36,11 @@
}
</style>
<div>
<paper-button on-tap="toggleExpand" id="expandButton" class="emby-collapsible-button">
<button is="emby-button" type="button" on-click="toggleExpand" id="expandButton" class="emby-collapsible-button block">
<iron-icon id="titleIcon" icon="[[icon]]" style="[[iconstyle]]"></iron-icon>
<h3 class="emby-collapsible-title" title="[[title]]">[[title]]</h3>
<iron-icon id="expandIcon" style="margin-left: auto; margin-right: .5em;"></iron-icon>
</paper-button>
</button>
<iron-collapse id="contentCollapse" class="emby-collapsible-content" opened="{{expanded}}">
<content></content>
</iron-collapse>

8
dashboard-ui/bower_components/emby-webcomponents/.bower.json vendored
View file

@ -15,12 +15,12 @@
},
"devDependencies": {},
"ignore": [],
"version": "1.4.24",
"_release": "1.4.24",
"version": "1.4.25",
"_release": "1.4.25",
"_resolution": {
"type": "version",
"tag": "1.4.24",
"commit": "05159909e71faf74eb1d39f3cac661614b0a5d5b"
"tag": "1.4.25",
"commit": "aa53e6de589581ac2cd9773b464c59a79ab45486"
},
"_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
"_target": "^1.2.0",

2
dashboard-ui/bower_components/emby-webcomponents/dialoghelper/dialoghelper.css vendored
View file

@ -31,7 +31,7 @@
top: 50%;
left: 50%;
max-width: 70%;
max-height: 80%;
max-height: 84%;
}
@media all and (min-width: 1280px) and (min-height: 720px) {

19
dashboard-ui/bower_components/emby-webcomponents/emby-button/emby-button.css vendored
View file

@ -6,7 +6,8 @@
margin: 0 .29em;
background: transparent;
text-align: center;
font: inherit;
font-size: inherit;
font-family: inherit;
color: inherit;
outline-width: 0;
-moz-user-select: none;
@ -25,6 +26,8 @@
outline: none !important;
position: relative;
overflow: hidden;
font-weight: 500;
text-transform: uppercase;
}
[is="emby-button"].raised {
@ -35,7 +38,7 @@
display: flex;
align-items: center;
justify-content: center;
margin: .25em .29em;
margin: .25em 0;
width: 100%;
}
@ -55,19 +58,21 @@
height: 50px;
top: 50%;
left: 50%;
background: white;
animation: ripple-animation 2s;
opacity: 0.4;
background: currentcolor;
animation: ripple-animation .8s;
opacity: 0.25;
-webkit-transform: translate(0, 0);
transform: translate3d(0, 0, 0);
}
@keyframes ripple-animation {
from {
transform: none;
opacity: 0.4;
opacity: 0.5;
}
to {
transform: scale(100);
transform: scale(20);
opacity: 0;
}
}

14
dashboard-ui/bower_components/emby-webcomponents/emby-button/emby-button.js vendored
View file

@ -18,9 +18,9 @@
this.appendChild(div);
setTimeout(function () {
div.addEventListener("animationend", function() {
div.parentNode.removeChild(div);
}, 2000);
}, false);
}
function onKeyDown(e) {
@ -30,6 +30,13 @@
}
}
function onMouseDown(e) {
if (e.button == 0) {
animateButton.call(this, e);
}
}
EmbyButtonPrototype.attachedCallback = function () {
if (this.getAttribute('data-embybutton') == 'true') {
@ -39,7 +46,8 @@
this.setAttribute('data-embybutton', 'true');
this.addEventListener('keydown', onKeyDown);
this.addEventListener('mousedown', animateButton);
this.addEventListener('mousedown', onMouseDown);
this.addEventListener('touchstart', animateButton);
//this.addEventListener('click', animateButton);
};

7
dashboard-ui/bower_components/emby-webcomponents/focusmanager.js vendored
View file

@ -20,11 +20,6 @@ define([], function () {
function focus(element) {
var tagName = element.tagName;
if (tagName == 'PAPER-INPUT') {
element = element.querySelector('input') || element;
}
try {
element.focus();
} catch (err) {
@ -32,7 +27,7 @@ define([], function () {
}
}
var focusableTagNames = ['INPUT', 'TEXTAREA', 'SELECT', 'BUTTON', 'A', 'PAPER-BUTTON', 'PAPER-INPUT', 'PAPER-CHECKBOX'];
var focusableTagNames = ['INPUT', 'TEXTAREA', 'SELECT', 'BUTTON', 'A', 'PAPER-CHECKBOX'];
var focusableContainerTagNames = ['BODY', 'DIALOG'];
var focusableQuery = focusableTagNames.join(',') + ',.focusable';

24
dashboard-ui/bower_components/emby-webcomponents/images/imagehelper.js vendored
View file

@ -109,29 +109,25 @@ define(['visibleinviewport', 'imageFetcher', 'layoutManager', 'events', 'browser
target.addEventListener(type, handler, optionsOrCapture);
}
function unveilWithIntersection(images) {
function unveilWithIntersection(images, root) {
var filledCount = 0;
var options = {};
options.rootMargin = "150%";
//options.rootMargin = "300%";
var observer = new IntersectionObserver(function (entries) {
for (var j = 0, length2 = entries.length; j < length2; j++) {
var entry = entries[j];
var intersectionRatio = entry.intersectionRatio;
if (intersectionRatio) {
var target = entry.target;
observer.unobserve(target);
fillImage(target);
filledCount++;
}
var target = entry.target;
observer.unobserve(target);
fillImage(target);
filledCount++;
}
if (filledCount >= images.length) {
//observer.disconnect();
observer.disconnect();
}
},
options
@ -142,14 +138,14 @@ define(['visibleinviewport', 'imageFetcher', 'layoutManager', 'events', 'browser
}
}
function unveilElements(images) {
function unveilElements(images, root) {
if (!images.length) {
return;
}
if (supportsIntersectionObserver) {
unveilWithIntersection(images);
unveilWithIntersection(images, root);
return;
}
@ -223,7 +219,7 @@ define(['visibleinviewport', 'imageFetcher', 'layoutManager', 'events', 'browser
function lazyChildren(elem) {
unveilElements(elem.getElementsByClassName('lazy'));
unveilElements(elem.getElementsByClassName('lazy'), elem);
}
function getPrimaryImageAspectRatio(items) {

6
dashboard-ui/bower_components/iron-meta/.bower.json vendored
View file

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

6
dashboard-ui/bower_components/iron-resizable-behavior/.bower.json vendored
View file

@ -28,14 +28,14 @@
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
},
"ignore": [],
"homepage": "https://github.com/polymerelements/iron-resizable-behavior",
"homepage": "https://github.com/PolymerElements/iron-resizable-behavior",
"_release": "1.0.3",
"_resolution": {
"type": "version",
"tag": "v1.0.3",
"commit": "dda1df6aaf452aedf3e52ff0cf69e72439452216"
},
"_source": "git://github.com/polymerelements/iron-resizable-behavior.git",
"_source": "git://github.com/PolymerElements/iron-resizable-behavior.git",
"_target": "^1.0.0",
"_originalSource": "polymerelements/iron-resizable-behavior"
"_originalSource": "PolymerElements/iron-resizable-behavior"
}

33
dashboard-ui/bower_components/paper-button/.bower.json vendored
View file

@ -1,6 +1,6 @@
{
"name": "paper-button",
"version": "1.0.11",
"version": "1.0.12",
"description": "Material design button",
"authors": [
"The Polymer Authors"
@ -16,34 +16,33 @@
"private": true,
"repository": {
"type": "git",
"url": "git://github.com/PolymerElements/paper-button"
"url": "git://github.com/PolymerElements/paper-button.git"
},
"license": "http://polymer.github.io/LICENSE.txt",
"homepage": "https://github.com/PolymerElements/paper-button",
"dependencies": {
"polymer": "Polymer/polymer#^1.1.0",
"paper-ripple": "polymerelements/paper-ripple#^1.0.0",
"paper-material": "polymerelements/paper-material#^1.0.0",
"paper-behaviors": "polymerelements/paper-behaviors#^1.0.0",
"iron-flex-layout": "polymerelements/iron-flex-layout#^1.0.0"
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
"paper-behaviors": "PolymerElements/paper-behaviors#^1.0.0",
"paper-material": "PolymerElements/paper-material#^1.0.0"
},
"devDependencies": {
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
"web-component-tester": "polymer/web-component-tester#^3.4.0",
"test-fixture": "polymerelements/test-fixture#^1.0.0",
"iron-component-page": "polymerelements/iron-component-page#^1.0.0",
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
"iron-demo-helpers": "PolymerElements/iron-demo-helpers#^1.0.0",
"iron-icon": "polymerelements/iron-icon#^1.0.0",
"iron-icons": "polymerelements/iron-icons#^1.0.0",
"iron-test-helpers": "polymerelements/iron-test-helpers#^1.0.0",
"paper-styles": "polymerelements/paper-styles#^1.0.0"
"iron-icon": "PolymerElements/iron-icon#^1.0.0",
"iron-icons": "PolymerElements/iron-icons#^1.0.0",
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0",
"paper-styles": "PolymerElements/paper-styles#^1.0.0",
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
"web-component-tester": "^4.0.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
},
"ignore": [],
"_release": "1.0.11",
"_release": "1.0.12",
"_resolution": {
"type": "version",
"tag": "v1.0.11",
"commit": "7d0f75300372d91835ae7298593d50987d4a610f"
"tag": "v1.0.12",
"commit": "96c3a2661c355223d0b41e1d34126f9c62d544dc"
},
"_source": "git://github.com/PolymerElements/paper-button.git",
"_target": "~1.0.1",

11
dashboard-ui/bower_components/paper-button/.travis.yml vendored
View file

@ -1,15 +1,14 @@
language: node_js
sudo: false
sudo: required
before_script:
- npm install web-component-tester
- npm install bower
- 'export PATH=$PWD/node_modules/.bin:$PATH'
- npm install -g bower polylint web-component-tester
- bower install
- polylint
env:
global:
- secure: geFs7Ipj7/9knSKT2FEYAB7b/zbmgWFXCgZm7cEcrG71EX/HB1do3spANGOlRly77xaZtNNF1OGYBHIP36DSyMEHRYj6TYtTrPIr2ySeHvoOv0nzYakXdscxBvfI5HJrNiFpld80KoGl8vKfroLNpVLallgumX3diydypolvW1I=
- secure: IILEhg3m49exN5hpxbPP1JA/q+s4v/QpOMbDiXVRV4Uz1XwOPGLCyrAB0ENjwzMCyeOah1Z2MyQSUiPisLheHKvZifhviNqizWN//8EDkg1gkU0R6egGdotD5mBb3UpCD0CNZ8+D0FYwOpdCWCruwr7N+zDUN+6r5H07KP/VeUU=
node_js: 4
node_js: stable
addons:
firefox: latest
apt:
@ -17,6 +16,8 @@ addons:
- google-chrome
packages:
- google-chrome-stable
sauce_connect: true
script:
- xvfb-run wct
- "if [ \"${TRAVIS_PULL_REQUEST}\" = \"false\" ]; then wct -s 'default'; fi"
dist: trusty

13
dashboard-ui/bower_components/paper-button/CONTRIBUTING.md vendored
View file

@ -1,11 +1,16 @@
<!--
This file is autogenerated based on
https://github.com/PolymerElements/ContributionGuide/blob/master/CONTRIBUTING.md
If you edit that file, it will get updated everywhere else.
If you edit this file, your changes will get overridden :)
You can however override the jsbin link with one that's customized to this
specific element:
jsbin=https://jsbin.com/cagaye/edit?html,output
-->
# Polymer Elements
## Guide for Contributors
@ -41,7 +46,7 @@ Polymer Elements are built in the open, and the Polymer authors eagerly encourag
3. Click the `paper-foo` element.
```
2. **A reduced test case that demonstrates the problem.** If possible, please include the test case as a JSBin. Start with this template to easily import and use relevant Polymer Elements: [http://jsbin.com/cagaye](http://jsbin.com/cagaye/edit?html,output).
2. **A reduced test case that demonstrates the problem.** If possible, please include the test case as a JSBin. Start with this template to easily import and use relevant Polymer Elements: [https://jsbin.com/cagaye/edit?html,output](https://jsbin.com/cagaye/edit?html,output).
3. **A list of browsers where the problem occurs.** This can be skipped if the problem is the same across all browsers.
@ -51,14 +56,14 @@ Polymer Elements are built in the open, and the Polymer authors eagerly encourag
When submitting pull requests, please provide:
1. **A reference to the corresponding issue** or issues that will be closed by the pull request. Please refer to these issues using the following syntax:
1. **A reference to the corresponding issue** or issues that will be closed by the pull request. Please refer to these issues in the pull request description using the following syntax:
```markdown
(For a single issue)
Fixes #20
(For multiple issues)
Fixes #32, #40
Fixes #32, fixes #40
```
2. **A succinct description of the design** used to fix any related issues. For example:

27
dashboard-ui/bower_components/paper-button/bower.json vendored
View file

@ -1,6 +1,6 @@
{
"name": "paper-button",
"version": "1.0.11",
"version": "1.0.12",
"description": "Material design button",
"authors": [
"The Polymer Authors"
@ -16,27 +16,26 @@
"private": true,
"repository": {
"type": "git",
"url": "git://github.com/PolymerElements/paper-button"
"url": "git://github.com/PolymerElements/paper-button.git"
},
"license": "http://polymer.github.io/LICENSE.txt",
"homepage": "https://github.com/PolymerElements/paper-button",
"dependencies": {
"polymer": "Polymer/polymer#^1.1.0",
"paper-ripple": "polymerelements/paper-ripple#^1.0.0",
"paper-material": "polymerelements/paper-material#^1.0.0",
"paper-behaviors": "polymerelements/paper-behaviors#^1.0.0",
"iron-flex-layout": "polymerelements/iron-flex-layout#^1.0.0"
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
"paper-behaviors": "PolymerElements/paper-behaviors#^1.0.0",
"paper-material": "PolymerElements/paper-material#^1.0.0"
},
"devDependencies": {
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
"web-component-tester": "polymer/web-component-tester#^3.4.0",
"test-fixture": "polymerelements/test-fixture#^1.0.0",
"iron-component-page": "polymerelements/iron-component-page#^1.0.0",
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
"iron-demo-helpers": "PolymerElements/iron-demo-helpers#^1.0.0",
"iron-icon": "polymerelements/iron-icon#^1.0.0",
"iron-icons": "polymerelements/iron-icons#^1.0.0",
"iron-test-helpers": "polymerelements/iron-test-helpers#^1.0.0",
"paper-styles": "polymerelements/paper-styles#^1.0.0"
"iron-icon": "PolymerElements/iron-icon#^1.0.0",
"iron-icons": "PolymerElements/iron-icons#^1.0.0",
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0",
"paper-styles": "PolymerElements/paper-styles#^1.0.0",
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
"web-component-tester": "^4.0.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
},
"ignore": []
}

16
dashboard-ui/bower_components/paper-button/demo/index.html vendored
View file

@ -117,6 +117,22 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
</style>
</template>
</demo-snippet>
<h3>Buttons can be used as a link</h3>
<demo-snippet class="centered-demo">
<template>
<a href="https://www.polymer-project.org/" tabindex="-1">
<paper-button raised>Polymer Project</paper-button>
</a>
<style>
a paper-button,
a:active paper-button,
a:visited paper-button {
color: #000;
}
</style>
</template>
</demo-snippet>
</div>
</body>
</html>

96
dashboard-ui/bower_components/paper-button/paper-button.html vendored
View file

@ -9,10 +9,9 @@ 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="../paper-material/paper-material.html">
<link rel="import" href="../paper-ripple/paper-ripple.html">
<link rel="import" href="../paper-behaviors/paper-button-behavior.html">
<link rel="import" href="../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../paper-behaviors/paper-button-behavior.html">
<link rel="import" href="../paper-material/paper-material.html">
<!--
Material design: [Buttons](https://www.google.com/design/spec/components/buttons.html)
@ -40,6 +39,14 @@ create a button with an icon and some text:
custom button content
</paper-button>
To use `paper-button` as a link, wrap it in an anchor tag. Since `paper-button` will already
receive focus, you may want to prevent the anchor tag from receiving focus as well by setting
its tabindex to -1.
<a href="https://www.polymer-project.org/" tabindex="-1">
<paper-button raised>Polymer Project</paper-button>
</a>
### Styling
Style the button with CSS as you would a normal DOM element.
@ -76,16 +83,17 @@ Custom property | Description | Default
<dom-module id="paper-button">
<template strip-whitespace>
<style include="paper-material">
:host {
display: inline-block;
@apply(--layout-inline);
@apply(--layout-center-center);
position: relative;
box-sizing: border-box;
min-width: 5.14em;
margin: 0 0.29em;
background: transparent;
text-align: center;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: transparent;
font: inherit;
text-transform: uppercase;
outline-width: 0;
@ -98,6 +106,7 @@ Custom property | Description | Default
z-index: 0;
padding: 0.7em 0.57em;
@apply(--paper-font-common-base);
@apply(--paper-button);
}
@ -123,50 +132,47 @@ Custom property | Description | Default
paper-ripple {
color: var(--paper-button-ink-color);
}
:host > ::content * {
text-transform: inherit;
}
</style>
<content></content>
</template>
</dom-module>
<script>
Polymer({
is: 'paper-button',
<script>
Polymer({
is: 'paper-button',
behaviors: [
Polymer.PaperButtonBehavior
],
behaviors: [
Polymer.PaperButtonBehavior
],
properties: {
/**
* If true, the button should be styled with a shadow.
*/
raised: {
type: Boolean,
reflectToAttribute: true,
value: false,
observer: '_calculateElevation'
}
},
_calculateElevation: function() {
if (!this.raised) {
this._setElevation(0);
} else {
Polymer.PaperButtonBehaviorImpl._calculateElevation.apply(this);
}
}
properties: {
/**
* If true, the button should be styled with a shadow.
*/
raised: {
type: Boolean,
reflectToAttribute: true,
value: false,
observer: '_calculateElevation'
}
},
Fired when the animation finishes.
This is useful if you want to wait until
the ripple animation finishes to perform some action.
_calculateElevation: function() {
if (!this.raised) {
this._setElevation(0);
} else {
Polymer.PaperButtonBehaviorImpl._calculateElevation.apply(this);
}
}
/**
Fired when the animation finishes.
This is useful if you want to wait until
the ripple animation finishes to perform some action.
@event transitionend
@param {{node: Object}} detail Contains the animated node.
*/
});
</script>
@event transitionend
Event param: {{node: Object}} detail Contains the animated node.
*/
});
</script>
</dom-module>