diff options
author | metamuffin <metamuffin@disroot.org> | 2023-06-24 22:28:08 +0200 |
---|---|---|
committer | metamuffin <metamuffin@disroot.org> | 2023-06-24 22:28:08 +0200 |
commit | 5d3fd85dd9c822a5126dfa9737fd4c95b1bf9008 (patch) | |
tree | c8ff03b81862b95e226846b5317f7e884ab412bc | |
parent | e3d056a8807d52f95b7df9537ce931925b00d98f (diff) | |
download | keks-meet-5d3fd85dd9c822a5126dfa9737fd4c95b1bf9008.tar keks-meet-5d3fd85dd9c822a5126dfa9737fd4c95b1bf9008.tar.bz2 keks-meet-5d3fd85dd9c822a5126dfa9737fd4c95b1bf9008.tar.zst |
sideui animation
-rw-r--r-- | client-web/source/menu.ts | 13 |
1 files changed, 11 insertions, 2 deletions
diff --git a/client-web/source/menu.ts b/client-web/source/menu.ts index 1b159ec..041dcdf 100644 --- a/client-web/source/menu.ts +++ b/client-web/source/menu.ts @@ -51,8 +51,17 @@ export function side_ui(container: HTMLElement, content: HTMLElement, label: str // TODO: close other side uis const checkbox = einput("checkbox", { onchange: () => { - if (checkbox.checked) container.appendChild(content) - else container.removeChild(content) + if (checkbox.checked) { + container.classList.add("animate-in") + container.appendChild(content) + } else { + container.classList.remove("animate-in") + container.classList.add("animate-out") + setTimeout(() => { // TODO breaks if ui is being enabled while timeout is active + container.classList.remove("animate-out") + container.removeChild(content) + }, 400) + } } }) return { |