Merge pull request #52 from CCC-MF/issue_51

Darstellung und Aufteilung der Konfigurationsseite verbessern

1 files changed, 39 insertions, 0 deletions

diff --git a/src/main/resources/static/style.css b/src/main/resources/static/style.css
index 82b4d19..1dd68ed 100644
--- a/src/main/resources/static/style.css
+++ b/src/main/resources/static/style.css
@@ -257,6 +257,10 @@ form.samplecode-input input:focus-visible {
     display: block;
 }
 
+.userrole-form {
+    display: inline-block;
+}
+
 .userrole-form form {
     margin: 0;
     padding: 0;
@@ -321,6 +325,15 @@ table {
     font-family: sans-serif;
 }
 
+table.config-table td:first-child {
+    width: 24em;
+    min-width: fit-content;
+}
+
+table.config-table td > button:last-of-type {
+    float: right;
+}
+
 .border > table {
     padding: 0;
     border: none;
@@ -618,6 +631,32 @@ input.inline:focus-visible {
     color: var(--bg-red);
 }
 
+.tab {
+    padding: 1em;
+    border: none;
+    border-radius: 3px 3px 0 0;
+    cursor: pointer;
+    transition: all 0.2s;
+
+    font-weight: bold;
+}
+
+.tab:hover,
+.tab.active {
+    background: var(--table-border);
+}
+
+.tabcontent {
+    border: 1px solid var(--table-border);
+    border-radius: 0 .5em .5em .5em;
+    display: none;
+    padding: 1em;
+}
+
+.tabcontent.active {
+    display: block;
+}
+
 a.reload {
     display: none;
     position: absolute;