diff --git a/app/static/style.css b/app/static/style.css index c85fd6d..56d4c60 100644 --- a/app/static/style.css +++ b/app/static/style.css @@ -1212,6 +1212,78 @@ header { /*------------------------------------------------------------------------------ Settings ------------------------------------------------------------------------------*/ + +/* Settings page title */ +.settings-title { + text-align: center; + margin-top: 1rem; + margin-bottom: 1rem; +} + +/* Settings tab bar */ +.settings-tab-bar { + display: flex; + gap: 0.5rem; + margin-bottom: 1.5rem; + flex-wrap: wrap; + max-width: 1600px; + margin-left: auto; + margin-right: auto; + padding: 0 1.5rem; +} + +.settings-tab-btn { + padding: 0.4rem 1.1rem; + border-radius: 999px; + border: 1px solid var(--filter-border); + background: var(--filter-bg); + color: var(--filter-fg); + font-size: 0.9rem; + cursor: pointer; + transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease; +} + +.settings-tab-btn:hover { + background: rgba(255, 255, 255, 0.12); +} + +.settings-tab-btn.is-active { + background: var(--filter-active-bg); + border-color: var(--filter-active-border); + color: var(--filter-active-fg); +} + +/* Settings tab panels */ +.settings-tab-panel { + display: none; +} + +.settings-tab-panel.is-active { + display: block; +} + +/* Maintenance tab — visually subdued */ +.settings-tab-panel[data-tab="maintenance"] .settings-container { + opacity: 0.8; +} +.settings-tab-panel[data-tab="maintenance"] .settings-container:hover { + opacity: 1; + transition: opacity 0.2s ease; +} + +/* Two-column layout for Import tab */ +.settings-two-col { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 1rem; + align-items: start; +} + +@media (max-width: 900px) { + .settings-two-col { + grid-template-columns: 1fr; + } +} .settings-grid { display: grid; grid-template-columns: repeat(2, 1fr); diff --git a/app/templates/settings.html b/app/templates/settings.html index bc25ab9..2ad19ec 100644 --- a/app/templates/settings.html +++ b/app/templates/settings.html @@ -2,7 +2,17 @@ {% block title %}Settings{% endblock %} {% block content %} -
- Workers: - | - Active Tasks: - -
-Scan and remove images that don't meet filter criteria.
@@ -362,48 +364,76 @@Scan for visually similar images using perceptual hash comparison. The first image in each group has the highest resolution and will be kept.
+ +Scan for visually similar images using perceptual hash comparison. The first image in each group has the highest resolution and will be kept.
-Lower values find only very similar images. Higher values find more potential duplicates but may include false positives.
+Lower values find only very similar images. Higher values find more potential duplicates but may include false positives.
+Background operations and worker management.
+ +