Nun mit login und Einrichten zusätzlicher User

public/styles.css

@@ -21,6 +21,11 @@
   font-weight: bold;
   box-shadow: 0 2px 8px rgba(0,0,0,0.10);
 }
+
+#tabUser {
+  margin-left: 50px;
+}
+
 /* Modal Fehlerfenster */
 .custom-modal-popup {
   position: fixed;
@@ -95,6 +100,7 @@ input, button {
 table {
   width: 100%;
   border-collapse: collapse;
+  margin-top: 30px;
 }
 
 th, td {
@@ -105,11 +111,11 @@ th, td {
 
 /* Spaltenbreiten über colgroup steuern */
 col.col-sensornumber { width: 7em; }
-col.col-espid       {width: 6em} 
+col.col-espid       {width: 9em} 
 col.col-bezeichnung { width: 8em; }
-col.col-beschreibung{ width: 12em; }
+col.col-beschreibung{ width: 15em; }
 col.col-date        { width: 10em; }
-col.col-aktionen    { width: 18em; }
+col.col-aktionen    { width: 2em; }
 
 
 .controls input#page,
@@ -160,12 +166,33 @@ button:hover {
   background: #0056b3;
 }
 
-.twobuttons {
-  display:flex;
-  width: 100%;
-  justify-content: space-between;
+.editBtn, .deleteBtn {
+    background: none;
+    border: none;
+    font-size: 18px;
+    cursor: pointer;
+    padding: 8px;
+    border-radius: 4px;
+    transition: all 0.2s ease;
+    margin: 0 2px;
 }
 
+.editBtn:hover {
+    background: rgba(0, 123, 255, 0.1);
+    transform: scale(1.1);
+}
+
+.deleteBtn:hover {
+    background: rgba(220, 53, 69, 0.1);
+    transform: scale(1.1);
+}
+
+.twobuttons {
+    display: flex;
+    justify-content: space-between;
+    width: 100%;
+    gap: 5px;
+}
 p.error {
   color: red;
   font-weight: bold;
@@ -199,4 +226,19 @@ p.error {
 
 #gzahl {
   margin-left: 30px;
+}
+
+#role {
+  font-size: 12pt;
+  padding: 5px 0 5px 3px;
+  margin-bottom: 20px;
+}
+
+#version {
+  width: 100%;
+  display: flex;
+  justify-content: flex-end;
+  font-size: 70%;
+  color: #007bff;
+  margin-top: 15px;
 }