UI: Cronjob-Formular Layout-Verbesserungen

- form-container Wrapper entfernt, flache Struktur
- Aktiv-Checkbox nach oben verschoben
- .secondary-btn durch .positive-btn ersetzt (currentcolor)
- .danger-btn nutzt currentcolor für Border
- .form-group mit Padding, leere Status-Box wird versteckt
- .skill-name entfernt (ungenutzt)
- Status-Box: <br> durch inline-spans ersetzt
- Button-Icons bei Speichern/Löschen entfernt
This commit is contained in:
Meleki committed 2026-03-04 10:33:32 +01:00
1 parent 17e269ccb5
commit d88b046575
3 files changed
+36 -32

No files matched your search

+24 -18
View File
@@ -154,10 +154,6 @@ label.skill-item {
cursor: pointer;
}
.skill-name {
font-weight: bold;
}
.skill-version {
opacity: var(--semi-transparent);
}
@@ -220,12 +216,22 @@ label.skill-item {
.danger-btn {
color: var(--dangerous);
border-color: var(--dangerous);
border-color: currentcolor;
}
.danger-btn:hover {
background: var(--dangerous);
color: var(--f1-bg);
background: var(--dangerous);
}
.positive-btn {
color: var(--secondary);
border-color: currentcolor;
}
.positive-btn:hover {
color: var(--f1-bg);
background: var(--secondary);
}
/* Toggle Switch */
@@ -302,7 +308,10 @@ label.skill-item {
display: flex;
flex-direction: column;
gap: var(--badge-spacing);
line-height: 1.6;
}
.form-group:has(.form-status-box:empty) {
display: none;
}
.form-status-box .status-active {
@@ -317,9 +326,16 @@ label.skill-item {
color: var(--dangerous);
}
.form-group {
display: flex;
flex-direction: column;
gap: var(--badge-spacing);
padding: var(--box-padding);
padding-inline: 0;
}
.form-check-group {
display: flex;
align-items: center;
gap: var(--badge-spacing);
}
@@ -344,13 +360,3 @@ label.skill-item {
font-size: var(--font-size);
opacity: var(--semi-transparent);
}
.secondary-btn {
color: var(--secondary);
border-color: var(--secondary);
}
.secondary-btn:hover {
background: var(--secondary);
color: var(--f1-bg);
}
+11 -13
View File
@@ -145,7 +145,12 @@
<h1 id="cronjobPageTitle">Neuer Cronjob</h1>
</header>
<div class="page-content">
<div class="form-container">
<div class="form-group form-check-group">
<label>
<input type="checkbox" id="cronjobEnabled" checked>
Aktiv
</label>
</div>
<div class="form-group">
<label for="cronjobName">Name</label>
<input type="text" id="cronjobName" placeholder="z.B. Täglicher Report">
@@ -168,20 +173,13 @@
<select id="cronjobNotifySession"></select>
<small class="form-hint">Wenn gesetzt, wird eine Zusammenfassung in diese Session geschrieben (z.B. eine mit Telegram).</small>
</div>
<div class="form-group form-check-group">
<label>
<input type="checkbox" id="cronjobEnabled" checked>
Aktiv
</label>
</div>
<div class="form-group">
<div id="cronjobStatusBox" class="form-status-box" hidden></div>
<div class="form-actions">
<button id="cronjobSaveBtn" class="primary-btn"><i class="fa fa-save"></i> Speichern</button>
<button id="cronjobRunBtn" class="secondary-btn" hidden><i class="fa fa-play"></i> Jetzt ausführen</button>
<button id="cronjobDeleteBtn" class="danger-btn" hidden><i class="fa fa-trash"></i> Löschen</button>
</div>
<div class="form-actions">
<button id="cronjobSaveBtn">Speichern</button>
<button id="cronjobRunBtn" class="positive-btn" hidden><i class="fa fa-play"></i> Jetzt ausführen</button>
<button id="cronjobDeleteBtn" class="danger-btn" hidden>Löschen</button>
</div>
</div>
</div>
+1 -1
View File
@@ -237,7 +237,7 @@ function showCronjobStatus(box, job) {
parts.push(`<span><i class="fa fa-bell"></i> Benachrichtigung → ${escapeHtml(job.notifySessionName)}</span>`);
}
box.innerHTML = parts.join('<br>');
box.innerHTML = parts.join('');
}
function escapeHtml(s) {