From 25e8b259f715bfc839702a92fc99618de3e52d87 Mon Sep 17 00:00:00 2001 From: Sidharth Date: Fri, 13 Oct 2023 20:06:19 +0530 Subject: [PATCH] Show/Hide password icon --- bookwyrm/static/css/fonts/icomoon.eot | Bin 10812 -> 11424 bytes bookwyrm/static/css/fonts/icomoon.svg | 2 ++ bookwyrm/static/css/fonts/icomoon.ttf | Bin 10648 -> 11260 bytes bookwyrm/static/css/fonts/icomoon.woff | Bin 10724 -> 11336 bytes bookwyrm/static/css/vendor/icons.css | 6 ++++++ bookwyrm/static/js/bookwyrm.js | 26 +++++++++++++++++++++++++ bookwyrm/templates/layout.html | 7 ++++++- 7 files changed, 40 insertions(+), 1 deletion(-) diff --git a/bookwyrm/static/css/fonts/icomoon.eot b/bookwyrm/static/css/fonts/icomoon.eot index b86375a90a2468a4426e2464fb0eb7e5c9e5bfbe..33dc07eecba200ba863aea774449d288e68dfb00 100644 GIT binary patch delta 996 zcmYk5TSydP6vxjuv(9*9tlim}%2l^*cV||&QPAc-C#gI+{@hzQFl2zv3s2+0wtr^52Go!QY6=FIv2=N!)Y&JVt+==eEi z+zYT?G|H%^wZ(~n(IY2F$>>Sz=tFDV4**kW&8?lWp2x0s9)Q?TKe`m_?Lof_^$hy- zOIHUjzMX3;M*RlBz0%PhYjY+2uL0y2m{&V6ke+2agn9+Fv!k=G|5;T=7{G%)VCHIf zYi#MtLJ0K-)GeK{{vJ50P&lkmzl6Oj*4ciyE@KUK6o-uTbocfFjTtDK*YiNrpAv24 zX2ES#`FJrJI3QrxteRc(YC&yK8`0it9}|B_UJ-ij^K$00n%qbxfh50*CXp6ah3~>s z;el{oXcW!}PU~;%K@$55a}%d1(_{m6&k@%L-ZJTPbKy8N;6)rPM_7gx#C#$OWxik) z393Q2q!7uihcL;J1CCSxQ}}Vj%I_==_}vl~ma;s9bpgLx<`XE0Mk2$3fYTWW3`Zi- zZ52<+38g+SuU-iag~LN3<4iF$o6hq!N^u}itkm#)I!iOudPtT-y3ru+iB?q9)>c$R z_lP^sPi&Ec2O~D8+wC+?l!>x>MWcz)Q1n_csOp{K_(K9|Xn+)+BWM}Qp%yM83AZDM zD7dQu1Xp4iebF+X8YHTp_ymzv2=15mpF=7nxsU+S3k`T|KC$j3hk82|N38U7PUdE% z(?wfQ3L4chj$_Rk8D^Gl<~A1WrI~{^S7`GWGD>mTD^$wI_EC2jW^>vi@y2dd)r9)T zF|Qn#Z}x3z$xY%rbC>zPdDgsS@mg9eH?WGJl_Un`Z(<3Yg?6|Oy>J=2p$i{GDJYoh H_q_TGx)0mN delta 375 zcmZ1wxhI6pMvH-AhUP>zGnUL~)|V39QU`io9nBwBC8z`(Evh!c`?6ASjrS938i zFvTQ3xKo$kiP*)bEM}~rpeqrcoxXt!N8!hBqKF3MOAUB69a=<3{c)I11P}3 z&0+!MPXY2(GIC2QR@iYm1NlJp3_Ei2lM^pZI1OZ~gUpS~O{^$ju-9V(TBd#hD4>v+ zn43D&oAVEl{{d)8TS0zt2?H}whC#CeB+tOid}(qDW3@DhCk1pEGXoa`BZI6kvOV;Sj zcz&C&4BRXr3m6{USv(6yPp;84XVja#MRWV)VyzJ2D#2xfM}# + + diff --git a/bookwyrm/static/css/fonts/icomoon.ttf b/bookwyrm/static/css/fonts/icomoon.ttf index edcbd3b7553c0192cacd84b0039b2cd8a7a66383..89d3be8fa06b476920aeb3df8b4d5aff74950c57 100644 GIT binary patch delta 1026 zcmY+DZ%7ky7{{OA-MrtXa@KacE1kO5c6ZY?=iEOtg%Xt-Bgj<}LC*h0{wX8UUQ9ux zm(|`BL=gl<^rAGV7ZJXQ2>U}p5JWGG2)vNqL}8?^=XPp#-0k=KKF@Q{pU>@grFH3W z8VCRsz!K6d=LSJ{P%aaW~2T&iPKhlQ=bAf3m>IKy9zWy`k?l)K(0lb(4W=;-v?oQ30n2Vv| zEgCxdQ|E?YH-p70^d_7Gss8S(`z(J@C$Y%n(BSYHY!t7`Pr4si_Wh-q^Su{Plwn^i z@HmfCvujSxr$x0fE zJN|fSY1|(hZ)_Zo8GD9fsaX)3{Z-*`mA_dK%#`JrrI@P5^oIp$OR}!6rKPSexkcKz zzw1cs*pYC!W!Y`)7!zanNk$SQq2#lpF`{Qm;|~(Z(}^O5Df|E`)ItmNAPL!3MEp3b z0R%^)oIYqxFcKw^5DAJB^%I;g?;nSpN%0^7q6ZrAXc@6@B!_yn1|T8ed8in>HKy8c$UKOvl|KQ;r-*?tJ}otZ3IyC@|?*;d6Y^yS8S=(*K8yv=9pu${#y{U8UJV*PmH#o(XSmieK~N&z?o-EbO);W!M! P0G^s^@IxT;UVZi#>pJHH delta 355 zcmewpJ|noEfsuiMft#U$ftkU;KUm+0Ux?iZD6$8L6OwZi3--!ab1^V5$^iLO(i4jd zfV2RRzX3>dq~}zo$=p477RcYhz@V}uBQ-HaRdJ~k1A|%&P~I#9D8RwZVgck&0rFKc za!V>!*l{`o`9SpyJ96@q9TP82I1Oa0gA9(#O{^$juxA2VrhWm)SIA4uO`Yk@`3K1V z0JNm7AiuZ-=ujZgtN_U~Ff(78c%WJu#E}BJibx|6S@p7QaulQN z7(Mxh zhB>3&WC6|Xlh1302v-R%6FefsA!H{M1XKYEH@(SLTF=D|8NwJ+8HyN+88R928S;S6 OGGx$WFq~|meFOl|^;!o2 diff --git a/bookwyrm/static/css/fonts/icomoon.woff b/bookwyrm/static/css/fonts/icomoon.woff index 47d4bffb57ce17cf8b0ef46bbdb22873880becfc..95325ab4aa4a2bfb794a7d0e93b38c3013d36544 100644 GIT binary patch delta 1050 zcmYk5Uue^C5XbMA)TG@?oNbz@>$Y0kCf#b+cKxSy9a`+vQU$FtM9?~?RqUotbej*| zV2H1p2NA^iASk{l`rv~wd=Qa31;Hl~nV?|AS4Giv-mlrTp_kl!?|PT}kl&}hF9yU5 zyR%s!fLCBUG}C9-AMK6buFd;RSGvSXbg*1J4M0kmxlQekcSt;597T<>Vr*WrmgA?! zkD(?4_`Xql`RZtQX{dMg&mr{-OZJ};q&S`uRqHFL9RQ>lDz47Gz8Kc)5{ZONP( z8N|9>olX>vQ2TOnK3Oh~;o#0mj9qox!Z?SEApsXG(kQ?p_9W!ad&d>@wU?0AYn->Vr@siw5WT_{TNRvc7;ZuS{ z@lgqr0$J~_3z)*6KpbLYaV+XnurSPv9M;96@t%mpKp~%>j>SBlSZq34D4KbeWBw#nHA#&Hd37O`>hDjb3ajNt|DH3y zVME^O@%cQ4$CwyLKsK5f4ds9X#W?L$!5b1-LAfD?hlp8)jnEJHWe}fxB?;oL1`u3{ z=jft6k$8f{qa-59e30ONEB5L#%!d? z>gXQq#UVn~YBfluPpC6Eljr%Jbb?xY?{!WzgR@g!KH+~3WOfsp|SG@meVgXtMSKI7z%j3N_tgzJrxa}x^~7#K5vQd2;9uY5IE zdSWq1><^I70mTC8IhAP)3`{Hx3@S@NSmy4*vl*$0DGUs1D}ZXuKv-3AsZ$0}5GeKl z$X5Yj4sI5UjNFn61_pJYUWOeYyuyytIVV3EsLoG)4^SWugfC4v&5)Z|0kl{{2FOX?BnX68$ic^IpsfmSg{F$gd)GjIWY zs_;_urNT>{m*y|4Ubelw^@{72+5f-){{z(k?Rd%XQXDRK9WKZC|FJlWIJ4Lfv3Fu? z#1@JLiYbYH2bu>8HR;W~Ommbre^e7;l4q2h^^!F@GoIh(D+4#kcMJ>WUpbADH)?)&>69kxmCJRqqtaVDLU diff --git a/bookwyrm/static/css/vendor/icons.css b/bookwyrm/static/css/vendor/icons.css index b661ce8e7..6af5c2813 100644 --- a/bookwyrm/static/css/vendor/icons.css +++ b/bookwyrm/static/css/vendor/icons.css @@ -155,3 +155,9 @@ .icon-barcode:before { content: "\e937"; } +.icon-eye:before { + content: "\e9ce"; +} +.icon-eye-blocked:before { + content: "\e9d1"; +} diff --git a/bookwyrm/static/js/bookwyrm.js b/bookwyrm/static/js/bookwyrm.js index 67d64688f..a2351a98c 100644 --- a/bookwyrm/static/js/bookwyrm.js +++ b/bookwyrm/static/js/bookwyrm.js @@ -30,6 +30,12 @@ let BookWyrm = new (class { .querySelectorAll("[data-back]") .forEach((button) => button.addEventListener("click", this.back)); + document + .querySelectorAll("[data-password-icon]") + .forEach((button) => + button.addEventListener("click", this.togglePasswordVisibility.bind(this)) + ); + document .querySelectorAll('input[type="file"]') .forEach((node) => node.addEventListener("change", this.disableIfTooLarge.bind(this))); @@ -820,4 +826,24 @@ let BookWyrm = new (class { form.querySelector('input[name="preferred_timezone"]').value = tz; } + + togglePasswordVisibility(event) { + const iconElement = event.currentTarget.getElementsByTagName("button")[0]; + const passwordElementId = event.currentTarget.dataset.for; + const passwordInputElement = document.getElementById(passwordElementId); + + if (!passwordInputElement) return; + + if (passwordInputElement.type === "password") { + passwordInputElement.type = "text"; + this.addRemoveClass(iconElement, "icon-eye-blocked"); + this.addRemoveClass(iconElement, "icon-eye", true); + } else { + passwordInputElement.type = "password"; + this.addRemoveClass(iconElement, "icon-eye"); + this.addRemoveClass(iconElement, "icon-eye-blocked", true); + } + + this.toggleFocus(passwordElementId); + } })(); diff --git a/bookwyrm/templates/layout.html b/bookwyrm/templates/layout.html index ba53685f4..b8459856c 100644 --- a/bookwyrm/templates/layout.html +++ b/bookwyrm/templates/layout.html @@ -130,7 +130,12 @@
- +
+ + + + +

{% trans "Forgot your password?" %}