From 9f1e2015c635ebdff42aa0791f88a0dd1b6f91b4 Mon Sep 17 00:00:00 2001 From: Pihkaal Date: Tue, 25 Nov 2025 15:50:28 +0100 Subject: [PATCH] feat(settings): menu animations --- .../top-screen/clock/clock-active.webp | Bin 0 -> 322 bytes .../top-screen/clock/clock-disabled.png | Bin 0 -> 6342 bytes .../top-screen/options/options-active.png | Bin 0 -> 6342 bytes .../top-screen/options/options-disabled.png | Bin 0 -> 8379 bytes .../touch_screen/touch-screen-disabled.png | Bin 0 -> 6342 bytes .../{touch_screen.webp => touch-screen.webp} | Bin .../settings/top-screen/user/user-active.webp | Bin 0 -> 302 bytes .../top-screen/user/user-disabled.png | Bin 0 -> 6342 bytes .../user/{user_name.webp => user-name.webp} | Bin .../Settings/BottomScreen/Menus/ClockMenu.vue | 38 +++++++++-- .../Settings/BottomScreen/Menus/Menus.vue | 39 ++++++++++-- .../BottomScreen/Menus/OptionsMenu.vue | 38 +++++++++-- .../BottomScreen/Menus/TouchScreenMenu.vue | 15 ++++- .../Settings/BottomScreen/Menus/UserMenu.vue | 60 +++++++++++++----- app/composables/useMenuAnimation.ts | 33 ++++++++++ 15 files changed, 189 insertions(+), 34 deletions(-) create mode 100644 app/assets/images/settings/top-screen/clock/clock-active.webp create mode 100644 app/assets/images/settings/top-screen/clock/clock-disabled.png create mode 100644 app/assets/images/settings/top-screen/options/options-active.png create mode 100644 app/assets/images/settings/top-screen/options/options-disabled.png create mode 100644 app/assets/images/settings/top-screen/touch_screen/touch-screen-disabled.png rename app/assets/images/settings/top-screen/touch_screen/{touch_screen.webp => touch-screen.webp} (100%) create mode 100644 app/assets/images/settings/top-screen/user/user-active.webp create mode 100644 app/assets/images/settings/top-screen/user/user-disabled.png rename app/assets/images/settings/top-screen/user/{user_name.webp => user-name.webp} (100%) create mode 100644 app/composables/useMenuAnimation.ts diff --git a/app/assets/images/settings/top-screen/clock/clock-active.webp b/app/assets/images/settings/top-screen/clock/clock-active.webp new file mode 100644 index 0000000000000000000000000000000000000000..38ee59f0d80540a90f7ef16d104f5572453110ab GIT binary patch literal 322 zcmV-I0lofGNk&FG0RRA3MM6+kP&iC30RR9mEC34tbvTi2w{G^omBPT%!YrZC&@iwp ze$rF_)EaptBW)uM&cCszV-L@Uk+zX@l{EVB;P>Bw+cu6Q1KPgpT>Zo4{>6FVmHBw~ zb^BgoNp0;V{?9rT5f7Y>NZdl7jRFa^cUS|B5TY!DBNPQwrNOF#>40j{0)!lJwY?h? z&Lo__3}36e U;zbIqsXtahCHv^)Lx(KyEK$1Cfr&b_?s+|Fy~ zj^WxlaPHZhbH6v7yZ+9(bDMjg@7%z|_a+->TYr8wPEJmM(rpZbg99W9&AZTMXJ=^~9v)%=VN9<_9UUD> z4^6B z#n2#~=BFLDn99bWj00@cH|7|_9H(VY(_kv0y+A`9#$|@(s+S`SWpbF+TCjb|FmZCL zGS$R8n32n3&Vyk$vz`T;U_cmhjW`;x<6c5&^qfbc5yn$P1AS==D-sIEfJnGXS^Q1| zjly`<;{Yi>o`MHaNFP>2wB{;~*Q9}k-s+JF7F~j#u4vbA1HuMX%o)RmxuRLfk@SVDN@0ZLP7L^59I@D%a6gvVUMBoSaZmT4_cFRkwone25|yAYk6MD)bH z)YVf3aZC$@9>%pKC>S6UG{i|m_k!%HLcCmp3}F;hVYL8SGHVK*-vGj-1tL^w8@NT+$$t+7O^)^Xw#5t{zErsk2T!3X&lW4g@cY z-Zcry(?I(Ltc}Ed;W5@A*vO4WgS~<25`mO*lQzl8K-$E#kEVML)S9(XAld)CSViAB42l(mD^>tknL_U3jW@_nKv`Lvzsr;c@AIZd-LA!{h9aP%L==wkNg;pphAUx4xlLQ^V9 z)b$mb^@mvXIIHVgfb*czJ%pmF%W1Yx0Cq#)(o* z-IyyR1yVDleEw>A^FJf&M^yv%_u{))G z>pc0eIqnY52O+}1A$2ySfW86jbDsCgeFYivCf&u*Ipoe);-pD_A)RYE1{xqRxg$YD z5CEZFSW_c>A0EwhK?Jj89VZKC=q%&z#P-QR`Gy_nVp=OLs9)$A98mo@MMTIEfhM;E zWSy??J+dyv0xHoGW;OOaOL1B1D+|rK+KT0wdq}KUKDQZe2g`8Z+(bGrt%eHG(pgNH z^DB0=uGx_=y9BFo147D#+)qJXy2>pMtKpj9!36r!S!pQ@EV-Rwf(b#I>`tr`5eyS8 z{PAaG*c_z#>N*xR2+%bKVy_&8^$5o~1n%N8s0H(_gs_ahZySZkpUZ`uF|=!eCDjgS#qO;zJmB5PVTONJ)Sz&OyFESfTOA}Unk?%lnB)r5# zOga$RPqo~+Si40PWg)VA94xf}M#PF=R8eaYu!6x%5ap9j&U{x9C+Sf6Zvo4<0)eiG zbrJx>1*}joc1)KjF071+5Zt>e4qZBn+R;H@^lDoHTcP>BWwnkOvE`-_!hwnMW8oy5 z)|%+O8L)W`#fx;P-LrZiH~86KgLT_3mLagVDD&cvjOKOqsHw;|8wX~>>9*asgdKH%8>UI`C;cQ8S7o}M}y zF$FuWF5t?Q!dH_j=-4Kueq13YTm{oAIc)G4W`NA12>gjgVt*%_d>F?u8`v>D|KaLB z?Oxsm22^5Z;yf{8^1*A_mWV~W$r6Q6c=roT6a_yEVVvre#QP(ynslnmF=&tb2Xmbz zwJzcyd`M{X5yK!F+$GhZ0|^BNDxI^8{-rY0@NuqB`&7wp>}KnWZ`NqMrzBk4IKsmB z#pLrjzABIRMunr6CfRUpJ*V;h@cj+b@RXH)f&)0B=?gT#Nj{|WTjCj)wC}npvpBp& z$}*LAqV=7gH6Om`yh-xPX9RSa^acu??GN*M7cX{T@3;k`L2jmLd;7RLk$@?FJfy0i zYcUx1+t<8 literal 0 HcmV?d00001 diff --git a/app/assets/images/settings/top-screen/options/options-disabled.png b/app/assets/images/settings/top-screen/options/options-disabled.png new file mode 100644 index 0000000000000000000000000000000000000000..f2630b400ae4a365e2ef90b4ac83b99f650e2bc2 GIT binary patch literal 8379 zcmdT~F=!M~5d9~KxgjAXuqb2SE}Nk}ED~u+T1&!Zr|GdsJpxBqT0(S^bBR*hSXrE_{oJ|vDp7`>&bDTq`|@u5&y(RqZ>%k?w48f+!?~?D z&K)MEt&Vfg?>P5+)w!8%=Ps>({QBT-GBLWo^mxO$+t+c|Hb32akr+pwHCqcKyW^K9 zW-gw8|7|*fbj|tMhmS^Uhu4PNwWFh>l0TTN*Xv&O$zjl!$?6OkwcBkUfH7`dJ_o3lVih8MZ1P948X`ST zQhHWQNTVgeB`lo8Kn`Q;N@ZXP>8uL{AiqnN1J{A9EK4eYfs}NDWU#pv4AL?xAat2V z(R!+!;0HrdDMRfWjYjAaD_}^jJg>J&2YvxrZ;0M71O;a(2#`TKptiTScT6e>;Kj{= zj(O-QWIED;Is;8-89-{D1`)c+sO^q&?v`24ht}4QsNQuwuYsh_*h~R2fvvz{!~+R| zuro*k6^%3Ca7N$a?)UOF2UBh@0Cnf-B+^&UF&@1YYA&7ff@MOE^ZaD@=axk#;ut_0 z3`v-Xeo}hoGMk*t8#4hPDfnIax-^1Y7~*2Ks~!47}%h zbJ>;*wT?M6EHK!4Gz4Jj%t_jMNt#;<4Wtt>VUbJ$OMrgCQ@~(Q1YX2Y&t-rmIFrbS zK?7KN>g|c@h-718s`M>v4^)&@?IkG|H;4rmk|xoAjeJylbgO!|s&c*?4vS^UQkAxXwY}_) z^xHO-lI9{T@;n77dnF%!(#y6D<1>}Ewu}K5 uLCem#DrGqGsstS{*453!3rUJ${4appUEKMw{r%S(ayA#1=ReP_zWxgj4fh!U literal 0 HcmV?d00001 diff --git a/app/assets/images/settings/top-screen/touch_screen/touch-screen-disabled.png b/app/assets/images/settings/top-screen/touch_screen/touch-screen-disabled.png new file mode 100644 index 0000000000000000000000000000000000000000..0bf3163750c50310791ddf417558723c29a2a62e GIT binary patch literal 6342 zcmeHJziSjx5S|Suxg;EDGrZGwBP<-G@X! zVA>rJ-8o0}b(84AQ=+3=&t6}?2*<)!=lV9$@~Px6y7zqLE{yZHyS?`Om!)Hk^R)48 zWsfL6(QP%aTw92a#NR(h>iCq+Gqp`c^v`SQz|QBsvu88 zHH>HTFzE=$#?CDtt8;pX*fUhCFa`$iS??SRj0k@gZDo8bOHK0te!X7Tmf~5EQ3Ei6 z{MO`0=&ekW(>V!@FM1XB0y@90lk#hOc_?l@kw^L{Ua@Ev?9I-P8zdH2U?7>g3`I;F zft74=16Au9gs_?#s31~JwduO>1gF% z(|V01mvDoZ0AZ1uO)a6Vvn94xWd|M(e7N!G|C?X^mNIx)9H&$nF7WX=4Ng`1a=^pv zR^j>JX>bP_?+?EDwG9RA4$QwGa6*p!Y zivYSU^YG9WmX_--08Yp7#Dpytjt~-|!hI2r0ijSA0yyF-d|q_@x!TMLjg#I<7bJ~W zKs@XS#&1>na=^oE)jp~R#tp-3Zm+PGexLq5P~psf7VvSa%6Ia+kB^tHzWVegVb^W1 Kw_dDnKKKPC_qXBz literal 0 HcmV?d00001 diff --git a/app/assets/images/settings/top-screen/touch_screen/touch_screen.webp b/app/assets/images/settings/top-screen/touch_screen/touch-screen.webp similarity index 100% rename from app/assets/images/settings/top-screen/touch_screen/touch_screen.webp rename to app/assets/images/settings/top-screen/touch_screen/touch-screen.webp diff --git a/app/assets/images/settings/top-screen/user/user-active.webp b/app/assets/images/settings/top-screen/user/user-active.webp new file mode 100644 index 0000000000000000000000000000000000000000..ad8be8ba337222856af8ce26e250a49075d52d80 GIT binary patch literal 302 zcmV+}0nz?aNk&E{0RRA3MM6+kP&iB)0RR9mEC34tH9(CdNs^?$Tq{Duf(;uUJl2-= zblC_HWu$GSs(%?zU&g_=bkI!OHby@feG8-KX!YNL+cu7*0K)dwUj4&wu6h3HoX@lW zEo-sIvbAaPC*)t5CV9%rmZO5AvgN3tL4Od4nuyCGDoBK*Dl#dw38Ah-BIPh~c~o(j zLK z;ch2UTmp(V!`+UmR065&nu#YBr>rWuR_%YwTCA)Z%hsmFjxMblp=;V{|Nrfs0lt-v A^#A|> literal 0 HcmV?d00001 diff --git a/app/assets/images/settings/top-screen/user/user-disabled.png b/app/assets/images/settings/top-screen/user/user-disabled.png new file mode 100644 index 0000000000000000000000000000000000000000..227904d2927b465f40ef1774f5da17390d4b4a97 GIT binary patch literal 6342 zcmds5ziSjx5S}|CxgUgJH@<#8zXoOGes7^i^zOyP@4H8!ckj(FEf769L$v;k z=od`un?w&U5&c*uy7G$X_{!_|H?Cq~Y-RrTD$&KM?62|o&9z4`jy~uw%#MDaI5Bzo z)TfspyF{JS{h8j)TVsu5ouA(tgTVkO{ft1_+(Z)UbUG}6ZT7U=ZPpj*wspAuvggZ^EB9Deszr znmshC0Y{@4Tw2YdxQ#`PG8YhHC9|)?MVw`1M35yz%|-!Ed<+ySmfS$LB4(%uOJcFn zlpn1~+^P$Rf6#0k)j#$pyKu6I611BuS|dShzTS>S9w5$7l%n zYd53nlr^-orVxpV6v7Eil!ZQ{>C^1DlMlFD0uoLv!p`3jHzzy0OSTXfBsqnSSRmLC zdaa`Dhj5R-YYZ&(hH2Slp#d!WEL`W9v4#-NTyV{9<*w0&(51$h8+(0)xC~9Um|DXP zUPFi&yP@ngG<2wZF>qlvaBX8YutR_6t-ojrJYr;b+jR)Ns=t7=y;L5W2Q!FuuG{S* z@!Be8YwfUP}=B9Ko0pO&3fetaJoQV@?24X>6eU1cE z<*Kg4gBc($GMU@O)U7enGxjn_qn7Y642*MHWlq8-4Ib{iROxU!Uu?CcAKFcNqm8ay z9VzaC2am2;MbLIF3&0gLQp*O+OWfn(_QeFMQT^9=9NdI*Q!CA>CIOk%^c&H4fZ^Y; zr8`){1EYio5%>R2QwhIMVN#+UBY(X7(`?BdMZ>E)+?0G49< A*8l(j literal 0 HcmV?d00001 diff --git a/app/assets/images/settings/top-screen/user/user_name.webp b/app/assets/images/settings/top-screen/user/user-name.webp similarity index 100% rename from app/assets/images/settings/top-screen/user/user_name.webp rename to app/assets/images/settings/top-screen/user/user-name.webp diff --git a/app/components/Settings/BottomScreen/Menus/ClockMenu.vue b/app/components/Settings/BottomScreen/Menus/ClockMenu.vue index c019949..1628514 100644 --- a/app/components/Settings/BottomScreen/Menus/ClockMenu.vue +++ b/app/components/Settings/BottomScreen/Menus/ClockMenu.vue @@ -1,5 +1,7 @@ diff --git a/app/components/Settings/BottomScreen/Menus/OptionsMenu.vue b/app/components/Settings/BottomScreen/Menus/OptionsMenu.vue index f336ac6..e8ddbf7 100644 --- a/app/components/Settings/BottomScreen/Menus/OptionsMenu.vue +++ b/app/components/Settings/BottomScreen/Menus/OptionsMenu.vue @@ -1,5 +1,7 @@