wt/mongoose
1
0
Fork 0
mirror of https://github.com/cesanta/mongoose.git synced 2026-10-01 05:52:32 +07:00
Code Issues Packages Projects Releases Wiki Activity

Online/offline status

Browse Source
This commit is contained in:
cpq
2026-04-26 07:30:27 +01:00
parent 573bc152b1
commit b43988ad20
3 changed files with 39 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tutorials/device-dashboard/web_root/index.html
+4 -5
View File
@@ -4,8 +4,7 @@
<title>My Dashboard</title>
<!-- Mongoose device dashboard -->
<!--<script src="https://cdn.jsdelivr.net/gh/cesanta/mongoose@master/resources/dashboard.js"></script>-->
<script src="dashboard.js"></script>
<script src="https://cdn.jsdelivr.net/gh/cesanta/mongoose@master/resources/dashboard.js"></script>
<script>
Dashboard.init({
debug: true,
@@ -66,9 +65,9 @@
File Manager
</a>
</nav>
<div class="connection-badge" aria-label="connection active">
<span class="connection-label">live</span>
<span class="connection-dot" aria-hidden="true"></span>
<div class="connection-badge connection-badge-${__status.online ? 'online' : 'offline'}" aria-label="connection active">
<span class="connection-label">${__status.online ? 'live' : 'offline'}</span>
<span class="connection-dot connection-dot-${__status.online ? 'online' : 'offline'}" aria-hidden="true"></span>
</div>
</div>
<div class="header-actions">
tutorials/device-dashboard/web_root/style.css
+21 -4
View File
@@ -71,22 +71,39 @@ body {
display: inline-flex;
align-items: center;
gap: 0.4rem;
color: rgb(4, 120, 87);
border: 1px solid rgb(167, 243, 208);
background: rgb(236, 253, 245);
padding: 4px 14px;
border-radius: 14px;
font-weight: 600;
}
.connection-badge-online {
color: rgb(4, 120, 87);
border: 1px solid rgb(167, 243, 208);
background: rgb(236, 253, 245);
}
.connection-badge-offline {
color: rgb(120, 44, 57);
border: 1px solid rgb(243, 177, 208);
background: rgb(253, 246, 245);
}
.connection-dot {
width: 11px;
height: 11px;
border-radius: 50%;
background: rgb(16, 185, 129);
flex-shrink: 0;
}
.connection-dot-online {
background: rgb(16, 185, 129);
}
.connection-dot-offline {
background: rgb(185, 96, 109);
}
.nav-tabs {
display: inline-flex;
align-items: center;