Vote + Results done

static/css/404.css

@@ -0,0 +1,8 @@
+body {
+    background-color: #11111b;
+    text-align: center;
+}
+
+h1, h3, p, a {
+    color: white;
+}

static/css/index.css

@@ -9,6 +9,7 @@ body {
     position: fixed;
     bottom: 0;
     width: 100%;
+    max-height: 50px;
     display: flex;
     background-color: #b4befe;
     justify-content: center;
@@ -21,7 +22,16 @@ body {
     border-radius: 5px;
     color: #1e1e2e;
     font-family: "Segoe UI";
-    font-size: 20px;
+    font-size: 14px;
+}
+
+.app {
+    margin:auto;
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    max-width: 500px;
+    height: calc(100vh - 60px);
 }
 
 .app > h2 {
@@ -30,4 +40,58 @@ body {
 
 .app > h1 {
     color: yellow;
+}
+
+.app > select {
+    width: 100%;
+}
+
+.app > input {
+    width: 100%;
+}
+
+.app > textarea {
+    width: 100%;
+    height: 100%;
+    resize: vertical;
+}
+
+.buttons > button {
+    font-size: 16px;
+    margin: 4px 0 4px 0;
+    padding: 5px;
+    background-color: cornflowerblue;
+    color: white;
+    border: none;
+    border-radius: 5px;
+}
+
+.buttons {
+    width: 100%;
+    display: grid;
+    gap: 5px;
+    grid-template-columns: repeat(2, 50% [col-start]);
+}
+
+.left {
+    grid-column-start: 1;
+    grid-column-end: 2;
+}
+
+.right {
+    grid-column-start: 2;
+    grid-column-end: 3;
+}
+.confirm {
+    margin: auto;
+    width: fit-content;
+    text-align: center;
+}
+
+.confirm > h1 {
+    color: yellow;
+}
+
+.confirm > h3 {
+    color: white;
 }

static/css/results.css

@@ -0,0 +1,77 @@
+body {
+    background-color: #11111b;
+    padding:0;
+    margin:0;
+}
+
+.footer {
+    margin: 0;
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    max-height: 50px;
+    display: flex;
+    background-color: #b4befe;
+    justify-content: center;
+}
+
+.footer > a {
+    padding: 10px;
+    margin: 5px;
+    background-color: #94e2d5;
+    border-radius: 5px;
+    color: #1e1e2e;
+    font-family: "Segoe UI";
+    font-size: 14px;
+}
+
+.app {
+    margin: auto;
+    height: calc(100vh + 60px);
+    width: 100%;
+    max-width: 500px;
+}
+
+.app > p {
+    color: white;
+    line-break: strict;
+}
+
+.app > h1 {
+    color: yellow;
+}
+
+.app > h2 {
+    color:white;
+}
+
+.app > h3 {
+    color: white;
+}
+
+.buttons > button {
+    font-size: 16px;
+    margin: 4px 0 4px 0;
+    padding: 5px;
+    background-color: cornflowerblue;
+    color: white;
+    border: none;
+    border-radius: 5px;
+}
+
+.buttons {
+    width: 100%;
+    display: grid;
+    gap: 5px;
+    grid-template-columns: repeat(2, 50% [col-start]);
+}
+
+.left {
+    grid-column-start: 1;
+    grid-column-end: 2;
+}
+
+.right {
+    grid-column-start: 2;
+    grid-column-end: 3;
+}