From 8fa2d70e9e9c238926f8683577beb88257cb3678 Mon Sep 17 00:00:00 2001
From: Phie <phie@phie.ovh>
Date: Wed, 5 Jun 2019 14:41:59 +0200
Subject: [PATCH] adding toggle password to be able to see it

Signed-off-by: Phie <phie@phie.ovh>
---
 core/css/guest.css                      |   9 +++++++++
 core/js/dist/login.js                   | Bin 604114 -> 604539 bytes
 core/js/dist/login.js.map               | Bin 2423518 -> 2424709 bytes
 core/src/components/login/LoginForm.vue |  15 ++++++++++++++-
 4 files changed, 23 insertions(+), 1 deletion(-)

diff --git a/core/css/guest.css b/core/css/guest.css
index 75fc2d93ea8..4d7df8b8996 100644
--- a/core/css/guest.css
+++ b/core/css/guest.css
@@ -228,6 +228,15 @@ input[type='email'] {
 	border: none;
 	font-weight: normal;
 }
+input[type='password'].password-with-toggle, input[type='text'].password-with-toggle {
+	width: 219px;
+	padding-right: 40px;
+}
+.toggle-password {
+	position: absolute;
+	top: 17px;
+	right: 20px;
+}
 input.login {
 	width: 260px;
 	height: 50px;
diff --git a/core/js/dist/login.js b/core/js/dist/login.js
index 5c0401a951b8461798792176e7d966e40b6ca594..72bdae25f967588352610f96edfc1e9fc8ea1883 100644
GIT binary patch
delta 465
zcmccgUgh^Em4+6^7N!>F7M2#)7Pc1l7LF~P_l0D13KENp%kzs;Jo5@lOF}9OQmvF=
zLfh{Najs^pFUe0&&q)n{s<TQf%}XxH%+J%%tcI&pvbD7>$;d3$gK34EW{+LiR;eVl
zqD09Gmn_U2rCOcoRmz;9+wX~RUSe}9E=erOOm@xzx&`4(-SW(m3|)vTm2?tIN{WiD
zs!KpVNyT)}_G8kVEQ|&^se18c8cGUEnmTzJN{LE3)hI?o4AX_XLTCC~9ZmzG;*$J=
zfTH|@#B`uDKp~(r{k$=!XgF#JX_RQz*4FAo0}am1O$Qncby9IrGSEf-&U%@-iRr-b
zEXmMNO3p7zRnk#P1czv`KExos;<9ulpc&KOsB@}pe=Wo5%F3RYYGG<>k-FVniF39n
E08H$v{r~^~

delta 93
zcmV-j0HXi<@+8vlB!GkggaU*Egam{Iga(8Mgb1_=-x9a{5(%mSmm?(!RkwN-3DO1@
zVRUqIb2@u;d2nSqB5+}Ib9ZlYWFohY90>#gw{so|W(5Z@W;ZuuV_~=8BMF-oU^XDa

diff --git a/core/js/dist/login.js.map b/core/js/dist/login.js.map
index a1397169b030bd71301a3d3daae64973626165b3..71f2b50df32c9b84d29e1f1d950260c5b47066bb 100644
GIT binary patch
delta 5932
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

delta 5157
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

diff --git a/core/src/components/login/LoginForm.vue b/core/src/components/login/LoginForm.vue
index dc9ef779f98..5574d65a059 100644
--- a/core/src/components/login/LoginForm.vue
+++ b/core/src/components/login/LoginForm.vue
@@ -65,7 +65,8 @@
 
 			<p class="groupbottom"
 			   :class="{shake: invalidPassword}">
-				<input type="password"
+				<input :type="passwordInputType"
+					   class="password-with-toggle"
 					   name="password"
 					   id="password"
 					   ref="password"
@@ -75,6 +76,9 @@
 					   required>
 				<label for="password"
 					   class="infield">{{ t('Password') }}</label>
+				<a href="#" @click.stop.prevent="togglePassword" class="toggle-password">
+					<img :src="OC.imagePath('core', 'actions/toggle.svg')"/>
+				</a>
 			</p>
 
 			<div id="submit-wrapper">
@@ -162,6 +166,7 @@
 				timezoneOffset: (-new Date().getTimezoneOffset() / 60),
 				user: this.username,
 				password: '',
+				passwordInputType: 'password',
 			}
 		},
 		computed: {
@@ -186,6 +191,14 @@
 			}
 		},
 		methods: {
+			togglePassword () {
+				if(this.passwordInputType === 'password'){
+					this.passwordInputType = 'text'
+				}
+				else{
+					this.passwordInputType = 'password'
+				}
+			},
 			updateUsername () {
 				this.$emit('update:username', this.user)
 			},
-- 
GitLab