Skip to content

Commit 4abfbf6

Browse files
authored
Merge pull request #1684 from netalertx/next_release
Next release
2 parents 7e237b0 + 931be74 commit 4abfbf6

16 files changed

Lines changed: 230 additions & 77 deletions

docs/DEVICE_FILTERS.md

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,9 @@ If a device is missing from the **My Devices** list, work through these checks.
1414

1515
The most common cause is that a filter is hiding the device.
1616

17-
![Image](https://docs.netalertx.com/img/ADVISORIES/filters.png)
17+
![Active device filters example](./img/ADVISORIES/filters.png)
1818

19-
![Image](https://docs.netalertx.com/img/DEVICE_MANAGEMENT/DeviceDetails_DisplaySettings.png)
19+
![Display settings](./img/DEVICE_MANAGEMENT/DeviceDetails_DisplaySettings.png)
2020

2121
Review any active:
2222

@@ -32,6 +32,8 @@ Clear filters first, then reload the page and check again.
3232

3333
You can select devices of what statuses should be displayed in the My Devices view. This can be adjusted in the _Settings_ section - search for the `UI_MY_DEVICES` setting and verify that the statuses you want to show are selected.
3434

35+
![Global filter display settings](./img/DEVICE_MANAGEMENT/device_filter_settings.png)
36+
3537
---
3638

3739
### Check Whether the Device Is Hidden
144 KB
Loading

front/css/app.css

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2647,13 +2647,13 @@ table.dataTable tbody > tr.selected
26472647
.skel-tab-pane { z-index: 10; min-height: 400px; }
26482648
#settings-skeleton { padding-top: 50px; padding-left: 20px; padding-right: 20px; min-height: 500px; }
26492649
#devices-skeleton { top: 50px; min-height: 500px; }
2650-
#device-details-skeleton { min-height: 600px; }
2650+
#device-details-skeleton { top: 45px; min-height: 100px; }
26512651
#events-skeleton { top: 50px; min-height: 500px; }
26522652
#presence-skeleton { top: 50px; min-height: 500px; }
26532653
#report-skeleton { min-height: 400px; }
2654-
#notifications-skeleton { min-height: 400px; }
2654+
#notifications-skeleton { top: 50px; min-height: 400px; }
26552655
#workflows-skeleton { top: 50px; width: 770px; margin: 0 auto; min-height: 300px; }
2656-
#plugins-skeleton { padding: 0; min-height: 400px; }
2656+
#plugins-skeleton { top: 50px; padding: 0; min-height: 400px; }
26572657

26582658
/* Bordered containers */
26592659
.skel-overview-panel, .skel-section, .skel-plugin-block,
@@ -2728,6 +2728,7 @@ table.dataTable tbody > tr.selected
27282728

27292729
/* ----- Devices ---------------------------------------------------------- */
27302730
.skel-tile { display: flex; height: 80px; }
2731+
#device-details-skeleton .skel-tile { display: flex; height: 45px; }
27312732
.skel-tile-inner { display: flex; flex-direction: column; padding: 12px 15px; justify-content: center; gap: 10px; }
27322733
.skel-tile-num { height: 26px; width: 55%; }
27332734
.skel-tile-label { height: 13px; width: 75%; }
@@ -2740,8 +2741,8 @@ table.dataTable tbody > tr.selected
27402741
.skel-td { height: 13px; }
27412742

27422743
/* ----- Device Details --------------------------------------------------- */
2743-
.skel-detail-header { margin-bottom: 15px; }
2744-
.skel-detail-title { height: 26px; width: 42%; margin-bottom: 14px; }
2744+
.skel-detail-header { margin-bottom: 0px; }
2745+
.skel-detail-title { height: 26px; width: 42%; margin-bottom: 0px; }
27452746
.skel-detail-info-panel { display: flex; gap: 0; padding: 14px; border-radius: 4px; margin-bottom: 15px; max-width: 400px; }
27462747
.skel-tabs-bar { display: flex; gap: 4px; padding: 8px 10px 0; border-radius: 4px 4px 0 0; border-bottom: none; }
27472748
.skel-tab { height: 34px; width: 100px; border-radius: 4px 4px 0 0; flex-shrink: 0; }
@@ -2758,7 +2759,7 @@ table.dataTable tbody > tr.selected
27582759

27592760
/* ----- Plugins ---------------------------------------------------------- */
27602761
.skel-plugins-wrap { display: flex; gap: 0; min-height: 400px; }
2761-
.skel-plugins-nav { width: 165px; flex-shrink: 0; border-right: 1px solid var(--skel-border); padding: 8px 0; }
2762+
.skel-plugins-nav { flex-shrink: 0; border-right: 1px solid var(--skel-border); padding: 8px 0; }
27622763
.skel-plugins-nav-item { display: flex; align-items: center; padding: 9px 15px; border-bottom: 1px solid var(--skel-border); }
27632764
.skel-plugins-nav-item:last-child { border-bottom: none; }
27642765
.skel-plugins-body { flex: 1; padding: 0; }

front/css/dark-patch.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -766,5 +766,5 @@ table.dataTable tbody tr.selected, table.dataTable tbody tr .selected
766766
--skel-section: #252c38;
767767
--skel-panel-bg: #1e242e;
768768
--skel-border: #2a323e;
769-
--skel-bg: #353c42;
769+
--skel-bg: #292e33;
770770
}

front/css/system-dark-patch.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -743,5 +743,5 @@
743743
--skel-section: #252c38;
744744
--skel-panel-bg: #1e242e;
745745
--skel-border: #2a323e;
746-
--skel-bg: #353c42;
746+
--skel-bg: #292e33;
747747
}

front/php/templates/skel_device_details.php

Lines changed: 4 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -4,56 +4,43 @@
44
<!-- Content header area -------------------------------------------------- -->
55
<div class="skel-detail-header">
66
<div class="skel-detail-title skel-shimmer"></div>
7-
<div class="skel-detail-info-panel">
8-
<div class="skel-shimmer" style="width:76px; height:76px; border-radius:4px; flex-shrink:0;"></div>
9-
<div style="flex:1; display:flex; flex-direction:column; gap:9px; padding:10px 0 10px 10px;">
10-
<span class="skel-line skel-shimmer" style="width:55%"></span>
11-
<span class="skel-line skel-shimmer" style="width:38%"></span>
12-
<span class="skel-line skel-shimmer" style="width:45%"></span>
13-
</div>
14-
</div>
157
</div>
168
179
<!-- Top stat tiles -------------------------------------------------------- -->
1810
<div class="row">
19-
<div class="col-lg-3 col-sm-6 col-xs-6 padding-5px">
11+
<div class="col-lg-3 col-sm-6 col-xs-6 ">
2012
<div class="skel-tile">
2113
<div class="skel-tile-inner">
2214
<div class="skel-tile-num skel-shimmer"></div>
23-
<div class="skel-tile-label skel-shimmer"></div>
2415
</div>
2516
<div class="skel-tile-icon-area">
2617
<div class="skel-tile-icon-shape skel-shimmer"></div>
2718
</div>
2819
</div>
2920
</div>
30-
<div class="col-lg-3 col-sm-6 col-xs-6 padding-5px">
21+
<div class="col-lg-3 col-sm-6 col-xs-6 ">
3122
<div class="skel-tile">
3223
<div class="skel-tile-inner">
3324
<div class="skel-tile-num skel-shimmer"></div>
34-
<div class="skel-tile-label skel-shimmer"></div>
3525
</div>
3626
<div class="skel-tile-icon-area">
3727
<div class="skel-tile-icon-shape skel-shimmer"></div>
3828
</div>
3929
</div>
4030
</div>
41-
<div class="col-lg-3 col-sm-6 col-xs-6 padding-5px">
31+
<div class="col-lg-3 col-sm-6 col-xs-6 ">
4232
<div class="skel-tile">
4333
<div class="skel-tile-inner">
4434
<div class="skel-tile-num skel-shimmer"></div>
45-
<div class="skel-tile-label skel-shimmer"></div>
4635
</div>
4736
<div class="skel-tile-icon-area">
48-
<div class="skel-tile-icon-shape skel-shimmer"></div>
4937
</div>
5038
</div>
5139
</div>
52-
<div class="col-lg-3 col-sm-6 col-xs-6 padding-5px">
40+
<div class="col-lg-3 col-sm-6 col-xs-6 ">
5341
<div class="skel-tile">
5442
<div class="skel-tile-inner">
5543
<div class="skel-tile-num skel-shimmer"></div>
56-
<div class="skel-tile-label skel-shimmer"></div>
5744
</div>
5845
<div class="skel-tile-icon-area">
5946
<div class="skel-tile-icon-shape skel-shimmer"></div>

front/php/templates/skel_events.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@
3030
<span class="skel-th skel-shimmer"></span>
3131
<?php endfor; ?>
3232
</div>
33-
<?php for ($i = 0; $i < 8; $i++): ?>
33+
<?php for ($i = 0; $i < 20; $i++): ?>
3434
<div class="skel-tr">
3535
<?php for ($j = 0; $j < 6; $j++): ?>
3636
<span class="skel-td skel-shimmer"></span>

front/php/templates/skel_notifications.php

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,12 +8,16 @@
88
<span class="skel-th skel-shimmer"></span>
99
<?php endfor; ?>
1010
</div>
11-
<?php for ($i = 0; $i < 8; $i++): ?>
11+
<?php for ($i = 0; $i < 25; $i++): ?>
1212
<div class="skel-tr">
1313
<?php for ($j = 0; $j < 4; $j++): ?>
1414
<span class="skel-td skel-shimmer"></span>
1515
<?php endfor; ?>
1616
</div>
1717
<?php endfor; ?>
1818
</div>
19+
<div class="skel-form-footer">
20+
<span class="skel-form-btn skel-shimmer"></span>
21+
<span class="skel-form-btn skel-shimmer"></span>
22+
</div>
1923
</div>

front/php/templates/skel_plugins.php

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<div id="plugins-skeleton">
2-
<div class="skel-plugins-wrap">
2+
<div class="skel-plugins-wrap col-sm-12">
33

44
<!-- Left nav sidebar -->
5-
<div class="skel-plugins-nav">
5+
<div class="skel-plugins-nav col-sm-2">
66
<?php
77
$widths = [72, 60, 80, 55, 68, 75];
88
for ($i = 0; $i < 6; $i++):
@@ -14,7 +14,7 @@
1414
</div>
1515

1616
<!-- Right content area -->
17-
<div class="skel-plugins-body">
17+
<div class="skel-plugins-body col-sm-10">
1818
<!-- Sub-tab bar -->
1919
<div class="skel-tabs-bar" style="border-radius: 0 4px 0 0; margin-bottom: 0;">
2020
<span class="skel-tab skel-shimmer"></span>
@@ -28,7 +28,7 @@
2828
<span class="skel-th skel-shimmer"></span>
2929
<?php endfor; ?>
3030
</div>
31-
<?php for ($i = 0; $i < 8; $i++): ?>
31+
<?php for ($i = 0; $i < 25; $i++): ?>
3232
<div class="skel-tr">
3333
<?php for ($j = 0; $j < 5; $j++): ?>
3434
<span class="skel-td skel-shimmer"></span>
@@ -37,6 +37,9 @@
3737
<?php endfor; ?>
3838
</div>
3939
</div>
40-
40+
</div>
41+
<div class="skel-form-footer col-sm-12 padding-5px">
42+
<span class="skel-form-btn skel-shimmer"></span>
43+
<span class="skel-form-btn skel-shimmer"></span>
4144
</div>
4245
</div>

front/php/templates/skel_tab_details.php

Lines changed: 146 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,155 @@
11
<!-- Details Tab Skeleton ================================================== -->
22
<div id="skel-tab-details" class="skel-tab-pane">
3-
<div class="skel-detail-form">
4-
<div class="skel-form-row">
5-
<span class="skel-form-label skel-shimmer"></span>
6-
<span class="skel-form-input skel-shimmer" style="max-width:340px"></span>
3+
<div class="skel-detail-form col-lg-12 col-sm-12 col-xs-12">
4+
<div class="col-lg-4 col-sm-6 col-xs-12">
5+
<div class="skel-form-row">
6+
<span class="skel-form-label skel-shimmer"></span>
7+
<span class="skel-form-input skel-shimmer" style="max-width:380px"></span>
8+
</div>
9+
<div class="skel-form-row">
10+
<span class="skel-form-label skel-shimmer"></span>
11+
<span class="skel-form-input skel-shimmer" style="max-width:280px"></span><span class="skel-form-input skel-shimmer" style="max-width:40px"></span>
12+
</div>
13+
<div class="skel-form-row">
14+
<span class="skel-form-label skel-shimmer"></span>
15+
<span class="skel-form-input skel-shimmer" style="max-width:320px"></span><span class="skel-form-input skel-shimmer" style="max-width:40px"></span>
16+
</div>
17+
<div class="skel-form-row">
18+
<span class="skel-form-label skel-shimmer"></span>
19+
<span class="skel-form-input skel-shimmer" style="max-width:340px"></span><span class="skel-form-input skel-shimmer" style="max-width:40px"></span>
20+
</div>
21+
<div class="skel-form-row">
22+
<span class="skel-form-label skel-shimmer"></span>
23+
<span class="skel-form-input skel-shimmer" style="max-width:380px"></span>
24+
</div>
25+
<div class="skel-form-row">
26+
<span class="skel-form-label skel-shimmer"></span>
27+
<span class="skel-form-input skel-shimmer" style="max-width:280px"></span>
28+
</div>
29+
<div class="skel-form-row">
30+
<span class="skel-form-label skel-shimmer"></span>
31+
<span class="skel-form-input skel-shimmer" style="max-width:320px"></span>
32+
</div>
33+
<div class="skel-form-row">
34+
<span class="skel-form-label skel-shimmer"></span>
35+
<span class="skel-form-input skel-shimmer" style="max-width:260px"></span>
36+
</div>
37+
<div class="skel-form-row">
38+
<span class="skel-form-label skel-shimmer"></span>
39+
<span class="skel-form-input skel-shimmer" style="max-width:400px;height:50px"></span>
40+
</div>
741
</div>
8-
<div class="skel-form-row">
9-
<span class="skel-form-label skel-shimmer"></span>
10-
<span class="skel-form-input skel-shimmer" style="max-width:260px"></span>
42+
<div class="col-lg-4 col-sm-6 col-xs-12">
43+
<div class="skel-form-row">
44+
<span class="skel-form-label skel-shimmer"></span>
45+
<span class="skel-form-input skel-shimmer" style="max-width:340px"></span><span class="skel-form-input skel-shimmer" style="max-width:40px"></span>
46+
</div>
47+
<div class="skel-form-row">
48+
<span class="skel-form-label skel-shimmer"></span><span class="skel-form-input skel-shimmer" style="max-width:40px"></span>
49+
<span class="skel-form-input skel-shimmer" style="max-width:380px"></span><span class="skel-form-input skel-shimmer" style="max-width:40px"></span>
50+
</div>
51+
<div class="skel-form-row">
52+
<span class="skel-form-label skel-shimmer"></span>
53+
<span class="skel-form-input skel-shimmer" style="max-width:280px"></span>
54+
</div>
55+
<div class="skel-form-row">
56+
<span class="skel-form-label skel-shimmer"></span>
57+
<span class="skel-form-input skel-shimmer" style="max-width:320px"></span>
58+
</div>
59+
<div class="skel-form-row">
60+
<span class="skel-form-label skel-shimmer"></span>
61+
<span class="skel-form-input skel-shimmer" style="max-width:260px"></span><span class="skel-form-input skel-shimmer" style="max-width:40px"></span>
62+
</div>
63+
<div class="skel-form-row">
64+
<span class="skel-form-label skel-shimmer"></span>
65+
<span class="skel-form-input skel-shimmer" style="max-width:400px"></span><span class="skel-form-input skel-shimmer" style="max-width:40px"></span>
66+
</div>
67+
<div class="skel-form-row">
68+
<span class="skel-form-label skel-shimmer"></span>
69+
<span class="skel-form-input skel-shimmer" style="max-width:300px"></span>
70+
</div>
71+
<div class="skel-form-row">
72+
<span class="skel-form-label skel-shimmer"></span>
73+
<span class="skel-form-input skel-shimmer" style="max-width:220px"></span>
74+
</div>
75+
<div class="skel-form-row">
76+
<span class="skel-form-label skel-shimmer"></span>
77+
<span class="skel-form-input skel-shimmer" style="max-width:380px"></span>
78+
</div>
79+
<div class="skel-form-row">
80+
<span class="skel-form-label skel-shimmer"></span>
81+
<span class="skel-form-input skel-shimmer" style="max-width:280px"></span>
82+
</div>
83+
<div class="skel-form-row">
84+
<span class="skel-form-label skel-shimmer"></span>
85+
<span class="skel-form-input skel-shimmer" style="max-width:320px"></span>
86+
</div>
1187
</div>
12-
<div class="skel-form-row">
13-
<span class="skel-form-label skel-shimmer"></span>
14-
<span class="skel-form-input skel-shimmer" style="max-width:400px"></span>
88+
<div class="col-lg-4 col-sm-6 col-xs-12">
89+
<div class="skel-form-row">
90+
<span class="skel-form-label skel-shimmer"></span>
91+
<span class="skel-form-input skel-shimmer" style="max-width:340px"></span><span class="skel-form-input skel-shimmer" style="max-width:40px"></span>
92+
</div>
93+
<div class="skel-form-row">
94+
<span class="skel-form-label skel-shimmer"></span>
95+
<span class="skel-form-input skel-shimmer" style="max-width:260px"></span><span class="skel-form-input skel-shimmer" style="max-width:40px"></span>
96+
</div>
97+
<div class="skel-form-row">
98+
<span class="skel-form-label skel-shimmer"></span>
99+
<span class="skel-form-input skel-shimmer" style="max-width:280px"></span><span class="skel-form-input skel-shimmer" style="max-width:40px"></span>
100+
</div>
101+
<div class="skel-form-row">
102+
<span class="skel-form-label skel-shimmer"></span>
103+
<span class="skel-form-input skel-shimmer" style="max-width:320px"></span>
104+
</div>
105+
<div class="skel-form-row">
106+
<span class="skel-form-label skel-shimmer"></span>
107+
<span class="skel-form-input skel-shimmer" style="max-width:400px"></span>
108+
</div>
109+
<div class="skel-form-row">
110+
<span class="skel-form-label skel-shimmer"></span>
111+
<span class="skel-form-input skel-shimmer" style="max-width:300px"></span>
112+
</div>
113+
<div class="skel-form-row">
114+
<span class="skel-form-label skel-shimmer"></span>
115+
<span class="skel-form-input skel-shimmer" style="max-width:220px"></span><span class="skel-form-input skel-shimmer" style="max-width:40px"></span>
116+
</div>
117+
<div class="skel-form-row">
118+
<span class="skel-form-label skel-shimmer"></span>
119+
<span class="skel-form-input skel-shimmer" style="max-width:380px"></span>
120+
</div>
121+
<div class="skel-form-row">
122+
<span class="skel-form-label skel-shimmer"></span>
123+
<span class="skel-form-input skel-shimmer" style="max-width:280px"></span>
124+
</div>
125+
<div class="skel-form-row">
126+
<span class="skel-form-label skel-shimmer"></span>
127+
<span class="skel-form-input skel-shimmer" style="max-width:320px"></span>
128+
</div>
129+
<div class="skel-form-row">
130+
<span class="skel-form-label skel-shimmer"></span>
131+
<span class="skel-form-input skel-shimmer" style="max-width:380px"></span>
132+
</div>
133+
<div class="skel-form-row">
134+
<span class="skel-form-label skel-shimmer"></span>
135+
<span class="skel-form-input skel-shimmer" style="max-width:220px"></span>
136+
</div>
137+
<div class="skel-form-row">
138+
<span class="skel-form-label skel-shimmer"></span>
139+
<span class="skel-form-input skel-shimmer" style="max-width:380px"></span>
140+
</div>
15141
</div>
16-
<div class="skel-form-row">
17-
<span class="skel-form-label skel-shimmer"></span>
18-
<span class="skel-form-input skel-shimmer" style="max-width:300px"></span>
142+
<div class="col-lg-6 col-sm-12 col-xs-12">
143+
<div class="skel-form-row">
144+
<span class="skel-form-label skel-shimmer"></span>
145+
<span class="skel-form-input skel-shimmer" style="max-width:340px"></span><span class="skel-form-input skel-shimmer" style="max-width:40px"></span><span class="skel-form-input skel-shimmer" style="max-width:40px"></span>
146+
</div>
19147
</div>
20-
<div class="skel-form-row">
21-
<span class="skel-form-label skel-shimmer"></span>
22-
<span class="skel-form-input skel-shimmer" style="max-width:220px"></span>
23-
</div>
24-
<div class="skel-form-row">
25-
<span class="skel-form-label skel-shimmer"></span>
26-
<span class="skel-form-input skel-shimmer" style="max-width:380px"></span>
27-
</div>
28-
<div class="skel-form-row">
29-
<span class="skel-form-label skel-shimmer"></span>
30-
<span class="skel-form-input skel-shimmer" style="max-width:280px"></span>
31-
</div>
32-
<div class="skel-form-row">
33-
<span class="skel-form-label skel-shimmer"></span>
34-
<span class="skel-form-input skel-shimmer" style="max-width:320px"></span>
148+
<div class="col-lg-6 col-sm-12 col-xs-12">
149+
<div class="skel-form-row">
150+
<span class="skel-form-label skel-shimmer"></span>
151+
<span class="skel-form-input skel-shimmer" style="max-width:340px"></span>
152+
</div>
35153
</div>
36154
<div class="skel-form-footer">
37155
<span class="skel-form-btn skel-shimmer"></span>

0 commit comments

Comments
 (0)