mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
update menus
This commit is contained in:
parent
69a5028dee
commit
aa7ea8891c
33 changed files with 2850 additions and 1352 deletions
42
dashboard-ui/bower_components/paper-menu/.bower.json
vendored
Normal file
42
dashboard-ui/bower_components/paper-menu/.bower.json
vendored
Normal file
|
@ -0,0 +1,42 @@
|
|||
{
|
||||
"name": "paper-menu",
|
||||
"version": "1.0.0",
|
||||
"description": "Implements an accessible material design menu",
|
||||
"authors": "The Polymer Authors",
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"polymer",
|
||||
"menu"
|
||||
],
|
||||
"main": "paper-menu.html",
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/paper-menu"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/paper-menu",
|
||||
"ignore": [],
|
||||
"dependencies": {
|
||||
"iron-menu-behavior": "PolymerElements/iron-menu-behavior#^1.0.0",
|
||||
"paper-styles": "PolymerElements/paper-styles#^1.0.0",
|
||||
"polymer": "Polymer/polymer#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
|
||||
"paper-item": "PolymerElements/paper-item#^1.0.0",
|
||||
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
|
||||
"web-component-tester": "*",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||
},
|
||||
"_release": "1.0.0",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "v1.0.0",
|
||||
"commit": "0642450ec9df0fc0b1d909842f436c3dea79ed1e"
|
||||
},
|
||||
"_source": "git://github.com/PolymerElements/paper-menu.git",
|
||||
"_target": "~1.0.0",
|
||||
"_originalSource": "PolymerElements/paper-menu",
|
||||
"_direct": true
|
||||
}
|
1
dashboard-ui/bower_components/paper-menu/.gitignore
vendored
Normal file
1
dashboard-ui/bower_components/paper-menu/.gitignore
vendored
Normal file
|
@ -0,0 +1 @@
|
|||
bower_components/
|
32
dashboard-ui/bower_components/paper-menu/bower.json
vendored
Normal file
32
dashboard-ui/bower_components/paper-menu/bower.json
vendored
Normal file
|
@ -0,0 +1,32 @@
|
|||
{
|
||||
"name": "paper-menu",
|
||||
"version": "1.0.0",
|
||||
"description": "Implements an accessible material design menu",
|
||||
"authors": "The Polymer Authors",
|
||||
"keywords": [
|
||||
"web-components",
|
||||
"polymer",
|
||||
"menu"
|
||||
],
|
||||
"main": "paper-menu.html",
|
||||
"private": true,
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/PolymerElements/paper-menu"
|
||||
},
|
||||
"license": "http://polymer.github.io/LICENSE.txt",
|
||||
"homepage": "https://github.com/PolymerElements/paper-menu",
|
||||
"ignore": [],
|
||||
"dependencies": {
|
||||
"iron-menu-behavior": "PolymerElements/iron-menu-behavior#^1.0.0",
|
||||
"paper-styles": "PolymerElements/paper-styles#^1.0.0",
|
||||
"polymer": "Polymer/polymer#^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
|
||||
"paper-item": "PolymerElements/paper-item#^1.0.0",
|
||||
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
|
||||
"web-component-tester": "*",
|
||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||
}
|
||||
}
|
81
dashboard-ui/bower_components/paper-menu/demo/index.html
vendored
Normal file
81
dashboard-ui/bower_components/paper-menu/demo/index.html
vendored
Normal file
|
@ -0,0 +1,81 @@
|
|||
<!doctype html>
|
||||
<!--
|
||||
@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
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<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">
|
||||
|
||||
<title>paper-menu demo</title>
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
|
||||
<link rel="import" href="../../paper-item/paper-item.html">
|
||||
<link rel="import" href="../paper-menu.html">
|
||||
<link rel="import" href="../../paper-styles/paper-styles.html">
|
||||
<link rel="import" href="../../paper-styles/demo-pages.html">
|
||||
|
||||
<style>
|
||||
.horizontal-section {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
display: inline-block;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
background: #ccc;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="horizontal center-justified layout">
|
||||
<div>
|
||||
<h4>Standard</h4>
|
||||
<div class="horizontal-section">
|
||||
<paper-menu class="list">
|
||||
<paper-item>Inbox</paper-item>
|
||||
<paper-item>Starred</paper-item>
|
||||
<paper-item>Sent mail</paper-item>
|
||||
<paper-item>Drafts</paper-item>
|
||||
</paper-menu>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h4>Pre-selected</h4>
|
||||
<div class="horizontal-section">
|
||||
<paper-menu class="list" selected="0">
|
||||
<paper-item>Inbox</paper-item>
|
||||
<paper-item disabled>Starred</paper-item>
|
||||
<paper-item>Sent mail</paper-item>
|
||||
<paper-item>Drafts</paper-item>
|
||||
</paper-menu>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h4>Multi-select</h4>
|
||||
<div class="horizontal-section">
|
||||
<paper-menu class="list" multi>
|
||||
<paper-item>Bold</paper-item>
|
||||
<paper-item>Italic</paper-item>
|
||||
<paper-item>Underline</paper-item>
|
||||
<paper-item>Strikethrough</paper-item>
|
||||
</paper-menu>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
35
dashboard-ui/bower_components/paper-menu/hero.svg
vendored
Normal file
35
dashboard-ui/bower_components/paper-menu/hero.svg
vendored
Normal file
|
@ -0,0 +1,35 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 225 126" enable-background="new 0 0 225 126" xml:space="preserve">
|
||||
<g id="background" display="none">
|
||||
<rect display="inline" fill="#B0BEC5" width="225" height="126"/>
|
||||
</g>
|
||||
<g id="label">
|
||||
</g>
|
||||
<g id="art">
|
||||
<g>
|
||||
<circle cx="86.5" cy="39" r="4"/>
|
||||
<path d="M138,44c-2,0-3.6-2.4-4.6-4.6c-1.1-2.1-1.7-3.4-3-3.4s-2,1.3-3,3.4c-1.1,2.1-2.2,4.6-4.9,4.6c-2.6,0-3.8-2.4-4.9-4.6
|
||||
c-1.1-2.1-1.8-3.4-3.1-3.4c-1.3,0-2,1.3-3.1,3.4c-1.1,2.1-2.3,4.6-4.9,4.6c-2.6,0-4.1-2.4-5.1-4.6C100.3,37.3,100,36,98,36v-2
|
||||
c3,0,4.1,2.4,5.1,4.6c1.1,2.1,1.9,3.4,3.2,3.4c1.3,0,2.1-1.3,3.2-3.4c1.1-2.1,2.3-4.6,4.9-4.6c2.6,0,3.8,2.4,4.9,4.6
|
||||
c1.1,2.1,1.8,3.4,3.1,3.4c1.3,0,2-1.3,3.1-3.4c1.1-2.1,2.3-4.6,4.9-4.6s3.6,2.4,4.6,4.6c1.1,2.1,1.9,3.4,2.9,3.4V44z"/>
|
||||
<circle cx="86.5" cy="63" r="4"/>
|
||||
<path d="M138,68c-2,0-3.6-2.4-4.6-4.6c-1.1-2.1-1.7-3.4-3-3.4s-2,1.3-3,3.4c-1.1,2.1-2.2,4.6-4.9,4.6c-2.6,0-3.8-2.4-4.9-4.6
|
||||
c-1.1-2.1-1.8-3.4-3.1-3.4c-1.3,0-2,1.3-3.1,3.4c-1.1,2.1-2.3,4.6-4.9,4.6c-2.6,0-4.1-2.4-5.1-4.6C100.3,61.3,100,60,98,60v-2
|
||||
c3,0,4.1,2.4,5.1,4.6c1.1,2.1,1.9,3.4,3.2,3.4c1.3,0,2.1-1.3,3.2-3.4c1.1-2.1,2.3-4.6,4.9-4.6c2.6,0,3.8,2.4,4.9,4.6
|
||||
c1.1,2.1,1.8,3.4,3.1,3.4c1.3,0,2-1.3,3.1-3.4c1.1-2.1,2.3-4.6,4.9-4.6s3.6,2.4,4.6,4.6c1.1,2.1,1.9,3.4,2.9,3.4V68z"/>
|
||||
<circle cx="86.5" cy="88" r="4"/>
|
||||
<path d="M138,93c-2,0-3.6-2.4-4.6-4.6c-1.1-2.1-1.7-3.4-3-3.4s-2,1.3-3,3.4c-1.1,2.1-2.2,4.6-4.9,4.6c-2.6,0-3.8-2.4-4.9-4.6
|
||||
c-1.1-2.1-1.8-3.4-3.1-3.4c-1.3,0-2,1.3-3.1,3.4c-1.1,2.1-2.3,4.6-4.9,4.6c-2.6,0-4.1-2.4-5.1-4.6C100.3,86.3,100,85,98,85v-2
|
||||
c3,0,4.1,2.4,5.1,4.6c1.1,2.1,1.9,3.4,3.2,3.4c1.3,0,2.1-1.3,3.2-3.4c1.1-2.1,2.3-4.6,4.9-4.6c2.6,0,3.8,2.4,4.9,4.6
|
||||
c1.1,2.1,1.8,3.4,3.1,3.4c1.3,0,2-1.3,3.1-3.4c1.1-2.1,2.3-4.6,4.9-4.6s3.6,2.4,4.6,4.6c1.1,2.1,1.9,3.4,2.9,3.4V93z"/>
|
||||
<path d="M151,102H73V24h78V102z M75,100h74V26H75V100z"/>
|
||||
</g>
|
||||
<g id="ic_x5F_add_x0D_">
|
||||
</g>
|
||||
</g>
|
||||
<g id="Guides">
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 2.2 KiB |
30
dashboard-ui/bower_components/paper-menu/index.html
vendored
Normal file
30
dashboard-ui/bower_components/paper-menu/index.html
vendored
Normal file
|
@ -0,0 +1,30 @@
|
|||
<!doctype html>
|
||||
<!--
|
||||
@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
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
|
||||
|
||||
<title>paper-menu</title>
|
||||
|
||||
<script src="../webcomponentsjs/webcomponents-lite.js"></script>
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-component-page/iron-component-page.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<iron-component-page></iron-component-page>
|
||||
|
||||
</body>
|
||||
</html>
|
133
dashboard-ui/bower_components/paper-menu/paper-menu.html
vendored
Normal file
133
dashboard-ui/bower_components/paper-menu/paper-menu.html
vendored
Normal file
|
@ -0,0 +1,133 @@
|
|||
<!--
|
||||
@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
|
||||
-->
|
||||
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="../iron-menu-behavior/iron-menu-behavior.html">
|
||||
<link rel="import" href="../paper-styles/paper-styles.html">
|
||||
|
||||
<!--
|
||||
`<paper-menu>` implements an accessible menu control with Material Design styling. The focused item
|
||||
is highlighted, and the selected item has bolded text.
|
||||
|
||||
<paper-menu>
|
||||
<paper-item>Item 1</paper-item>
|
||||
<paper-item>Item 2</paper-item>
|
||||
</paper-menu>
|
||||
|
||||
Make a multi-select menu with the `multi` attribute. Items in a multi-select menu can be deselected,
|
||||
and multiple item can be selected.
|
||||
|
||||
<paper-menu multi>
|
||||
<paper-item>Item 1</paper-item>
|
||||
<paper-item>Item 2</paper-item>
|
||||
</paper-menu>
|
||||
|
||||
### Styling
|
||||
|
||||
The following custom properties and mixins are available for styling:
|
||||
|
||||
Custom property | Description | Default
|
||||
----------------|-------------|----------
|
||||
`--paper-menu-background-color` | Menu background color | `--primary-background-color`
|
||||
`-paper-menu-color` | Menu foreground color | `--primary-text-color`
|
||||
`--paper-menu-disabled-color` | Foreground color for a disabled item | `--disabled-text-color`
|
||||
`--paper-menu` | Mixin applied to the menu | `{}`
|
||||
`--paper-menu-selected-item` | Mixin applied to the selected item | `{}`
|
||||
`--paper-menu-focused-item` | Mixin applied to the focused item | `{}`
|
||||
`--paper-menu-focused-item-after` | Mixin applied to the ::after pseudo-element for the focused item | `{}`
|
||||
|
||||
### Accessibility
|
||||
|
||||
`<paper-menu>` has `role="menu"` by default. A multi-select menu will also have
|
||||
`aria-multiselectable` set. It implements key bindings to navigate through the menu with the up and
|
||||
down arrow keys, esc to exit the menu, and enter to activate a menu item. Typing the first letter
|
||||
of a menu item will also focus it.
|
||||
|
||||
@group Paper Elements
|
||||
@element paper-menu
|
||||
@hero hero.svg
|
||||
@demo demo/index.html
|
||||
-->
|
||||
|
||||
<dom-module id="paper-menu">
|
||||
|
||||
<style>
|
||||
|
||||
:host {
|
||||
display: block;
|
||||
padding: 8px 0;
|
||||
|
||||
background: var(--paper-menu-background-color, --primary-background-color);
|
||||
color: var(--paper-menu-color, --primary-text-color);
|
||||
|
||||
@apply(--paper-menu);
|
||||
}
|
||||
|
||||
/* need a wrapper element to make this higher specificity than the :host rule in paper-item */
|
||||
.content > ::content > .iron-selected {
|
||||
font-weight: bold;
|
||||
|
||||
@apply(--paper-menu-selected-item);
|
||||
}
|
||||
|
||||
.content > ::content > [disabled] {
|
||||
color: var(--paper-menu-disabled-color, --disabled-text-color);
|
||||
}
|
||||
|
||||
.content > ::content > *:focus {
|
||||
position: relative;
|
||||
outline: 0;
|
||||
|
||||
@apply(--paper-menu-colored-focused-item);
|
||||
}
|
||||
|
||||
.content > ::content > *:focus:after {
|
||||
@apply(--layout-fit);
|
||||
background: currentColor;
|
||||
/* FIXME move to paper-styles for next widget */
|
||||
opacity: 0.12;
|
||||
content: '';
|
||||
|
||||
@apply(--paper-menu-colored-focused-item-after);
|
||||
}
|
||||
|
||||
.content > ::content > *[colored]:focus:after {
|
||||
opacity: 0.26;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<template>
|
||||
|
||||
<div class="content">
|
||||
<content></content>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
</dom-module>
|
||||
|
||||
<script>
|
||||
|
||||
(function() {
|
||||
|
||||
Polymer({
|
||||
|
||||
is: 'paper-menu',
|
||||
|
||||
behaviors: [
|
||||
Polymer.IronMenuBehavior
|
||||
]
|
||||
|
||||
});
|
||||
|
||||
})();
|
||||
|
||||
</script>
|
34
dashboard-ui/bower_components/paper-menu/test/index.html
vendored
Normal file
34
dashboard-ui/bower_components/paper-menu/test/index.html
vendored
Normal file
|
@ -0,0 +1,34 @@
|
|||
<!doctype html>
|
||||
<!--
|
||||
@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
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<title>paper-menu tests</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="../../web-component-tester/browser.js"></script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<script>
|
||||
|
||||
WCT.loadSuites([
|
||||
'paper-menu.html'
|
||||
]);
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
67
dashboard-ui/bower_components/paper-menu/test/paper-menu.html
vendored
Normal file
67
dashboard-ui/bower_components/paper-menu/test/paper-menu.html
vendored
Normal file
|
@ -0,0 +1,67 @@
|
|||
<!doctype html>
|
||||
<!--
|
||||
@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
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<title>paper-menu tests</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>
|
||||
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
<script src="../../test-fixture/test-fixture-mocha.js"></script>
|
||||
|
||||
<link rel="import" href="../../test-fixture/test-fixture.html">
|
||||
<link rel="import" href="../paper-menu.html">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<test-fixture id="basic">
|
||||
<template>
|
||||
<paper-menu>
|
||||
<div>item 1</div>
|
||||
<div>item 2</div>
|
||||
<div>item 3</div>
|
||||
</paper-menu>
|
||||
</template>
|
||||
</test-fixture>
|
||||
|
||||
<script>
|
||||
|
||||
suite('<paper-menu>', function() {
|
||||
var menu;
|
||||
|
||||
setup(function() {
|
||||
menu = fixture('basic');
|
||||
});
|
||||
|
||||
test('selected item is styled', function() {
|
||||
|
||||
var boldDiv = document.createElement('div');
|
||||
boldDiv.style.fontWeight = 'bold';
|
||||
document.body.appendChild(boldDiv);
|
||||
|
||||
menu.selected = 1;
|
||||
|
||||
assert.equal(getComputedStyle(menu.selectedItem).fontWeight,
|
||||
getComputedStyle(boldDiv).fontWeight, 'selected item is bold');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
Loading…
Add table
Add a link
Reference in a new issue