Convert Razor pages to Blazor

2 files changed, 39 insertions, 45 deletions

diff --git a/wwwroot/styles/data-table.css b/wwwroot/styles/data-table.css
new file mode 100644
index 0000000..6256fc7
--- /dev/null
+++ b/wwwroot/styles/data-table.css
@@ -0,0 +1,21 @@
+table.data-table {
+    border-collapse: collapse;
+    width:           100%;
+}
+
+table.data-table > tr > th {
+    border-bottom: 1px solid white;
+    padding:       4px;
+}
+
+table.data-table > tr > td {
+    padding: 4px;
+}
+
+table.data-table > tr:nth-child(2n) {
+    background: rgba(255, 255, 255, 0.2);
+}
+
+table.data-table > tr > td:not(:last-child) {
+    border-right: 1px solid white;
+}
diff --git a/wwwroot/styles/global.css b/wwwroot/styles/global.css
index 83d76ec..d79b27c 100644
--- a/wwwroot/styles/global.css
+++ b/wwwroot/styles/global.css
@@ -1,4 +1,6 @@
-:root {
+@import url('data-table.css');
+
+:root {
     --col-accent-pri:             #0aa;
     --col-accent-pri-hl:          #0cc;
     --col-bg:                     #222;
@@ -12,6 +14,8 @@
     --col-button-sec-hl:          #777;
     --col-button-sec-disabled:    #555;
     --col-button-sec-disabled-bg: #000;
+    --col-button-warning:         #ff4848;
+    --col-button-warning-hl:      #ff9999;
     --col-scrollbar:              #666666;
     --col-scrollbar-hover:        #aaaaaa;
 }
@@ -52,6 +56,19 @@ button:disabled {
     background: var(--col-button-disabled-bg) !important;
 }
 
+button.warning {
+    background: var(--col-button-warning);
+}
+
+button.warning:hover {
+    background: var(--col-button-warning-hl);
+}
+
+button.warning:active {
+    color:       var(--col-button-warning);
+    background:  white;
+}
+
 button.secondary {
     background: var(--col-button-sec);
 }
@@ -94,50 +111,6 @@ hr {
     width: 100%;
 }
 
-table.data-table {
-    border-collapse: collapse;
-    width:           100%;
-}
-
-table.data-table > tbody > tr > th {
-    border-bottom: 1px solid white;
-    padding:       4px;
-}
-
-table.data-table > tbody > tr > td {
-    padding: 4px;
-}
-
-table.data-table > tbody > tr:nth-child(2n) {
-    background: rgba(255, 255, 255, 0.2);
-}
-
-table.data-table > tbody > tr > td:not(:last-child) {
-    border-right: 1px solid white;
-}
-
-div.dialog {
-    background:     var(--col-dialog-bg);
-    border-radius:  20px;
-    box-shadow:     0px 5px 10px 10px rgb(0 0 0 / 25%);
-    display:        flex;
-    flex-direction: column;
-    left:           50%;
-    opacity:        0;
-    padding:        20px;
-    position:       absolute;
-    top:            50%;
-    transform:      translate(-50%, -50%);
-    transition:     visibility 0.1s, opacity 0.1s linear;
-    visibility:     hidden;
-    width:          450px;
-}
-
-div.dialog.visible {
-    opacity:    1;
-    visibility: visible;
-}
-
 ::-webkit-scrollbar {
     width:  10px;
     height: 10px;