Files
ScadaBridge/src/ScadaLink.Host/Components/App.razor
T
Joseph Doherty 8e388a89c5 feat(ui/templates): adopt TreeView design guide; split editor to /design/templates/{id}
Templates page is now a tree-only browser; editing happens on a dedicated
TemplateEdit page. Drag-drop is replaced by context-menu Move-to-Folder.
TreeView gains Bootstrap Icons (chevron + per-kind glyphs), ancestor guide
lines, defined hover/selected/focus tokens, and Escape-dismisses-menu per
the new Visual Design Guide (V1-V7) in Component-TreeView.md.
2026-05-11 20:52:34 -04:00

101 lines
3.2 KiB
Plaintext

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<base href="/" />
<title>ScadaLink</title>
<link href="/lib/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
<link href="/lib/bootstrap-icons/bootstrap-icons.css" rel="stylesheet" />
<link href="/ScadaLink.Host.styles.css" rel="stylesheet" />
<style>
.sidebar {
min-width: 220px;
max-width: 220px;
min-height: 100vh;
background-color: #212529;
}
.sidebar .nav-link {
color: #adb5bd;
padding: 0.4rem 1rem;
font-size: 0.9rem;
}
.sidebar .nav-link:hover {
color: #fff;
background-color: #343a40;
}
.sidebar .nav-link.active {
color: #fff;
background-color: #0d6efd;
}
.sidebar .nav-section-header {
color: #6c757d;
font-size: 0.75rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.05em;
padding: 0.75rem 1rem 0.25rem;
margin-top: 0.5rem;
}
.sidebar .brand {
color: #fff;
font-size: 1.1rem;
font-weight: 600;
padding: 1rem;
border-bottom: 1px solid #343a40;
}
#reconnect-modal {
display: none;
position: fixed;
top: 0; left: 0; right: 0; bottom: 0;
z-index: 9999;
background-color: rgba(0,0,0,0.5);
}
#reconnect-modal .modal-dialog {
display: flex;
align-items: center;
justify-content: center;
min-height: 100vh;
}
#reconnect-modal .modal-content {
max-width: 400px;
padding: 2rem;
text-align: center;
background: #fff;
border-radius: 0.5rem;
}
</style>
<HeadOutlet @rendermode="InteractiveServer" />
</head>
<body>
<Routes @rendermode="InteractiveServer" />
<div id="reconnect-modal">
<div class="modal-dialog">
<div class="modal-content">
<div class="spinner-border text-primary mb-3" role="status">
<span class="visually-hidden">Reconnecting...</span>
</div>
<h5>Connection Lost</h5>
<p class="text-muted mb-0">Attempting to reconnect to the server. Please wait...</p>
</div>
</div>
</div>
<script src="/_framework/blazor.web.js"></script>
<script>
// Reconnection overlay for failover behavior
// Blazor object is available after blazor.web.js initializes
document.addEventListener('DOMContentLoaded', () => {
if (typeof Blazor !== 'undefined') {
Blazor.addEventListener('enhancedload', () => {
document.getElementById('reconnect-modal').style.display = 'none';
});
}
});
</script>
<script src="/js/treeview-storage.js"></script>
<script src="/lib/bootstrap/js/bootstrap.bundle.min.js"></script>
</body>
</html>