2 files changed, 28 insertions, 3 deletions
diff --git a/Layout/MainLayout.razor b/Layout/MainLayout.razor
index 8e9f6bd..4c1b284 100644
--- a/Layout/MainLayout.razor
+++ b/Layout/MainLayout.razor
@@ -1,7 +1,5 @@
 @inherits LayoutComponentBase
 
-<link href="@(nameof(HyperBooru)).styles.css" rel="stylesheet" />
-
 <Titlebar/>
 
 <MobileMenu/>
@@ -9,3 +7,9 @@
 <div id="content">
     @Body
 </div>
+
+<div id="blazor-error-ui" data-nosnippet>
+    An unhandled error has occurred.
+    <a href="." class="reload">Reload</a>
+    <span class="dismiss">🗙</span>
+</div>
diff --git a/Layout/MainLayout.razor.css b/Layout/MainLayout.razor.css
index c2b5603..7e84358 100644
--- a/Layout/MainLayout.razor.css
+++ b/Layout/MainLayout.razor.css
@@ -1,4 +1,4 @@
-div#content {
+div#content {
     flex:       1 1 calc(100vh - 59px);
     overflow-x: hidden;
     overflow-y: auto;
@@ -7,3 +7,24 @@
 body.mobile-menu-visible div#content {
     display: none;
 }
+
+#blazor-error-ui {
+    color-scheme: light only;
+    background:   lightyellow;
+    bottom:       0;
+    box-shadow:   0 -1px 2px rgba(0, 0, 0, 0.2);
+    box-sizing:   border-box;
+    display:      none;
+    left:         0;
+    padding:      0.6rem 1.25rem 0.7rem 1.25rem;
+    position:     fixed;
+    width:        100%;
+    z-index:      1000;
+}
+
+#blazor-error-ui .dismiss {
+    cursor:   pointer;
+    position: absolute;
+    right:    0.75rem;
+    top:      0.5rem;
+}