<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[BuddyPress][11755] trunk/src/bp-templates/bp-nouveau: Nouveau: Re-factor password verify JS & styles ( registration screen )</title>
</head>
<body>

<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt;  }
#msg dl a { font-weight: bold}
#msg dl a:link    { color:#fc3; }
#msg dl a:active  { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff  {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta" style="font-size: 105%">
<dt style="float: left; width: 6em; font-weight: bold">Revision</dt> <dd><a style="font-weight: bold" href="http://buddypress.trac.wordpress.org/changeset/11755">11755</a><script type="application/ld+json">{"@context":"http://schema.org","@type":"EmailMessage","description":"Review this Commit","action":{"@type":"ViewAction","url":"http://buddypress.trac.wordpress.org/changeset/11755","name":"Review Commit"}}</script></dd>
<dt style="float: left; width: 6em; font-weight: bold">Author</dt> <dd>hnla</dd>
<dt style="float: left; width: 6em; font-weight: bold">Date</dt> <dd>2017-12-01 23:16:45 +0000 (Fri, 01 Dec 2017)</dd>
</dl>

<pre style='padding-left: 1em; margin: 2em 0; border-left: 2px solid #ccc; line-height: 1.25; font-size: 105%; font-family: sans-serif'>Nouveau: Re-factor password verify JS & styles ( registration screen )

Commit updates password-verify.js to correct switch statement removing 'short' for 'misnatch' on 'pwsL10n.mismatch' html.

Adds new class for all conditions met of 'show' to manage the display of hidden result element, this simplifies the style rulesets.

Updates password style mixins for additional param for color.

Adds new ruleset to handle .mismatch mixin include ( provisional alt styling ), adds border styles for password input fields.

Todo: Track down the red border outline of input controls when unfocussed, currently this alludes  pinpointing to any styles or JS - possibly originating from WP js?</pre>

<h3>Modified Paths</h3>
<ul>
<li><a href="#trunksrcbptemplatesbpnouveaucommonstyles_bpmixinsscss">trunk/src/bp-templates/bp-nouveau/common-styles/_bp-mixins.scss</a></li>
<li><a href="#trunksrcbptemplatesbpnouveaucommonstyles_bp_info_messagesscss">trunk/src/bp-templates/bp-nouveau/common-styles/_bp_info_messages.scss</a></li>
<li><a href="#trunksrcbptemplatesbpnouveaucommonstyles_bp_registrationscss">trunk/src/bp-templates/bp-nouveau/common-styles/_bp_registration.scss</a></li>
<li><a href="#trunksrcbptemplatesbpnouveaucssbuddypressrtlcss">trunk/src/bp-templates/bp-nouveau/css/buddypress-rtl.css</a></li>
<li><a href="#trunksrcbptemplatesbpnouveaucssbuddypresscss">trunk/src/bp-templates/bp-nouveau/css/buddypress.css</a></li>
<li><a href="#trunksrcbptemplatesbpnouveaujspasswordverifyjs">trunk/src/bp-templates/bp-nouveau/js/password-verify.js</a></li>
<li><a href="#trunksrcbptemplatesbpnouveausassbuddypressscss">trunk/src/bp-templates/bp-nouveau/sass/buddypress.scss</a></li>
</ul>

</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunksrcbptemplatesbpnouveaucommonstyles_bpmixinsscss"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/bp-templates/bp-nouveau/common-styles/_bp-mixins.scss</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/bp-templates/bp-nouveau/common-styles/_bp-mixins.scss   2017-12-01 05:15:21 UTC (rev 11754)
+++ trunk/src/bp-templates/bp-nouveau/common-styles/_bp-mixins.scss     2017-12-01 23:16:45 UTC (rev 11755)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -319,6 +319,21 @@
</span><span class="cx" style="display: block; padding: 0 10px">        align-items: center; // current specs
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+// Layout elements / lists as grids
+// A combined mixin to set flex-flow & flex.
+// This mixin must be called on the parent i.e 'ul'
+
+@mixin build-flex-layout($row-wrap: wrap, $align: stretch, $basis: auto, $grow: 0 ) {
+
+       @include flex-box-dir($flex-dir: "row", $flex-wrap: $row-wrap);
+       @include flex-align($align: $align);
+
+       > * {
+
+               @include box-item-size($grow: $grow, $shrink: 1, $basis: $basis);
+       }
+}
+
</ins><span class="cx" style="display: block; padding: 0 10px"> // Links as a tabbed effect.
</span><span class="cx" style="display: block; padding: 0 10px"> // Renders links in a horizontal layout as a
</span><span class="cx" style="display: block; padding: 0 10px"> // tab effect on the current selected links.
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -445,7 +460,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px"> // Password warn colors
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-@mixin pwd-bad-colors($background: null, $border: null) {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+@mixin pwd-bad-colors($color: inherit, $background: null, $border: null) {
</ins><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px">        @if $background {
</span><span class="cx" style="display: block; padding: 0 10px">                $background: $background;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -462,9 +477,11 @@
</span><span class="cx" style="display: block; padding: 0 10px">        }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px">        border-color: $border;
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+       color: $color;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-@mixin pwd-short-colors($background: null, $border: null) {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+@mixin pwd-short-colors($color: inherit, $background: null, $border: null) {
</ins><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px">        @if $background {
</span><span class="cx" style="display: block; padding: 0 10px">                $background: $background;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -481,9 +498,11 @@
</span><span class="cx" style="display: block; padding: 0 10px">        }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px">        border-color: $border;
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+       color: $color;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-@mixin pwd-good-colors($background: null, $border: null) {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+@mixin pwd-good-colors($color: inherit, $background: null, $border: null) {
</ins><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px">        @if $background {
</span><span class="cx" style="display: block; padding: 0 10px">                $background: $background;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -500,6 +519,8 @@
</span><span class="cx" style="display: block; padding: 0 10px">        }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px">        border-color: $border;
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+       color: $color;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px"> // BP Tooltips
</span></span></pre></div>
<a id="trunksrcbptemplatesbpnouveaucommonstyles_bp_info_messagesscss"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/bp-templates/bp-nouveau/common-styles/_bp_info_messages.scss</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/bp-templates/bp-nouveau/common-styles/_bp_info_messages.scss    2017-12-01 05:15:21 UTC (rev 11754)
+++ trunk/src/bp-templates/bp-nouveau/common-styles/_bp_info_messages.scss      2017-12-01 23:16:45 UTC (rev 11755)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -237,28 +237,36 @@
</span><span class="cx" style="display: block; padding: 0 10px">                border-style: solid;
</span><span class="cx" style="display: block; padding: 0 10px">                border-width: 1px;
</span><span class="cx" style="display: block; padding: 0 10px">                display: none;
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+                font-weight: 700;
</ins><span class="cx" style="display: block; padding: 0 10px">                 margin: $marg-sml 0 $marg-sml 0;
</span><span class="cx" style="display: block; padding: 0 10px">                padding: $pad-sml;
</span><span class="cx" style="display: block; padding: 0 10px">                text-align: center;
</span><span class="cx" style="display: block; padding: 0 10px">                width: auto;
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+                // Show the feedback message when fields populated
+               &.show {
+                       display: block;
+               }
+
+               &.mismatch {
+
+                       @include pwd-bad-colors($color: $white, $background: $black, $border: transparent);
+               }
+
</ins><span class="cx" style="display: block; padding: 0 10px">                 &.error,
</span><span class="cx" style="display: block; padding: 0 10px">                &.bad {
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-                        @include pwd-bad-colors();
-                       display: block;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+                 @include pwd-bad-colors($color: $white);
</ins><span class="cx" style="display: block; padding: 0 10px">                 }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px">                &.short {
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-                        @include pwd-short-colors();
-                       display: block;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+                 @include pwd-short-colors($color: $white);
</ins><span class="cx" style="display: block; padding: 0 10px">                 }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px">                &.strong {
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-                        @include pwd-good-colors();
-                       display: block;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+                 @include pwd-good-colors($color: $white);
</ins><span class="cx" style="display: block; padding: 0 10px">                 }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px">        } // close #pass-strength-result
</span></span></pre></div>
<a id="trunksrcbptemplatesbpnouveaucommonstyles_bp_registrationscss"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/bp-templates/bp-nouveau/common-styles/_bp_registration.scss</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/bp-templates/bp-nouveau/common-styles/_bp_registration.scss     2017-12-01 05:15:21 UTC (rev 11754)
+++ trunk/src/bp-templates/bp-nouveau/common-styles/_bp_registration.scss       2017-12-01 23:16:45 UTC (rev 11755)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -25,15 +25,14 @@
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px">                // profile extra element wrapper
</span><span class="cx" style="display: block; padding: 0 10px">                .editfield {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-                        border: 1px solid $bp-border-color;
-                       margin: $marg-lrg 0;
-                       padding: 5px;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+                 margin: $marg-med 0;
</ins><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px">                        fieldset {
</span><span class="cx" style="display: block; padding: 0 10px">                                border: 0;
</span><span class="cx" style="display: block; padding: 0 10px">                                padding: 0;
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px">                                legend {
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+                                        margin: 0 0 5px;
</ins><span class="cx" style="display: block; padding: 0 10px">                                         text-indent: 0;
</span><span class="cx" style="display: block; padding: 0 10px">                                }
</span><span class="cx" style="display: block; padding: 0 10px">                        }
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -50,6 +49,11 @@
</span><span class="cx" style="display: block; padding: 0 10px">                #signup-avatar img {
</span><span class="cx" style="display: block; padding: 0 10px">                        margin: 0 $marg-med $marg-sml 0;
</span><span class="cx" style="display: block; padding: 0 10px">                }
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+               .password-entry,
+               .password-entry-confirm {
+                       border: 1px solid $bp-border-color;
+               }
</ins><span class="cx" style="display: block; padding: 0 10px">         } // close .signup-form
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px"> } // close .register-page
</span></span></pre></div>
<a id="trunksrcbptemplatesbpnouveaucssbuddypressrtlcss"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/bp-templates/bp-nouveau/css/buddypress-rtl.css</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/bp-templates/bp-nouveau/css/buddypress-rtl.css  2017-12-01 05:15:21 UTC (rev 11754)
+++ trunk/src/bp-templates/bp-nouveau/css/buddypress-rtl.css    2017-12-01 23:16:45 UTC (rev 11755)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1844,9 +1844,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px"> .register-page .signup-form .editfield {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-        border: 1px solid #eee;
-       margin: 20px 0;
-       padding: 5px;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ margin: 15px 0;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px"> .register-page .signup-form .editfield fieldset {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1855,6 +1853,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px"> .register-page .signup-form .editfield fieldset legend {
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+        margin: 0 0 5px;
</ins><span class="cx" style="display: block; padding: 0 10px">         text-indent: 0;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1870,6 +1869,11 @@
</span><span class="cx" style="display: block; padding: 0 10px">        margin: 0 0 10px 15px;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+.register-page .signup-form .password-entry,
+.register-page .signup-form .password-entry-confirm {
+       border: 1px solid #eee;
+}
+
</ins><span class="cx" style="display: block; padding: 0 10px"> @media screen and (min-width: 46.8em) {
</span><span class="cx" style="display: block; padding: 0 10px">        .buddypress-wrap .register-page .layout-wrap {
</span><span class="cx" style="display: block; padding: 0 10px">                display: flex;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -4249,28 +4253,39 @@
</span><span class="cx" style="display: block; padding: 0 10px">        border-style: solid;
</span><span class="cx" style="display: block; padding: 0 10px">        border-width: 1px;
</span><span class="cx" style="display: block; padding: 0 10px">        display: none;
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+        font-weight: 700;
</ins><span class="cx" style="display: block; padding: 0 10px">         margin: 10px 0 10px 0;
</span><span class="cx" style="display: block; padding: 0 10px">        padding: 0.5em;
</span><span class="cx" style="display: block; padding: 0 10px">        text-align: center;
</span><span class="cx" style="display: block; padding: 0 10px">        width: auto;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+.buddypress-wrap #pass-strength-result.show {
+       display: block;
+}
+
+.buddypress-wrap #pass-strength-result.mismatch {
+       background-color: #333;
+       border-color: transparent;
+       color: #fff;
+}
+
</ins><span class="cx" style="display: block; padding: 0 10px"> .buddypress-wrap #pass-strength-result.error, .buddypress-wrap #pass-strength-result.bad {
</span><span class="cx" style="display: block; padding: 0 10px">        background-color: #ffb78c;
</span><span class="cx" style="display: block; padding: 0 10px">        border-color: #ff853c;
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-        display: block;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ color: #fff;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px"> .buddypress-wrap #pass-strength-result.short {
</span><span class="cx" style="display: block; padding: 0 10px">        background-color: #ffa0a0;
</span><span class="cx" style="display: block; padding: 0 10px">        border-color: #f04040;
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-        display: block;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ color: #fff;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px"> .buddypress-wrap #pass-strength-result.strong {
</span><span class="cx" style="display: block; padding: 0 10px">        background-color: #66d66e;
</span><span class="cx" style="display: block; padding: 0 10px">        border-color: #438c48;
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-        display: block;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ color: #fff;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px"> .buddypress-wrap .standard-form#signup_form div div.error {
</span></span></pre></div>
<a id="trunksrcbptemplatesbpnouveaucssbuddypresscss"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/bp-templates/bp-nouveau/css/buddypress.css</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/bp-templates/bp-nouveau/css/buddypress.css      2017-12-01 05:15:21 UTC (rev 11754)
+++ trunk/src/bp-templates/bp-nouveau/css/buddypress.css        2017-12-01 23:16:45 UTC (rev 11755)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1844,9 +1844,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px"> .register-page .signup-form .editfield {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-        border: 1px solid #eee;
-       margin: 20px 0;
-       padding: 5px;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ margin: 15px 0;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px"> .register-page .signup-form .editfield fieldset {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1855,6 +1853,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px"> .register-page .signup-form .editfield fieldset legend {
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+        margin: 0 0 5px;
</ins><span class="cx" style="display: block; padding: 0 10px">         text-indent: 0;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1870,6 +1869,11 @@
</span><span class="cx" style="display: block; padding: 0 10px">        margin: 0 15px 10px 0;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+.register-page .signup-form .password-entry,
+.register-page .signup-form .password-entry-confirm {
+       border: 1px solid #eee;
+}
+
</ins><span class="cx" style="display: block; padding: 0 10px"> @media screen and (min-width: 46.8em) {
</span><span class="cx" style="display: block; padding: 0 10px">        .buddypress-wrap .register-page .layout-wrap {
</span><span class="cx" style="display: block; padding: 0 10px">                display: flex;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -4249,28 +4253,39 @@
</span><span class="cx" style="display: block; padding: 0 10px">        border-style: solid;
</span><span class="cx" style="display: block; padding: 0 10px">        border-width: 1px;
</span><span class="cx" style="display: block; padding: 0 10px">        display: none;
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+        font-weight: 700;
</ins><span class="cx" style="display: block; padding: 0 10px">         margin: 10px 0 10px 0;
</span><span class="cx" style="display: block; padding: 0 10px">        padding: 0.5em;
</span><span class="cx" style="display: block; padding: 0 10px">        text-align: center;
</span><span class="cx" style="display: block; padding: 0 10px">        width: auto;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+.buddypress-wrap #pass-strength-result.show {
+       display: block;
+}
+
+.buddypress-wrap #pass-strength-result.mismatch {
+       background-color: #333;
+       border-color: transparent;
+       color: #fff;
+}
+
</ins><span class="cx" style="display: block; padding: 0 10px"> .buddypress-wrap #pass-strength-result.error, .buddypress-wrap #pass-strength-result.bad {
</span><span class="cx" style="display: block; padding: 0 10px">        background-color: #ffb78c;
</span><span class="cx" style="display: block; padding: 0 10px">        border-color: #ff853c;
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-        display: block;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ color: #fff;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px"> .buddypress-wrap #pass-strength-result.short {
</span><span class="cx" style="display: block; padding: 0 10px">        background-color: #ffa0a0;
</span><span class="cx" style="display: block; padding: 0 10px">        border-color: #f04040;
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-        display: block;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ color: #fff;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px"> .buddypress-wrap #pass-strength-result.strong {
</span><span class="cx" style="display: block; padding: 0 10px">        background-color: #66d66e;
</span><span class="cx" style="display: block; padding: 0 10px">        border-color: #438c48;
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-        display: block;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ color: #fff;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px"> .buddypress-wrap .standard-form#signup_form div div.error {
</span></span></pre></div>
<a id="trunksrcbptemplatesbpnouveaujspasswordverifyjs"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/bp-templates/bp-nouveau/js/password-verify.js</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/bp-templates/bp-nouveau/js/password-verify.js   2017-12-01 05:15:21 UTC (rev 11754)
+++ trunk/src/bp-templates/bp-nouveau/js/password-verify.js     2017-12-01 23:16:45 UTC (rev 11755)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -8,7 +8,7 @@
</span><span class="cx" style="display: block; padding: 0 10px">                    strength;
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px">                // Reset classes and result text
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-                $( '#pass-strength-result' ).removeClass( 'short bad good strong' );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+         $( '#pass-strength-result' ).removeClass( 'show mismatch short bad good strong' );
</ins><span class="cx" style="display: block; padding: 0 10px">                 if ( ! pass1 ) {
</span><span class="cx" style="display: block; padding: 0 10px">                        $( '#pass-strength-result' ).html( pwsL10n.empty );
</span><span class="cx" style="display: block; padding: 0 10px">                        return;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -18,19 +18,19 @@
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><span class="cx" style="display: block; padding: 0 10px">                switch ( strength ) {
</span><span class="cx" style="display: block; padding: 0 10px">                        case 2:
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-                                $( '#pass-strength-result' ).addClass( 'bad' ).html( pwsL10n.bad );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+                         $( '#pass-strength-result' ).addClass( 'show bad' ).html( pwsL10n.bad );
</ins><span class="cx" style="display: block; padding: 0 10px">                                 break;
</span><span class="cx" style="display: block; padding: 0 10px">                        case 3:
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-                                $( '#pass-strength-result' ).addClass( 'good' ).html( pwsL10n.good );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+                         $( '#pass-strength-result' ).addClass( 'show good' ).html( pwsL10n.good );
</ins><span class="cx" style="display: block; padding: 0 10px">                                 break;
</span><span class="cx" style="display: block; padding: 0 10px">                        case 4:
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-                                $( '#pass-strength-result' ).addClass( 'strong' ).html( pwsL10n.strong );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+                         $( '#pass-strength-result' ).addClass( 'show strong' ).html( pwsL10n.strong );
</ins><span class="cx" style="display: block; padding: 0 10px">                                 break;
</span><span class="cx" style="display: block; padding: 0 10px">                        case 5:
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-                                $( '#pass-strength-result' ).addClass( 'short' ).html( pwsL10n.mismatch );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+                         $( '#pass-strength-result' ).addClass( 'show mismatch' ).html( pwsL10n.mismatch );
</ins><span class="cx" style="display: block; padding: 0 10px">                                 break;
</span><span class="cx" style="display: block; padding: 0 10px">                        default:
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-                                $( '#pass-strength-result' ).addClass( 'short' ).html( pwsL10n['short'] );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+                         $( '#pass-strength-result' ).addClass( 'show short' ).html( pwsL10n['short'] );
</ins><span class="cx" style="display: block; padding: 0 10px">                                 break;
</span><span class="cx" style="display: block; padding: 0 10px">                }
</span><span class="cx" style="display: block; padding: 0 10px">        }
</span></span></pre></div>
<a id="trunksrcbptemplatesbpnouveausassbuddypressscss"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/bp-templates/bp-nouveau/sass/buddypress.scss</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/bp-templates/bp-nouveau/sass/buddypress.scss    2017-12-01 05:15:21 UTC (rev 11754)
+++ trunk/src/bp-templates/bp-nouveau/sass/buddypress.scss      2017-12-01 23:16:45 UTC (rev 11755)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -15,7 +15,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> @import "../common-styles/_bp-variables";
</span><span class="cx" style="display: block; padding: 0 10px"> @import "../common-styles/_bp-mixins";
</span><span class="cx" style="display: block; padding: 0 10px"> 
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-//
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
</ins><span class="cx" style="display: block; padding: 0 10px"> // Sectional structuring allows us to locate elements
</span><span class="cx" style="display: block; padding: 0 10px"> // & to keep a degree of clarity in mind as to BP
</span><span class="cx" style="display: block; padding: 0 10px"> // components. Please note that sections do NOT have to
</span></span></pre>
</div>
</div>

</body>
</html>