mirror_php/formwork
1
0
Fork 0
mirror of https://github.com/getformwork/formwork.git synced 2025-01-17 21:49:04 +01:00
Code Issues Packages Projects Releases Wiki Activity

Make notifications disappear by clicking on them (closes #3)

Browse Source
This commit is contained in:
Giuseppe Criscione 2018-07-23 22:24:40 +02:00
parent a3a8476f8d
commit 3b983e056a
6 changed files with 49 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
admin/assets/css/admin.css
View File

@ -1769,9 +1769,13 @@ label {
border-radius: 3px;
background-color: #f0f0f0;
box-shadow: rgba(0, 0, 0, 0.15) 1px 1px 9px 0;
transition: top 300ms ease-in;
cursor: default;
transition: top 300ms ease-in, opacity 150ms;
animation: fadeInRight 300ms cubic-bezier(0.4, 0, 0.2, 1); }
.notification:hover {
opacity: 0.95; }
.notification.fadeout {
opacity: 0;
animation: fadeOutRight 300ms cubic-bezier(0.4, 0, 0.2, 1); }

2
admin/assets/css/admin.min.css vendored
View File

File diff suppressed because one or more lines are too long

21
admin/assets/js/app.js
View File

@ -441,14 +441,28 @@ Formwork.Notification = function(text, type, interval) {
$notification.appendTo('body');
setTimeout(function() {
var timer = setTimeout(remove, interval);
$notification.click(remove);
$notification.mouseenter(function() {
clearTimeout(timer);
});
$notification.mouseleave(function() {
timer = setTimeout(remove, 1000);
});
function remove() {
var found = false;
var offset = $notification.outerHeight(true);
$('.notification').each(function() {
var $this = $(this);
if ($this.is($notification)) {
found = true;
$this.addClass('fadeout');
} else {
} else if (found) {
$this.css('top', '-=' + offset);
}
});
@ -457,7 +471,8 @@ Formwork.Notification = function(text, type, interval) {
$notification.remove();
}, 400);
}, interval);
}
};
Formwork.Pages = {

2
admin/assets/js/app.min.js vendored
View File

File diff suppressed because one or more lines are too long

21
admin/assets/js/src/components/notification.js
View File

@ -15,14 +15,28 @@ Formwork.Notification = function(text, type, interval) {
$notification.appendTo('body');
setTimeout(function() {
var timer = setTimeout(remove, interval);
$notification.click(remove);
$notification.mouseenter(function() {
clearTimeout(timer);
});
$notification.mouseleave(function() {
timer = setTimeout(remove, 1000);
});
function remove() {
var found = false;
var offset = $notification.outerHeight(true);
$('.notification').each(function() {
var $this = $(this);
if ($this.is($notification)) {
found = true;
$this.addClass('fadeout');
} else {
} else if (found) {
$this.css('top', '-=' + offset);
}
});
@ -31,5 +45,6 @@ Formwork.Notification = function(text, type, interval) {
$notification.remove();
}, 400);
}, interval);
}
};

7
admin/assets/scss/components/_notifications.scss
View File

@ -9,10 +9,15 @@
border-radius: 3px;
background-color: $color-gray-xlight;
box-shadow: rgba(0, 0, 0, 0.15) 1px 1px 9px 0;
transition: top 300ms ease-in;
cursor: default;
transition: top 300ms ease-in, opacity 150ms;
animation: fadeInRight 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
}
.notification:hover {
opacity: 0.95;
}
.notification.fadeout {
opacity: 0;
animation: fadeOutRight 300ms cubic-bezier(0.4, 0.0, 0.2, 1);