modal style wip

3 years ago · 9e2862b0fd
parent cd4e6907d8
commit 9e2862b0fd
2 changed files with 14 additions and 5 deletions
--- a/index.html
+++ b/index.html
@ -11,11 +11,13 @@
 	<body>
 		<div id="container">
 			<div id="editor"></div>
-			<form class="text-input">
-				<input id="input" placeholder="Insert your label" type="text" />
-				<button id="insert" type="submit">Insert</button>
-				<button id="cancel">x</button>
-			</form>
+			<div class="text-input">
+				<form class="modal">
+					<input id="input" placeholder="Insert your label" type="text" />
+					<button id="insert" type="submit">Insert</button>
+					<button id="cancel">x</button>
+				</form>
+			</div>
 		</div>
 	</body>
 </html>
--- a/style.css
+++ b/style.css
@ -79,7 +79,14 @@ body {
 	align-items: center;
 }

+.modal {
+	padding: 64px;
+	background-color: tomato;
+}
+
 .text-input button {
+	color: white;
+	font-weight: bold;
 	background: none;
 	border: none;
 	cursor: pointer;