diff --git a/templates/settings.html b/templates/settings.html index fd27add..5e886be 100644 --- a/templates/settings.html +++ b/templates/settings.html @@ -16,11 +16,29 @@ .settings-tips li::before{content:"";position:absolute;left:0;top:.55em;width:5px;height:5px;border-radius:50%;background:var(--accent)} .settings-ctp-grid{display:grid;grid-template-columns:1fr 1fr;gap:.65rem .75rem} .settings-ctp-grid .field-full{grid-column:1/-1} -.settings-ctp-section{margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid var(--border)} -.settings-ctp-section:last-of-type{border-bottom:none;margin-bottom:0;padding-bottom:0} -.settings-ctp-section h3{font-size:.9rem;margin:0 0 .65rem;color:var(--text-title)} +.settings-ctp-wrap .card-body{padding-top:0} +.settings-ctp-fold.card{ + margin-bottom:.75rem;padding:0;overflow:hidden; + border:1px solid var(--border);border-radius:8px;background:var(--card-inner); +} +.settings-ctp-fold.card:last-of-type{margin-bottom:0} +.settings-ctp-fold-head{ + width:100%;display:flex;align-items:center;justify-content:space-between;gap:.75rem; + padding:.7rem 1rem;margin:0;border:none;background:transparent;cursor:pointer; + font-size:.92rem;font-weight:600;color:var(--text-title);text-align:left; +} +.settings-ctp-fold-head:hover{color:var(--accent)} +.settings-ctp-fold-title{display:flex;align-items:center;gap:.5rem} +.settings-ctp-fold-chevron{ + flex-shrink:0;font-size:.72rem;color:var(--text-muted); + transition:transform .2s ease; +} +.settings-ctp-fold.is-collapsed .settings-ctp-fold-chevron{transform:rotate(-90deg)} +.settings-ctp-fold-body{padding:0 1rem .85rem} +.settings-ctp-fold.is-collapsed .settings-ctp-fold-body{display:none} .settings-ctp-status{font-size:.82rem;color:var(--text-muted);margin-top:.75rem;line-height:1.5} @media(max-width:900px){ + .settings-password-form{grid-template-columns:1fr} .settings-ctp-grid{grid-template-columns:1fr} } @@ -90,10 +108,9 @@ -