VideoStudy/VideoStudy.UI/Layout/MainLayout.razor

59 lines
1.3 KiB
Plaintext

@inherits LayoutComponentBase
<div class="page">
<nav class="navbar navbar-dark bg-dark sticky-top mb-4">
<div class="container-fluid">
<span class="navbar-brand mb-0 h1">📺 VideoStudy</span>
</div>
</nav>
<main role="main" class="px-4">
@Body
</main>
</div>
<div id="blazor-error-ui">
<div class="alert alert-danger m-3" role="alert">
<h4 class="alert-heading">⚠️ Unhandled error</h4>
<p>An unhandled error has occurred. Please reload the page.</p>
<hr>
<button class="btn btn-primary reload">Reload</button>
<button class="btn btn-secondary dismiss">Dismiss</button>
</div>
</div>
<style>
.page {
position: relative;
display: flex;
flex-direction: column;
min-height: 100vh;
}
main {
flex: 1;
}
#blazor-error-ui {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
z-index: 9999;
align-items: center;
justify-content: center;
}
#blazor-error-ui[style*="display"] {
align-items: center;
justify-content: center;
}
.reload, .dismiss {
cursor: pointer;
}
</style>