Add an overlay style representing a health bar.

site/standard/health/style.css

@@ -0,0 +1,63 @@
+@import url('https://fonts.googleapis.com/css2?family=Teko&display=swap');
+
+:root {
+	font-family: 'Teko', sans-serif;
+}
+
+[v-cloak] {
+	display: none;
+}
+
+html, body, #app {
+	width: 100%;
+	height: 100%;
+	margin: 0;
+	padding: 0;
+	overflow: hidden;
+}
+
+.container {
+	margin: 0;
+	padding: 0;
+	overflow: hidden;
+	background: rgba(0, 0, 0, .5);
+	position: relative;
+	text-align: center;
+	border-radius: 15px;
+}
+
+h1 {
+	margin-bottom: 5px;
+}
+
+#health-bar {
+	display: flex;
+	flex-direction: row;
+	border-width: 1px;
+	border-style: solid;
+	border-color: black;
+}
+
+#health-bar .health {
+	height: 20px;
+	flex-grow: 1;
+	border-radius: 2px;
+	border-style: solid;
+	border-color: black;
+	border-width: 1px;
+}
+
+#health-bar .health.filled {
+	background-color: red;
+}
+#health-bar .health.empty {
+	background-color: darkred;
+}
+
+
+.grow-enter-active, .grow-leave-active {
+	transition: transform 1s;
+}
+.grow-enter, .grow-leave-to {
+	transform: scale(0);
+}