';
+ html += getIcon('dialog:arrow-back', 'btnPromptExit', false);
}
if (options.title) {
diff --git a/dashboard-ui/bower_components/emby-webcomponents/slideshow/slideshow.js b/dashboard-ui/bower_components/emby-webcomponents/slideshow/slideshow.js
index ba9b88c196..65569594bd 100644
--- a/dashboard-ui/bower_components/emby-webcomponents/slideshow/slideshow.js
+++ b/dashboard-ui/bower_components/emby-webcomponents/slideshow/slideshow.js
@@ -1,4 +1,4 @@
-define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'focusManager', 'apphost', 'css!./style', 'html!./icons', 'iron-icon-set', 'paper-icon-button', 'paper-spinner'], function (dialogHelper, inputmanager, connectionManager, layoutManager, focusManager, appHost) {
+define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'focusManager', 'apphost', 'css!./style', 'html!./icons', 'iron-icon-set', 'paper-icon-button-light', 'paper-spinner'], function (dialogHelper, inputmanager, connectionManager, layoutManager, focusManager, appHost) {
function getImageUrl(item, options, apiClient) {
@@ -96,6 +96,13 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
}
}
+ function getIcon(icon, cssClass, canFocus, autoFocus) {
+
+ var tabIndex = canFocus ? '' : ' tabindex="-1"';
+ autoFocus = autoFocus ? ' autofocus' : '';
+ return '
';
+ }
+
return function (options) {
var self = this;
@@ -125,31 +132,30 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
html += '
';
html += '
';
- html += '
';
- html += '
';
+ html += getIcon('slideshow:keyboard-arrow-left', 'btnSlideshowPrevious slideshowButton', false);
+ html += getIcon('slideshow:keyboard-arrow-right', 'btnSlideshowNext slideshowButton', false);
html += '
';
if (!actionButtonsOnTop) {
html += '
';
- //html += '
';
- html += '
';
+ html += getIcon('slideshow:pause', 'btnSlideshowPause slideshowButton', true, true);
if (appHost.supports('filedownload')) {
- html += '
';
+ html += getIcon('slideshow:file-download', 'btnDownload slideshowButton', true);
}
if (appHost.supports('sharing')) {
- html += '
';
+ html += getIcon('slideshow:share', 'btnShare slideshowButton', true);
}
html += '
';
@@ -361,7 +367,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
function play() {
- var btnSlideshowPause = dlg.querySelector('.btnSlideshowPause');
+ var btnSlideshowPause = dlg.querySelector('.btnSlideshowPause iron-icon');
if (btnSlideshowPause) {
btnSlideshowPause.icon = "slideshow:pause";
}
@@ -371,7 +377,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
function pause() {
- var btnSlideshowPause = dlg.querySelector('.btnSlideshowPause');
+ var btnSlideshowPause = dlg.querySelector('.btnSlideshowPause iron-icon');
if (btnSlideshowPause) {
btnSlideshowPause.icon = "slideshow:play-arrow";
}
@@ -381,7 +387,7 @@ define(['dialogHelper', 'inputManager', 'connectionManager', 'layoutManager', 'f
function playPause() {
- var paused = dlg.querySelector('.btnSlideshowPause').icon != "slideshow:pause";
+ var paused = dlg.querySelector('.btnSlideshowPause iron-icon').icon != "slideshow:pause";
if (paused) {
play();
} else {
diff --git a/dashboard-ui/bower_components/emby-webcomponents/slideshow/style.css b/dashboard-ui/bower_components/emby-webcomponents/slideshow/style.css
index 8395c5273d..08c7f64ec9 100644
--- a/dashboard-ui/bower_components/emby-webcomponents/slideshow/style.css
+++ b/dashboard-ui/bower_components/emby-webcomponents/slideshow/style.css
@@ -45,7 +45,7 @@
top: 50%;
}
-.slideshowDialog paper-icon-button {
+.slideshowDialog .slideshowButton {
width: 5.2vh;
height: 5.2vh;
color: #fff;
@@ -54,7 +54,7 @@
min-height: 40px;
}
-.layout-tv .slideshowDialog paper-icon-button {
+.layout-tv .slideshowDialog .slideshowButtonn {
width: 7vh;
height: 7vh;
}
diff --git a/dashboard-ui/bower_components/iron-icon/.bower.json b/dashboard-ui/bower_components/iron-icon/.bower.json
index 9784e3a3b7..f0167baf13 100644
--- a/dashboard-ui/bower_components/iron-icon/.bower.json
+++ b/dashboard-ui/bower_components/iron-icon/.bower.json
@@ -32,14 +32,14 @@
"web-component-tester": "^4.0.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
},
- "homepage": "https://github.com/PolymerElements/iron-icon",
+ "homepage": "https://github.com/polymerelements/iron-icon",
"_release": "1.0.8",
"_resolution": {
"type": "version",
"tag": "v1.0.8",
"commit": "f36b38928849ef3853db727faa8c9ef104d611eb"
},
- "_source": "git://github.com/PolymerElements/iron-icon.git",
+ "_source": "git://github.com/polymerelements/iron-icon.git",
"_target": "^1.0.0",
- "_originalSource": "PolymerElements/iron-icon"
+ "_originalSource": "polymerelements/iron-icon"
}
\ No newline at end of file
diff --git a/dashboard-ui/bower_components/iron-selector/.bower.json b/dashboard-ui/bower_components/iron-selector/.bower.json
index 1da99816d3..e5306ccfc9 100644
--- a/dashboard-ui/bower_components/iron-selector/.bower.json
+++ b/dashboard-ui/bower_components/iron-selector/.bower.json
@@ -36,7 +36,7 @@
"tag": "v1.5.1",
"commit": "e3e34408fad8f7cde59c4255cf3fe90f7dcf91d8"
},
- "_source": "git://github.com/polymerelements/iron-selector.git",
+ "_source": "git://github.com/PolymerElements/iron-selector.git",
"_target": "^1.0.0",
- "_originalSource": "polymerelements/iron-selector"
+ "_originalSource": "PolymerElements/iron-selector"
}
\ No newline at end of file
diff --git a/dashboard-ui/components/metadataeditor/metadataeditor.js b/dashboard-ui/components/metadataeditor/metadataeditor.js
index aa8cc9d6be..673db258d9 100644
--- a/dashboard-ui/components/metadataeditor/metadataeditor.js
+++ b/dashboard-ui/components/metadataeditor/metadataeditor.js
@@ -1,4 +1,4 @@
-define(['dialogHelper', 'datetime', 'jQuery', 'paper-checkbox', 'paper-input', 'paper-item-body', 'paper-icon-item', 'paper-textarea', 'paper-fab'], function (dialogHelper, $, datetime) {
+define(['dialogHelper', 'datetime', 'jQuery', 'paper-checkbox', 'paper-input', 'paper-item-body', 'paper-icon-item', 'paper-textarea', 'paper-fab'], function (dialogHelper, datetime, $) {
var currentContext;
var metadataEditorInfo;
diff --git a/dashboard-ui/css/librarymenu.css b/dashboard-ui/css/librarymenu.css
index 240504c176..769d7293bd 100644
--- a/dashboard-ui/css/librarymenu.css
+++ b/dashboard-ui/css/librarymenu.css
@@ -210,7 +210,7 @@
}
.dashboardDocument .viewMenuBar {
- background-color: #43A047;
+ background-color: #222;
box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
height: auto;
}
@@ -224,7 +224,6 @@
}
.dashboardDocument .viewMenuBar #selectionBar {
- background: #fff !important;
height: 3px;
}
diff --git a/dashboard-ui/css/notifications.css b/dashboard-ui/css/notifications.css
index 72736892a6..15302c3db5 100644
--- a/dashboard-ui/css/notifications.css
+++ b/dashboard-ui/css/notifications.css
@@ -11,7 +11,7 @@
font-weight: 500;
position: relative;
border-radius: 1000px;
- background: #2E7D32;
+ background: #444;
line-height: 28px;
min-width: 30px;
display: inline-flex;
@@ -21,7 +21,7 @@
}
.levelNormal {
- background-color: #444;
+ background-color: #43A047;
}
.levelWarning {
diff --git a/dashboard-ui/css/polymer/paper-icon-button-light.css b/dashboard-ui/css/polymer/paper-icon-button-light.css
new file mode 100644
index 0000000000..9792204979
--- /dev/null
+++ b/dashboard-ui/css/polymer/paper-icon-button-light.css
@@ -0,0 +1,19 @@
+[is=paper-icon-button-light] {
+ width: 40px;
+ height: 40px;
+ padding: .5em;
+}
+
+ [is=paper-icon-button-light] iron-icon, [is=paper-icon-button-light] img {
+ width: 100%;
+ height: 100%;
+ }
+
+ [is=paper-icon-button-light] #background {
+ transition: opacity .3s ease-out;
+ }
+
+ [is=paper-icon-button-light]:focus #background {
+ background-color: currentcolor !important;
+ opacity: .2 !important;
+ }
diff --git a/dashboard-ui/css/site.css b/dashboard-ui/css/site.css
index 01a8972837..c1818b075c 100644
--- a/dashboard-ui/css/site.css
+++ b/dashboard-ui/css/site.css
@@ -489,7 +489,7 @@ div[data-role='page'] {
outline: none;
}
-a[data-role='button'], button:not([data-role='none']):not(.clearButton) {
+a[data-role='button'], .type-interior button:not([data-role='none']):not(.clearButton) {
-webkit-font-smoothing: antialiased;
-webkit-user-select: none;
background-clip: padding-box;
@@ -512,24 +512,18 @@ a[data-role='button'], button:not([data-role='none']):not(.clearButton) {
box-shadow: 0 1px 3px /*{global-box-shadow-size}*/ rgba(0,0,0,.15) /*{global-box-shadow-color}*/;
}
- a[data-role='button'][data-iconpos='notext'], button[data-iconpos='notext']:not([data-role='none']):not(.clearButton) {
+ a[data-role='button'][data-iconpos='notext'], .type-interior button[data-iconpos='notext']:not([data-role='none']):not(.clearButton) {
padding: 4px;
border-radius: 50px;
outline: 0;
}
- a[data-role='button']:not([data-inline='true']), button:not([data-role='none']):not([data-inline='true']):not(.clearButton) {
+ a[data-role='button']:not([data-inline='true']), .type-interior button:not([data-role='none']):not([data-inline='true']):not(.clearButton) {
display: block;
margin: .5em 0 !important;
}
- a[data-role='button']:focus, button:not([data-role='none']):focus {
- -webkit-box-shadow: 0 0 12px #3388cc /*{a-active-background-color}*/;
- -moz-box-shadow: 0 0 12px #3388cc /*{a-active-background-color}*/;
- box-shadow: 0 0 12px #3388cc /*{a-active-background-color}*/;
- }
-
-button:not([data-role='none']):not([data-inline='true']):not(.clearButton) {
+.type-interior button:not([data-role='none']):not([data-inline='true']):not(.clearButton) {
width: 100%;
}
diff --git a/dashboard-ui/scripts/librarymenu.js b/dashboard-ui/scripts/librarymenu.js
index 4550c28e27..e777b03116 100644
--- a/dashboard-ui/scripts/librarymenu.js
+++ b/dashboard-ui/scripts/librarymenu.js
@@ -9,37 +9,36 @@
html += '
';
var backIcon = browserInfo.safari ? 'chevron-left' : 'arrow-back';
- html += '';
+ html += '';
- html += '
';
-
- html += '';
+ html += '
';
+ html += '';
html += '';
html += '';
@@ -108,26 +107,15 @@
function updateHeaderUserButton(headerUserButton, src, icon) {
- var oldButton = headerUserButton;
-
- // There seems to be a bug in paper-icon-button where it doesn't refresh it's display after switching between icon and src image
- // So work around that by just replacing the element altogether
-
- var headerUserButton = document.createElement('paper-icon-button');
- headerUserButton.className = oldButton.className;
- headerUserButton.addEventListener('click', onHeaderUserButtonClick);
-
if (src) {
headerUserButton.classList.add('headerUserButtonRound');
- headerUserButton.src = src;
+ headerUserButton.innerHTML = '
';
} else if (icon) {
headerUserButton.classList.remove('headerUserButtonRound');
- headerUserButton.icon = icon;
+ headerUserButton.innerHTML = '
';
} else {
headerUserButton.classList.remove('headerUserButtonRound');
}
-
- oldButton.parentNode.replaceChild(headerUserButton, oldButton);
}
function updateLocalUser(user) {
@@ -208,7 +196,7 @@
html += '