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:
1 parent
17e269ccb5
commit
d88b046575
3 files changed
+36
-32
No files matched your search
+24
-18
@@ -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
@@ -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>
|
||||
|
||||
@@ -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) {
|
||||
|
||||
Reference in new issue
Block a user