notifications position fix, bumped version number
This commit is contained in:
parent
d9d004468a
commit
04f77806ac
4 changed files with 18 additions and 14 deletions
|
@ -12,8 +12,8 @@ html(xmlns='http://www.w3.org/1999/xhtml', lang='en', xml:lang="en")
|
|||
//meta(name="twitter:image" content="https://thetwelfth.house/base-assets/images/current.png")
|
||||
link(rel='stylesheet', href="/assets/css/dash.css", type='text/css')
|
||||
body
|
||||
#notifications.notifications.notify-close
|
||||
#notifyMessage.notifyMessage
|
||||
#notifications.notifications
|
||||
#notifyMessage.notifyMessage.notify-close
|
||||
.notify-icon#notify-good
|
||||
svg(viewBox="0 0 20 20" class="icons")
|
||||
use#submit-update(xlink:href='/assets/images/global/sprite.svg#entypo-emoji-flirt')
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "fipamo-development",
|
||||
"version": "1.2.2",
|
||||
"version": "1.2.3",
|
||||
"private": true,
|
||||
"description": "The most chill blog framework ever.",
|
||||
"repository": "https://code.playvicio.us/Are0h/Fipamo",
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
import anime from 'animejs/lib/anime.es.js';
|
||||
const notifcation = document.getElementById('notifications');
|
||||
const notify = document.getElementById('notifyMessage');
|
||||
const messageText = document.getElementById('message-text');
|
||||
const iconGood = document.getElementById('notify-good');
|
||||
const iconLame = document.getElementById('notify-lame');
|
||||
|
@ -15,7 +16,7 @@ export default class Notfications {
|
|||
//--------------------------
|
||||
|
||||
alert(text, status) {
|
||||
//notifcation.style.display = 'flex';
|
||||
notifcation.style.display = 'block';
|
||||
iconWorking.style.display = 'none';
|
||||
iconGood.style.display = 'none';
|
||||
iconLame.style.display = 'none';
|
||||
|
@ -35,8 +36,8 @@ export default class Notfications {
|
|||
iconWorking.style.display = 'block';
|
||||
}
|
||||
|
||||
notifcation.classList.remove('notify-close');
|
||||
notifcation.classList.add('notify-open');
|
||||
notify.classList.remove('notify-close');
|
||||
notify.classList.add('notify-open');
|
||||
messageText.innerHTML = text;
|
||||
anime({
|
||||
targets: messageText,
|
||||
|
@ -46,8 +47,11 @@ export default class Notfications {
|
|||
complete: () => {
|
||||
if (status !== null) {
|
||||
setTimeout(() => {
|
||||
notifcation.classList.add('notify-close');
|
||||
notifcation.classList.remove('notify-open');
|
||||
notify.addEventListener('transitionend', () => {
|
||||
notifcation.style.display = 'none';
|
||||
});
|
||||
notify.classList.add('notify-close');
|
||||
notify.classList.remove('notify-open');
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -2,7 +2,6 @@ html, body
|
|||
background-color $primary - 60%
|
||||
font 400 1em $baseType
|
||||
height 100%
|
||||
perspective: 1000px
|
||||
|
||||
a
|
||||
font 300 1em $baseType
|
||||
|
@ -18,19 +17,21 @@ svg.icons
|
|||
fill $secondary
|
||||
|
||||
#notifications
|
||||
perspective 1000px
|
||||
position fixed
|
||||
z-index 2000
|
||||
height 10%
|
||||
width 100%
|
||||
display block
|
||||
display none
|
||||
align-items center
|
||||
justify-content center
|
||||
padding 0
|
||||
margin 0
|
||||
transform-origin: 50% 0;
|
||||
transition all 0.5s cubic-bezier(.83,.05,.28,1.0)//ks-easing( "out-back" );
|
||||
|
||||
|
||||
#notifyMessage
|
||||
margin 0 auto
|
||||
transition all 0.5s cubic-bezier(.83,.05,.28,1.0)//ks-easing( "out-back" );
|
||||
//padding-top -125px
|
||||
height 50px;
|
||||
width 500px
|
||||
|
@ -38,6 +39,7 @@ svg.icons
|
|||
align-items center
|
||||
justify-content center
|
||||
opacity: 1
|
||||
transform-origin: 50% 0;
|
||||
#notify-good, #notify-lame, #notify-working
|
||||
display: none
|
||||
.notify-icon
|
||||
|
@ -63,12 +65,10 @@ svg.icons
|
|||
|
||||
.notify-close
|
||||
transform-style preserve-3d
|
||||
|
||||
transform: rotateX(-120deg)
|
||||
|
||||
.notify-open
|
||||
transform-style preserve-3d
|
||||
//-origin: 50% 0;
|
||||
transform: rotateX(0deg)
|
||||
.blog-container
|
||||
width 100%
|
||||
|
|
Loading…
Reference in a new issue