Salastil/odysseus
1
0
Fork 0
mirror of https://github.com/pewdiepie-archdaemon/odysseus.git synced 2026-06-16 09:45:24 -04:00
Code Issues Packages Projects Releases Wiki Activity

Cookbook fold: smooth max-height + opacity transition

Browse Source 
display:none toggle was instant and felt jarring during auto-fold/
auto-expand. Swapped to a CSS class `.is-folded` that transitions
max-height (0 ↔ 1200px) and opacity (0 ↔ 1) over ~280ms with ease,
so both manual chevron clicks and the scroll-driven toggles slide
in/out smoothly.
This commit is contained in:
pewdiepie-archdaemon
2026-06-13 20:14:34 +09:00
parent e6349c016e
commit f09f606bec
2 changed files with 26 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/style.css
+19 -1
View File
@@ -10946,7 +10946,7 @@ textarea.memory-add-input {
border-radius: 4px;
font-family: inherit;
font-size: 9px;
padding: 2px 3px;
padding: 2px 8px;
cursor: pointer;
flex-shrink: 0;
}
@@ -19498,6 +19498,24 @@ body.gallery-selecting .gallery-dl-btn,
border-bottom: 1px solid color-mix(in srgb, var(--border) 40%, transparent) !important;
padding-bottom: 6px !important;
}
/* Smooth open/close for the Direct Download body — replaces the
instant display:none toggle with a max-height + opacity slide so
auto-fold and auto-expand don't feel jarring. 1200px is a safe
upper bound for the body height; the slide only fires up to the
actual content height because content stops there. */
#cookbook-dl-tab-fold-body {
overflow: hidden;
max-height: 1200px;
opacity: 1;
transition: max-height 0.28s ease, opacity 0.18s ease, margin 0.28s ease;
}
#cookbook-dl-tab-fold-body.is-folded {
max-height: 0;
opacity: 0;
margin-top: 0;
margin-bottom: 0;
pointer-events: none;
}
/* Center the "?" glyph inside the help chip. Without text-align it sits 0.5px
left of true center because of the character's natural baseline offset. */
.hwfit-help-chip {