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

update button styles

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

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;
}
}

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);
};