Better move error visibility

Shogi.UI/Shared/TemporaryModal.razor.css

@@ -0,0 +1,64 @@
+/* Grid layout */
+.TemporaryModal {
+	--timeToClose: 3s;
+	display: grid;
+	grid-template-columns: 1fr auto;
+	grid-template-rows: repeat(1fr, 3) auto;
+	grid-template-areas:
+		"content			close"
+		"content			."
+		"countdown		countdown"
+		"helper-text	helper-text";
+	gap: 0.5rem;
+}
+
+.content {
+	grid-area: content;
+}
+
+button.close {
+	grid-area: close;
+}
+
+.countdown {
+	grid-area: countdown;
+}
+
+
+.time-helper-text {
+	grid-area: helper-text;
+}
+
+/* Apperance */
+
+.TemporaryModal {
+	padding: 0.5rem;
+}
+
+.countdown .time-background {
+	background-color: beige;
+	height: 1ch;
+}
+
+.countdown .time {
+	background-color: red;
+	height: 100%;
+	width: 100%;
+	animation: countdown var(--timeToClose) ease-in-out;
+	animation-fill-mode: both;
+}
+
+.countdown .time-helper-text {
+	font-size: 70%;
+	text-align: center;
+}
+
+@keyframes countdown {
+	0% {
+		width: 100%;
+	}
+
+	100% {
+		width: 0
+	}
+}