MVP display

1 files changed, 67 insertions, 0 deletions

diff --git a/style.css b/style.css
new file mode 100644
index 0000000..78686f8
--- /dev/null
+++ b/style.css
@@ -0,0 +1,67 @@
+* {
+	box-sizing: border-box;
+	margin: 0;
+	padding: 0;
+}
+
+body {
+	width: 100vw;
+	height: 100vh;
+}
+
+main {
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
+}
+
+#game-area {
+	margin: 0 auto;
+	padding: 2rem;
+	width: 32rem;
+	aspect-ratio: 1 / 1;
+	display: grid;
+	grid-template-columns: repeat(3, 1fr);
+	gap: 1rem;
+}
+
+#game-area div {
+	border: 2px solid black;
+}
+
+/*
+wey
+asdn
+
+*/
+#keyboard {
+	padding-bottom: 2rem;
+}
+
+#row0,
+#row1 {
+	display: flex;
+	flex-direction: row;
+	justify-content: center;
+	gap: 0.5rem;
+	margin: 0.5rem 0;
+}
+
+button {
+	border: 1px solid salmon;
+	border-radius: 0.2rem;
+	width: 10vw;
+	height: 10vw;
+}
+
+@media (max-width: 40rem) {
+
+	/* Modile target */
+	#game-area {
+		width: 75vw;
+	}
+}
+
+@media (min-width: 40rem) {
+	/* Desktop target */
+}
\ No newline at end of file