Add links to dashboard top boxes

Signed-off-by: RD WebDesign <github@rdwebdesign.com.br>
This commit is contained in:
RD WebDesign
2022-10-05 16:26:17 -03:00
parent 5cf013bfd5
commit d972a8c61b
2 changed files with 39 additions and 3 deletions
+13 -1
View File
@@ -22,12 +22,15 @@ require_once 'scripts/pi-hole/php/gravity.php';
<!-- small box -->
<div class="small-box bg-green no-user-select" id="total_queries" title="only A + AAAA queries">
<div class="inner">
<p>Total queries (<span id="unique_clients">-</span> clients)</p>
<p>Total queries</p>
<h3 class="statistic"><span id="dns_queries_today">---</span></h3>
</div>
<div class="icon">
<i class="fas fa-globe-americas"></i>
</div>
<a href="network.php" class="small-box-footer">
<span id="unique_clients">-</span> clients - more info <i class="fa fa-arrow-circle-right"></i>
</a>
</div>
</div>
<!-- ./col -->
@@ -41,6 +44,9 @@ require_once 'scripts/pi-hole/php/gravity.php';
<div class="icon">
<i class="fas fa-hand-paper"></i>
</div>
<a href="queries.php?forwarddest=blocked" class="small-box-footer">
List blocked queries <i class="fa fa-arrow-circle-right"></i>
</a>
</div>
</div>
<!-- ./col -->
@@ -54,6 +60,9 @@ require_once 'scripts/pi-hole/php/gravity.php';
<div class="icon">
<i class="fas fa-chart-pie"></i>
</div>
<a href="queries.php?forwarddest=blocked" class="small-box-footer">
List blocked queries <i class="fa fa-arrow-circle-right"></i>
</a>
</div>
</div>
<!-- ./col -->
@@ -67,6 +76,9 @@ require_once 'scripts/pi-hole/php/gravity.php';
<div class="icon">
<i class="fas fa-list-alt"></i>
</div>
<a href="groups-adlists.php" class="small-box-footer">
Manage adlists <i class="fa fa-arrow-circle-right"></i>
</a>
</div>
</div>
<!-- ./col -->
+26 -2
View File
@@ -424,19 +424,43 @@ td.lookatme {
padding: 1px;
}
.box,
.box {
border-radius: 10px;
}
.small-box {
border-radius: 10px;
z-index: 0; /* fix the small-box z-index (related to '.small-box .icon') */
overflow: hidden;
}
.small-box p {
margin: 0 0 5px;
}
.small-box > .inner {
padding: 10px 10px 0 10px;
}
@media screen and (min-width: 768px) {
.small-box > .small-box-footer {
text-align: right;
padding: 3px 7px;
}
}
.small-box-footer svg {
margin: 0 5px;
font-size: 13px;
}
.small-box .icon {
font-size: 76px;
z-index: -1; /* sends the icon behind the text */
}
/*** Icons grow on hover, but remain centered ***/
.small-box:hover .icon {
font-size: 90px; /* keep the same font-size, to avoid shifting the position */
font-size: 80px; /* keep the same font-size, to avoid shifting the position */
transform: scale(1.06);
}