mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
update components
This commit is contained in:
parent
823f69bb92
commit
db0bac5a2b
22 changed files with 113 additions and 91 deletions
|
@ -1,4 +1,4 @@
|
|||
[is="emby-select"] {
|
||||
.emby-select {
|
||||
display: block;
|
||||
margin: 0;
|
||||
margin-bottom: 0 !important;
|
||||
|
@ -25,7 +25,7 @@
|
|||
appearance: none;
|
||||
}
|
||||
|
||||
[is="emby-select"] option {
|
||||
.emby-select option {
|
||||
color: initial;
|
||||
}
|
||||
|
||||
|
@ -64,7 +64,7 @@
|
|||
transform-origin: center center;
|
||||
}
|
||||
|
||||
[is="emby-select"]:focus + .emby-select-selectionbar {
|
||||
.emby-select:focus + .emby-select-selectionbar {
|
||||
background-color: #52B54B;
|
||||
transform: none;
|
||||
}
|
||||
|
|
|
@ -140,31 +140,33 @@
|
|||
|
||||
EmbySelectPrototype.attachedCallback = function () {
|
||||
|
||||
if (this.getAttribute('data-embyselect') != 'true') {
|
||||
this.setAttribute('data-embyselect', 'true');
|
||||
|
||||
var label = this.ownerDocument.createElement('label');
|
||||
label.innerHTML = this.getAttribute('label') || '';
|
||||
label.classList.add('selectLabel');
|
||||
label.classList.add('selectLabelUnfocused');
|
||||
label.htmlFor = this.id;
|
||||
this.parentNode.insertBefore(label, this);
|
||||
|
||||
var div = document.createElement('div');
|
||||
div.classList.add('emby-select-selectionbar');
|
||||
this.parentNode.insertBefore(div, this.nextSibling);
|
||||
|
||||
var arrowContainer = document.createElement('div');
|
||||
arrowContainer.classList.add('selectArrowContainer');
|
||||
arrowContainer.innerHTML = '<div style="visibility:hidden;">0</div>';
|
||||
this.parentNode.appendChild(arrowContainer);
|
||||
|
||||
var arrow = document.createElement('i');
|
||||
arrow.classList.add('md-icon');
|
||||
arrow.classList.add('selectArrow');
|
||||
arrow.innerHTML = '';
|
||||
arrowContainer.appendChild(arrow);
|
||||
if (this.classList.contains('emby-select')) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.classList.add('emby-select');
|
||||
|
||||
var label = this.ownerDocument.createElement('label');
|
||||
label.innerHTML = this.getAttribute('label') || '';
|
||||
label.classList.add('selectLabel');
|
||||
label.classList.add('selectLabelUnfocused');
|
||||
label.htmlFor = this.id;
|
||||
this.parentNode.insertBefore(label, this);
|
||||
|
||||
var div = document.createElement('div');
|
||||
div.classList.add('emby-select-selectionbar');
|
||||
this.parentNode.insertBefore(div, this.nextSibling);
|
||||
|
||||
var arrowContainer = document.createElement('div');
|
||||
arrowContainer.classList.add('selectArrowContainer');
|
||||
arrowContainer.innerHTML = '<div style="visibility:hidden;">0</div>';
|
||||
this.parentNode.appendChild(arrowContainer);
|
||||
|
||||
var arrow = document.createElement('i');
|
||||
arrow.classList.add('md-icon');
|
||||
arrow.classList.add('selectArrow');
|
||||
arrow.innerHTML = '';
|
||||
arrowContainer.appendChild(arrow);
|
||||
};
|
||||
|
||||
document.registerElement('emby-select', {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue