Fixed up notification styling a little

This commit is contained in:
Dan Brown 2018-03-18 11:58:45 +00:00
parent d44e0b7964
commit 8828adfc9c
No known key found for this signature in database
GPG Key ID: 46D9F943C24A2EF9
2 changed files with 7 additions and 3 deletions

View File

@ -18,7 +18,7 @@ class Notification {
show(textToShow = '') {
this.elem.removeEventListener('transitionend', this.hideCleanup);
this.textElem.textContent = textToShow;
this.elem.style.display = 'block';
this.elem.style.display = 'grid';
setTimeout(() => {
this.elem.classList.add('showing');
}, 1);

View File

@ -10,8 +10,8 @@
box-shadow: $bs-med;
z-index: 999999;
cursor: pointer;
max-width: 480px;
transition: transform ease-in-out 360ms;
max-width: 360px;
transition: transform ease-in-out 280ms;
transform: translate3d(580px, 0, 0);
display: grid;
grid-template-columns: 64px 1fr;
@ -27,6 +27,7 @@
}
span {
vertical-align: middle;
line-height: 1.3;
}
&.pos {
background-color: $positive;
@ -43,6 +44,9 @@
&.showing {
transform: translate3d(0, 0, 0);
}
&.showing:hover {
transform: translate3d(0, -2px, 0);
}
}
[chapter-toggle] {