diff options
author | Morris Jobke <morris.jobke@gmail.com> | 2013-03-13 11:03:52 +0100 |
---|---|---|
committer | Morris Jobke <morris.jobke@gmail.com> | 2014-01-15 11:10:12 +0100 |
commit | 5c1a9f35f16a8a871bcef24a45478ac92af9a9e1 (patch) | |
tree | 040662a510f5466a0b9275fee9724e605e17f4ee /core/css | |
parent | 34559ef11428c9a2a1b83f8a63d650d1fa0be49e (diff) | |
download | nextcloud-server-5c1a9f35f16a8a871bcef24a45478ac92af9a9e1.tar.gz nextcloud-server-5c1a9f35f16a8a871bcef24a45478ac92af9a9e1.zip |
Indicate password strength using strengthify
* uses zxcvbn
* outsourced to separate jquery plugin
* async loading
* hide strength meter if input is empty
* feedback if user enters weakest password
* fade in and out
* show tipsy with strength
* Opera 12, IE8-10, FF 23, Chromium 29
Diffstat (limited to 'core/css')
-rw-r--r-- | core/css/fixes.css | 6 | ||||
-rw-r--r-- | core/css/styles.css | 17 |
2 files changed, 22 insertions, 1 deletions
diff --git a/core/css/fixes.css b/core/css/fixes.css index bec002b96b3..4ee854addef 100644 --- a/core/css/fixes.css +++ b/core/css/fixes.css @@ -63,3 +63,9 @@ .ie8 #nojavascript { filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4c320000', endColorstr='#4c320000'); /* IE */ } + +/* IE8 doesn't have rounded corners, so the strengthify bar should be wider */ +.lte8 #body-login .strengthify-wrapper { + width: 271px; + left: 6px; +} diff --git a/core/css/styles.css b/core/css/styles.css index df014567087..29fcdd45738 100644 --- a/core/css/styles.css +++ b/core/css/styles.css @@ -341,7 +341,7 @@ input[type="submit"].enabled { margin-bottom: 20px; text-align: left; } -#body-login form #adminaccount { margin-bottom:5px; } +#body-login form #adminaccount { margin-bottom:15px; } #body-login form fieldset legend, #datadirContent label { width: 100%; font-weight: bold; @@ -361,6 +361,21 @@ input[type="submit"].enabled { margin-left: -4px; } +/* strengthify wrapper */ +#body-login .strengthify-wrapper { + display: inline-block; + position: relative; + left: 15px; + top: -21px; + width: 252px; +} + +/* tipsy for the strengthify wrapper looks better with following font settings */ +#body-login .tipsy-inner { + font-weight: bold; + color: #ccc; +} + /* Icons for username and password fields to better recognize them */ #adminlogin, #adminpass, #user, #password { width:11.7em!important; padding-left:1.8em; } #adminlogin+label+img, #adminpass-icon, #user+label+img, #password-icon { |