mirror of
https://github.com/pandorafms/pandorafms.git
synced 2025-07-28 08:14:38 +02:00
Added outter shadow to notifications messages box
Former-commit-id: 1eed4b4f2ef7d58dbab73ccb2628bb0ef9ffc7ca
This commit is contained in:
parent
0124bd0a17
commit
d5d58e5b2b
@ -386,23 +386,25 @@ config_check();
|
|||||||
?>
|
?>
|
||||||
|
|
||||||
function addNotifications(event) {
|
function addNotifications(event) {
|
||||||
var elements = document.getElementsByClassName("notification-wrapper");
|
var element = document.getElementById("notification-content");
|
||||||
if (!elements) return;
|
if (!element) return;
|
||||||
Array.prototype.forEach.call(elements, function(elem) {
|
element.style.display = "block";
|
||||||
toggle_element(elem);
|
|
||||||
});
|
|
||||||
attatch_to_image();
|
attatch_to_image();
|
||||||
}
|
}
|
||||||
|
|
||||||
function attatch_to_image() {
|
function attatch_to_image() {
|
||||||
var notification_elems = document.getElementsByClassName("notification-wrapper");
|
var notification_elem = document.getElementById("notification-wrapper");
|
||||||
var image_attached = document.getElementById("notification-ball-header").getBoundingClientRect().left;
|
var image_attached =
|
||||||
Array.prototype.forEach.call(notification_elems, function(elem) {
|
document.getElementById("notification-ball-header")
|
||||||
elem.style.left = image_attached - 300 + "px";
|
.getBoundingClientRect()
|
||||||
});
|
.left
|
||||||
|
;
|
||||||
|
notification_elem.style.left = image_attached - 300 + "px";
|
||||||
}
|
}
|
||||||
function toggle_element(elem) {
|
|
||||||
elem.style.display = elem.style.display === "none" ? "block" : "none";
|
function notifications_hide() {
|
||||||
|
var element = document.getElementById("notification-content");
|
||||||
|
element.style.display = "none"
|
||||||
}
|
}
|
||||||
|
|
||||||
// Resize event
|
// Resize event
|
||||||
|
@ -831,8 +831,15 @@ function notifications_print_dropdown()
|
|||||||
}
|
}
|
||||||
|
|
||||||
return sprintf(
|
return sprintf(
|
||||||
"<div class='notification-wrapper' style='display:none;'>
|
"<div id='notification-content' style='display:none;'>
|
||||||
|
<div id='notification-wrapper'>
|
||||||
%s
|
%s
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
id='notification-wrapper-shadow'
|
||||||
|
onclick='notifications_hide()'
|
||||||
|
>
|
||||||
|
</div>
|
||||||
</div>",
|
</div>",
|
||||||
array_reduce(
|
array_reduce(
|
||||||
$mess,
|
$mess,
|
||||||
|
@ -4929,7 +4929,7 @@ div#dialog_messages table th:last-child {
|
|||||||
background-color: #fc4444;
|
background-color: #fc4444;
|
||||||
}
|
}
|
||||||
|
|
||||||
.notification-wrapper {
|
#notification-wrapper {
|
||||||
background: white;
|
background: white;
|
||||||
border: #a5a5a5 solid 1px;
|
border: #a5a5a5 solid 1px;
|
||||||
z-index: 900000;
|
z-index: 900000;
|
||||||
@ -4937,7 +4937,7 @@ div#dialog_messages table th:last-child {
|
|||||||
width: 400px;
|
width: 400px;
|
||||||
margin-top: -5px;
|
margin-top: -5px;
|
||||||
}
|
}
|
||||||
.notification-wrapper::before {
|
#notification-wrapper::before {
|
||||||
content: "";
|
content: "";
|
||||||
display: block;
|
display: block;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -4952,6 +4952,15 @@ div#dialog_messages table th:last-child {
|
|||||||
margin-left: -12px;
|
margin-left: -12px;
|
||||||
border-bottom-color: white;
|
border-bottom-color: white;
|
||||||
}
|
}
|
||||||
|
#notification-wrapper-shadow {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
background: #111;
|
||||||
|
position: fixed;
|
||||||
|
z-index: 9009;
|
||||||
|
top: 0;
|
||||||
|
opacity: 0.3;
|
||||||
|
}
|
||||||
.notification-item {
|
.notification-item {
|
||||||
background: whitesmoke;
|
background: whitesmoke;
|
||||||
height: 100px;
|
height: 100px;
|
||||||
|
Loading…
x
Reference in New Issue
Block a user