in the middle of relearning msal

Shogi.UI/Pages/Home/GameBoard.razor.css

@@ -15,6 +15,7 @@
 }
 
 .board {
+	position: relative;
 	display: grid;
 	grid-template-areas:
 		"rank A9 B9 C9 D9 E9 F9 G9 H9 I9"
@@ -59,9 +60,10 @@
 	overflow: hidden; /* Because SVGs are shaped weird */
 	transition: filter linear 0.25s;
 }
-.tile[data-selected] {
-	filter: invert(0.8);
-}
+
+	.tile[data-selected] {
+		filter: invert(0.8);
+	}
 
 .ruler {
 	color: beige;
@@ -91,3 +93,20 @@
 		display: flex;
 		flex-wrap: wrap;
 	}
+
+.promote-prompt {
+	display: none;
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	transform: translate(-50%, -50%);
+	border: 2px solid #444;
+	background-color: #eaeaea;
+	padding: 1rem;
+	box-shadow: 1px 1px 1px #444;
+	text-align: center;
+}
+
+	.promote-prompt[data-visible="true"] {
+		display: block;
+	}