13146-Change header notifications styles
This commit is contained in:
Pablo Aragon
parent
3e5ecb6574
commit
c2d00123e5
|
|
@ -599,21 +599,12 @@ echo sprintf('<div id="header_table" class="header_table_%s">', $menuTypeClass);
|
|||
function filter_notification() {
|
||||
let notification_type = '';
|
||||
$('.notification-item').hide();
|
||||
$(".checkbox_filter_notifications:checkbox:checked").each(function() {
|
||||
notification_type = $(this).val();
|
||||
console.log(notification_type);
|
||||
$('.notification-item[value='+notification_type+']').show();
|
||||
if (notification_type == 'All'){
|
||||
$('.notification-item').show();
|
||||
}
|
||||
});
|
||||
notification_type = $("#notifications_filter_options").val()
|
||||
|
||||
if (notification_type == 'All'){
|
||||
if (notification_type === 'All') {
|
||||
$('.notification-item').show();
|
||||
}
|
||||
|
||||
if (notification_type == ''){
|
||||
$('.notification-item').hide();
|
||||
} else {
|
||||
$('.notification-item[value='+notification_type+']').show();
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1066,39 +1066,39 @@ function notification_filter()
|
|||
}
|
||||
|
||||
$types_list = array_unique($types_list);
|
||||
$notification_filter = "<ul id='menu-filter_notification'>";
|
||||
$notification_filter = '';
|
||||
$filter_options = [];
|
||||
|
||||
$notification_filter .= "<li>
|
||||
<input type='checkbox' name='filter_menu' id='filter_menu'>
|
||||
<label for='filter_menu' id='filter_menu_label'>".__('Filter').'</label>';
|
||||
|
||||
$notification_filter .= "<ul class='sublevel-filter_notification'>";
|
||||
foreach ($types_list as $type) {
|
||||
if ($type === 'All') {
|
||||
$checked = 'checked';
|
||||
$checked = 'All';
|
||||
} else {
|
||||
$checked = '';
|
||||
}
|
||||
|
||||
switch ($type) {
|
||||
case 'All':
|
||||
$type_name = __('Show all');
|
||||
break;
|
||||
|
||||
case 'HISTORYDB':
|
||||
$type_name = 'HISTORY DB';
|
||||
$type_name = __('History DB');
|
||||
break;
|
||||
|
||||
case 'PANDORADB':
|
||||
$type_name = 'PANDORA DB';
|
||||
$type_name = __('Pandora DB');
|
||||
break;
|
||||
|
||||
case 'UPDATEMANAGER':
|
||||
$type_name = 'WARP UPDATE';
|
||||
$type_name = __('Warp update');
|
||||
break;
|
||||
|
||||
case 'ALLOWOVERRIDE':
|
||||
$type_name = 'ALLOW OVERRIDE';
|
||||
$type_name = __('Allow override');
|
||||
break;
|
||||
|
||||
case 'DISCOVERYTASK':
|
||||
$type_name = 'DISCOVERY TASK';
|
||||
$type_name = __('Discovery task');
|
||||
break;
|
||||
|
||||
default:
|
||||
|
|
@ -1106,29 +1106,31 @@ function notification_filter()
|
|||
break;
|
||||
}
|
||||
|
||||
$notification_filter .= "<li><div class='item-filter'>
|
||||
<input type='checkbox'
|
||||
class='checkbox_filter_notifications'
|
||||
value=".$type."
|
||||
name='filter_".$type."'
|
||||
".$checked."
|
||||
id='filter_".$type."'>
|
||||
<label for='filter_".$type."'>".$type_name.'</label>
|
||||
</div>
|
||||
</li>';
|
||||
$filter_options[$type] = $type_name;
|
||||
}
|
||||
|
||||
$notification_filter .= "<li><div class='item-filter'>";
|
||||
$filter_select = html_print_select(
|
||||
$filter_options,
|
||||
'notifications_filter_options',
|
||||
$checked,
|
||||
'',
|
||||
'',
|
||||
0,
|
||||
true,
|
||||
false,
|
||||
false,
|
||||
'w150px'
|
||||
);
|
||||
|
||||
$notification_filter .= html_print_div(
|
||||
[
|
||||
'class' => 'action-buttons w100p',
|
||||
'content' => html_print_submit_button(
|
||||
__('Filter'),
|
||||
'content' => $filter_select.html_print_submit_button(
|
||||
__('Apply filter'),
|
||||
'btn_submit',
|
||||
false,
|
||||
[
|
||||
'class' => 'mini sub filter',
|
||||
'icon' => 'search mini',
|
||||
'class' => 'link font_14px link-bold text-nowrap',
|
||||
'onClick' => 'filter_notification()',
|
||||
],
|
||||
true
|
||||
|
|
@ -1137,14 +1139,6 @@ function notification_filter()
|
|||
true
|
||||
);
|
||||
|
||||
$notification_filter .= '</div>
|
||||
</li>';
|
||||
|
||||
$notification_filter .= '</ul>';
|
||||
|
||||
$notification_filter .= '</li>';
|
||||
|
||||
$notification_filter .= '</ul>';
|
||||
return $notification_filter;
|
||||
}
|
||||
|
||||
|
|
@ -1161,19 +1155,23 @@ function notifications_print_dropdown()
|
|||
$mess = [];
|
||||
}
|
||||
|
||||
$redirection_notifications = html_print_menu_button(
|
||||
$redirection_notifications = html_print_button(
|
||||
__('See all notifications'),
|
||||
'see_all_notifications',
|
||||
false,
|
||||
'window.location="'.ui_get_full_url('index.php?sec=message_list&sec2=operation/messages/message_list').'"',
|
||||
[
|
||||
'href' => 'javascript:',
|
||||
'class' => 'notification_menu_actions',
|
||||
'text' => __('View all messages'),
|
||||
'onClick' => "window.location='".ui_get_full_url('index.php?sec=message_list&sec2=operation/messages/message_list')."'",
|
||||
'mode' => 'secondary',
|
||||
'class' => 'bolder',
|
||||
'icon' => 'unset',
|
||||
],
|
||||
true
|
||||
);
|
||||
|
||||
$notification_menu = html_print_menu_button(
|
||||
[
|
||||
'href' => 'javascript:',
|
||||
'class' => 'notification_menu_actions',
|
||||
'class' => 'notification_menu_actions link-bold font_14px',
|
||||
'text' => __('Mark all as read'),
|
||||
'onClick' => 'mark_all_notification_as_read()',
|
||||
],
|
||||
|
|
@ -1187,9 +1185,13 @@ function notifications_print_dropdown()
|
|||
<div class='notificaion_menu_container'>
|
||||
<div class='menu_tab filter_notification'>%s</div>
|
||||
<div class='menu_tab notification_menu'>%s</div>
|
||||
<div class='menu_tab notification_menu'>%s</div>
|
||||
</div>
|
||||
%s
|
||||
<div class='notifications-div'>
|
||||
%s
|
||||
</div>
|
||||
<center>
|
||||
<div class='mrgn_top_10px mrgn_btn_10px'>%s</div>
|
||||
</center>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
|
|
@ -1200,14 +1202,14 @@ function notifications_print_dropdown()
|
|||
",
|
||||
$notification_filter,
|
||||
$notification_menu,
|
||||
$redirection_notifications,
|
||||
array_reduce(
|
||||
$mess,
|
||||
function ($carry, $message) {
|
||||
return $carry.notifications_print_dropdown_element($message);
|
||||
},
|
||||
''
|
||||
)
|
||||
),
|
||||
$redirection_notifications
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -4976,14 +4976,14 @@ div#dialog_messages table th:last-child {
|
|||
|
||||
#notification-wrapper {
|
||||
background: white;
|
||||
border: #a5a5a5 solid 1px;
|
||||
border: 1px solid #e5e9ed;
|
||||
z-index: 900000;
|
||||
position: absolute;
|
||||
width: 550px;
|
||||
margin-top: 55px;
|
||||
border-radius: 5px;
|
||||
max-height: 530px;
|
||||
border-radius: 8px;
|
||||
position: fixed;
|
||||
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.13);
|
||||
}
|
||||
|
||||
#notification-wrapper::before {
|
||||
|
|
@ -4991,29 +4991,38 @@ div#dialog_messages table th:last-child {
|
|||
display: block;
|
||||
position: absolute;
|
||||
width: 0px;
|
||||
height: 0;
|
||||
border-color: transparent;
|
||||
border-width: 12px;
|
||||
border-style: solid;
|
||||
bottom: 100%;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
bottom: calc(100% - 8px);
|
||||
left: calc(58% - 7px);
|
||||
margin-left: -12px;
|
||||
border-bottom-color: white;
|
||||
margin-left: -9px;
|
||||
border-left: 1px solid #e5e9ed;
|
||||
transform: rotate(45deg);
|
||||
border-left: 1px solid #e5e9ed;
|
||||
border-top: 1px solid #e5e9ed;
|
||||
background-color: var(--secondary-color);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
#notification-wrapper-inner {
|
||||
max-height: 400px;
|
||||
#notification-wrapper-inner center {
|
||||
border-top: 1px solid #e5e9ed;
|
||||
}
|
||||
|
||||
.notifications-div {
|
||||
max-height: calc(100vh - 200px);
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.notifications-div::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#notification-wrapper-shadow {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background: #111;
|
||||
position: fixed;
|
||||
z-index: 9009;
|
||||
top: 0;
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.notification-item {
|
||||
|
|
@ -5026,6 +5035,10 @@ div#dialog_messages table th:last-child {
|
|||
padding: 5px;
|
||||
}
|
||||
|
||||
.notification-item:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.notification-item > * {
|
||||
padding-left: 7px;
|
||||
pointer-events: none;
|
||||
|
|
@ -10571,7 +10584,7 @@ button.submitButton:active {
|
|||
border: 2px solid #57ea82;
|
||||
}
|
||||
|
||||
button.buttonButton > div,
|
||||
button.buttonButton > div:not(.unset),
|
||||
button.submitButton > div {
|
||||
background-color: #fff;
|
||||
width: 2rem;
|
||||
|
|
@ -12660,11 +12673,12 @@ form.cfv_status_agent input:checked + label:before {
|
|||
|
||||
.notificaion_menu_container {
|
||||
display: flex;
|
||||
padding-top: 10px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.notification_menu {
|
||||
width: 100px;
|
||||
padding: 10px 15px;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid #e5e9ed;
|
||||
}
|
||||
|
||||
.filter_notification {
|
||||
|
|
@ -13847,3 +13861,18 @@ button.disabled {
|
|||
.tabs-show {
|
||||
display: list-item;
|
||||
}
|
||||
|
||||
.link-bold {
|
||||
color: var(--primary-color);
|
||||
text-decoration: none;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.link-bold:hover {
|
||||
opacity: 0.9;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.text-nowrap {
|
||||
text-wrap: nowrap;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1885,3 +1885,9 @@ a.pandora_pagination,
|
|||
#score-bar .labels-bar div {
|
||||
color: white;
|
||||
}
|
||||
|
||||
a.link-bold {
|
||||
color: var(--primary-color) !important;
|
||||
text-decoration: none;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue