mirror of
https://github.com/jokob-sk/NetAlertX.git
synced 2025-12-07 09:36:05 -08:00
Streamlining the design of the frontend
- Screenshots updated to show the design changes
- Merge parts of b69912fe31
- maintenance page redesigned
This commit is contained in:
@@ -30,21 +30,23 @@
|
||||
|
||||
<div class="col-lg-2 col-sm-4 col-xs-6">
|
||||
<a href="#" onclick="javascript: getDevicesPresence('all');">
|
||||
<div class="small-box bg-aqua pa-small-box-aqua pa-small-box-2">
|
||||
<div class="inner"> <h3 id="devicesAll"> -- </h3> </div>
|
||||
<div class="icon"> <i class="fa fa-laptop text-aqua-20"></i> </div>
|
||||
<div class="small-box-footer pa-small-box-footer"> <?php echo $pia_lang['Presence_Shortcut_AllDevices'];?> <i class="fa fa-arrow-circle-right"></i> </div>
|
||||
<div class="small-box bg-aqua">
|
||||
<div class="inner"><h3 id="devicesAll"> -- </h3>
|
||||
<p class="infobox_label"><?php echo $pia_lang['Presence_Shortcut_AllDevices'];?></p>
|
||||
</div>
|
||||
<div class="icon"><i class="fa fa-laptop text-aqua-40"></i></div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- top small box 2 ------------------------------------------------------- -->
|
||||
<div class="col-lg-2 col-sm-4 col-xs-6">
|
||||
<a href="#" onclick="javascript: getDevicesPresence('connected');">
|
||||
<div class="small-box bg-green pa-small-box-green pa-small-box-2">
|
||||
<div class="inner"> <h3 id="devicesConnected"> -- </h3> </div>
|
||||
<div class="icon"> <i class="fa fa-plug text-green-20"></i> </div>
|
||||
<div class="small-box-footer pa-small-box-footer"> <?php echo $pia_lang['Presence_Shortcut_Connected'];?> <i class="fa fa-arrow-circle-right"></i> </div>
|
||||
<div class="small-box bg-green">
|
||||
<div class="inner"> <h3 id="devicesConnected"> -- </h3>
|
||||
<p class="infobox_label"><?php echo $pia_lang['Presence_Shortcut_Connected'];?></p>
|
||||
</div>
|
||||
<div class="icon"> <i class="fa fa-plug text-green-40"></i> </div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
@@ -52,10 +54,11 @@
|
||||
<!-- top small box 3 ------------------------------------------------------- -->
|
||||
<div class="col-lg-2 col-sm-4 col-xs-6">
|
||||
<a href="#" onclick="javascript: getDevicesPresence('favorites');">
|
||||
<div class="small-box bg-yellow pa-small-box-yellow pa-small-box-2">
|
||||
<div class="inner"> <h3 id="devicesFavorites"> -- </h3> </div>
|
||||
<div class="icon"> <i class="fa fa-star text-yellow-20"></i> </div>
|
||||
<div class="small-box-footer pa-small-box-footer"> <?php echo $pia_lang['Presence_Shortcut_Favorites'];?> <i class="fa fa-arrow-circle-right"></i> </div>
|
||||
<div class="small-box bg-yellow">
|
||||
<div class="inner"> <h3 id="devicesFavorites"> -- </h3>
|
||||
<p class="infobox_label"><?php echo $pia_lang['Presence_Shortcut_Favorites'];?></p>
|
||||
</div>
|
||||
<div class="icon"> <i class="fa fa-star text-yellow-40"></i> </div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
@@ -63,10 +66,11 @@
|
||||
<!-- top small box 4 ------------------------------------------------------- -->
|
||||
<div class="col-lg-2 col-sm-4 col-xs-6">
|
||||
<a href="#" onclick="javascript: getDevicesPresence('new');">
|
||||
<div class="small-box bg-yellow pa-small-box-yellow pa-small-box-2">
|
||||
<div class="inner"> <h3 id="devicesNew"> -- </h3> </div>
|
||||
<div class="icon"> <i class="ion ion-plus-round text-yellow-20"></i> </div>
|
||||
<div class="small-box-footer pa-small-box-footer"> <?php echo $pia_lang['Presence_Shortcut_NewDevices'];?> <i class="fa fa-arrow-circle-right"></i> </div>
|
||||
<div class="small-box bg-yellow">
|
||||
<div class="inner"> <h3 id="devicesNew"> -- </h3>
|
||||
<p class="infobox_label"><?php echo $pia_lang['Presence_Shortcut_NewDevices'];?></p>
|
||||
</div>
|
||||
<div class="icon"> <i class="ion ion-plus-round text-yellow-40"></i> </div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
@@ -74,10 +78,11 @@
|
||||
<!-- top small box 5 ------------------------------------------------------- -->
|
||||
<div class="col-lg-2 col-sm-4 col-xs-6">
|
||||
<a href="#" onclick="javascript: getDevicesPresence('down');">
|
||||
<div class="small-box bg-red pa-small-box-red pa-small-box-2">
|
||||
<div class="inner"> <h3 id="devicesDown"> -- </h3> </div>
|
||||
<div class="icon"> <i class="fa fa-warning text-red-20"></i> </div>
|
||||
<div class="small-box-footer pa-small-box-footer"> <?php echo $pia_lang['Presence_Shortcut_DownAlerts'];?> <i class="fa fa-arrow-circle-right"></i> </div>
|
||||
<div class="small-box bg-red">
|
||||
<div class="inner"> <h3 id="devicesDown"> -- </h3>
|
||||
<p class="infobox_label"><?php echo $pia_lang['Presence_Shortcut_DownAlerts'];?></p>
|
||||
</div>
|
||||
<div class="icon"> <i class="fa fa-warning text-red-40"></i> </div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
@@ -85,10 +90,11 @@
|
||||
<!-- top small box 6 ------------------------------------------------------- -->
|
||||
<div class="col-lg-2 col-sm-4 col-xs-6">
|
||||
<a href="#" onclick="javascript: getDevicesPresence('archived');">
|
||||
<div class="small-box bg-gray pa-small-box-gray pa-small-box-2">
|
||||
<div class="inner"> <h3 id="devicesHidden"> -- </h3> </div>
|
||||
<div class="icon"> <i class="fa fa-eye-slash text-gray-20"></i> </div>
|
||||
<div class="small-box-footer pa-small-box-footer"> <?php echo $pia_lang['Presence_Shortcut_Archived'];?> <i class="fa fa-arrow-circle-right"></i> </div>
|
||||
<div class="small-box bg-gray top_small_box_gray_text">
|
||||
<div class="inner"> <h3 id="devicesHidden"> -- </h3>
|
||||
<p class="infobox_label"><?php echo $pia_lang['Presence_Shortcut_Archived'];?></p>
|
||||
</div>
|
||||
<div class="icon"> <i class="fa fa-eye-slash text-gray-40"></i> </div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user