finally web interface

src/web/css/index.css

@@ -10,4 +10,4 @@ body {
     background-color: black;
     color: white;
     position: relative;
-}
+}

src/web/css/loginform.css

@@ -1,4 +1,4 @@
-.loginform {
+.form {
     position: absolute;
     width: 100%;
     height: 0;
@@ -11,14 +11,19 @@
     pointer-events: none;
     transition: 0.3s;
     background-color: black;
+    z-index: 10;
 }
 
-.loginform.active {
+.form.confirmform {
+    background-color: transparent;
+}
+
+.form.active {
     height: 100%;
     pointer-events: all;
 }
 
-.loginformbody {
+.formbody {
     padding: 10px;
     background-color: gray;
     border-radius: 10px;
@@ -40,6 +45,18 @@
     transition: 0.3s;
 }
 
+.loginforminputbody {
+    
+}
+
+.loginforminputbodyflex {
+    display: flex;
+}
+
+.loginforminputbodyflex>button {
+    margin: 10px;
+}
+
 .loginformbutton {
     padding: 10px;
     border: none;
@@ -50,6 +67,7 @@
     background-color: rgb(59, 59, 197);
     color: white;
     transition: 0.3s;
+    margin: 5px 0;
 }
 
 .loginformbutton:hover {

src/web/css/userstable.css

@@ -24,9 +24,29 @@ tbody {
 }
 
 th {
+    position: relative;
     border-radius: 10px;
     padding: 10px;
-    width: 25%;
+    width: 16%;
+    text-overflow: auto;
+    overflow-x: auto;
+}
+
+.thbutton {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    cursor: pointer;
+    left: 0;
+    top: 0;
+    background-color: rgb(48, 44, 44);
+    color: white;
+    border: none;
+    transition: 0.3s;
+}
+
+.thbutton:hover {
+    background-color: rgb(145, 77, 77);
 }
 
 ::-webkit-scrollbar {