Login/Signup UI

FullstackProsjekt/src/frontend/src/assets/main.css

@@ -3,12 +3,29 @@ body {
     margin: 0 0 0 27px;
     background-color: #F2F2F2;
 }
+input {
+    padding: 5px;
+    border-radius: 5px;
+    border: none;
+    min-width: 220px;
+    background-color: #E5E5E5;
+    margin: 10px;
+    font-family: monospace;
+}
+
+input::placeholder {
+    color: #b0b0b0;
+}
+label {
+    display: inline-block;
+    font-weight: bold;
+}
+
 
 .space{
     margin: 100px;
 }
 
-
 .row{
     margin-top: 5%;
     display: flex;
@@ -27,6 +44,13 @@ body {
     box-shadow: 0 0 20px 0px rgba(0,0,0,0.3);
 }
 
+.error-message{
+    color: #e53a1c;
+    padding: 10px;
+    font-size: 16px;
+    margin-bottom: 20px;
+}
+
 
 .play-btn{
     padding: 10px;
@@ -43,6 +67,8 @@ body {
     border-color: transparent;
     color: #242F40;
     border-radius: 10px;
+    cursor: pointer;
+
 }
 .delete-btn{
     padding: 8px;
@@ -51,6 +77,8 @@ body {
     color: #242F40;
     border-radius: 10px;
     font-family: monospace;
+    cursor: pointer;
+
 }
 .add-Btn {
     background-color: #242F40;
@@ -60,6 +88,8 @@ body {
     border-radius: 20px;
     border-color: transparent;
     margin-top: 10px;
+    cursor: pointer;
+
 }
 .add-Btn:hover{
     cursor: pointer;
@@ -76,6 +106,8 @@ body {
     border-radius: 20px;
     border-color: transparent;
     margin-top: 10px;
+    cursor: pointer;
+
 }
 
 .close-btn{
@@ -84,16 +116,27 @@ body {
     border-radius: 5px;
     border-color: transparent;
     margin-left: 10px;
+    cursor: pointer;
 
 }
 
 .submit-btn{
     background-color: #CCA43B;
-    font-size: 16px;
-    padding: 10px;
+    font-size: 20px;
+    padding: 20px;
     border-radius: 5px;
     border-color: transparent;
-    margin-left: 130px;
+    min-width: 160px;
+    font-family: monospace;
+    transition: 0.2s;
+    cursor: pointer;
+}
+.submit-btn:hover{
+    background-color: #a67d0e;
+}
+.submit-btn:active{
+    background-color: #2D333B;
+    color: white;
 }
 
 @media (max-width: 700px){