Add edit/view state to the costs of the modal (closes #151)

styles/v3/elements/headers.scss

@@ -4,7 +4,7 @@
 		font-size: 1rem;
 		margin: 0;
 	}
-	h1 {
+	h1, .h1 {
 		font-size: 1.5rem;
 	}
 }

styles/v3/elements/label.scss

@@ -0,0 +1,5 @@
+@use "../mixins/material";
+
+.dotdungeon.style-v3 > .window-content label {
+	cursor: pointer;
+}

styles/v3/elements/number-input.scss

@@ -0,0 +1,21 @@
+@use "../mixins/material";
+
+.dotdungeon.style-v3 > .window-content input[type=number] {
+	outline: none;
+	border: none;
+	@include material.elevate(3);
+	padding: 4px 8px;
+	color: white;
+	transition: all 200ms ease-in-out;
+	width: 50px;
+	height: auto;
+	text-align: center;
+
+	&:hover {
+		@include material.elevate(4);
+	}
+
+	&:focus-visible {
+		@include material.elevate(6);
+	}
+}

styles/v3/elements/text-input.scss

@@ -1,14 +1,14 @@
 @use "../mixins/material";
 
-.dotdungeon.style-v3 > .window-content input {
+.dotdungeon.style-v3 > .window-content input[type=text] {
 	outline: none;
 	border: none;
 	@include material.elevate(3);
+	padding: 4px 8px;
 	color: white;
 	transition: all 200ms ease-in-out;
 	width: auto;
 	height: auto;
-	font-size: inherit;
 
 	&:hover {
 		@include material.elevate(4);
@@ -17,8 +17,4 @@
 	&:focus-visible {
 		@include material.elevate(6);
 	}
-
-	&.h1 {
-		font-size: 1.5rem;
-	}
 }

styles/v3/elements/utilities.scss

@@ -0,0 +1,5 @@
+.dotdungeon.style-v3 > .window-content {
+	.grow {
+		flex-grow: 1;
+	}
+}

styles/v3/index.scss

@@ -3,8 +3,10 @@
 @use "./themes/dark.css";
 
 /* Element-Styling */
+@use "./elements/utilities.scss";
 @use "./elements/button.scss";
 @use "./elements/text-input.scss";
+@use "./elements/number-input.scss";
 @use "./elements/textarea.scss";
 @use "./elements/headers.scss";
 @use "./elements/hr.scss";