xcc.es
[READ-ONLY] Mirror of https://github.com/mrgnw/ananas. learn multiple languages at once
ananas.xcc.es
put the flippin transition back again
Gosh!
author
Morgan Williams
date
(May 8, 2025, 4:27 AM +0200)
commit
ed0c3d3f
ed0c3d3fb8b64f9409718cffb0c4a8a44ed83a81
parent
989431e1
989431e1681b02596edd24f416ca858a5b0232b7
+3
-1
+3
-1
src/routes/languages/+page.svelte
+3
-1
src/routes/languages/+page.svelte
···
56
56
return [...exact, ...starts, ...partial];
57
57
});
58
58
59
-
let flipDuration = $derived.by(() => Math.max(80, Math.min(320, 600 / filteredLanguages.length)));
59
+
let flipDuration = 222;
60
60
61
61
function formatSpeakers(n) {
62
62
if (!n) return '';
···
87
87
<ul class="languages-list">
88
88
{#each [...filteredLanguages].filter(lang => lang.selected) as lang (lang.code)}
89
89
<li class="language-item selected" role="button" tabindex="0"
90
+
animate:flip={{ duration: flipDuration, easing: t => t*t*(3-2*t) }}
90
91
onclick={() => userStore.removeLanguage(lang.code)}
91
92
onkeydown={e => (e.key === 'Enter' || e.key === ' ') && userStore.removeLanguage(lang.code)}
92
93
aria-label={`Remove ${lang.name}`}
···
106
107
107
108
{#each [...filteredLanguages].filter(lang => !lang.selected) as lang (lang.code)}
108
109
<li class="language-item" role="button" tabindex="0"
110
+
animate:flip={{ duration: flipDuration, easing: t => t*t*(3-2*t) }}
109
111
onclick={() => userStore.addLanguage(lang.code)}
110
112
onkeydown={e => (e.key === 'Enter' || e.key === ' ') && userStore.addLanguage(lang.code)}
111
113
aria-label={`Add ${lang.name}`}