fix #7653 styling on password entry

[roojs1] / css-bootstrap4 / sb-admin-2.css

diff --git a/css-bootstrap4/sb-admin-2.css b/css-bootstrap4/sb-admin-2.css
index f595de4..03135d2 100644 (file)
--- a/css-bootstrap4/sb-admin-2.css
+++ b/css-bootstrap4/sb-admin-2.css
@@ -1529,16 +1529,16 @@ textarea.form-control {
     margin-right: 0.3125rem;
     margin-left: 0; }
 
-.form-password .password-toggle {
-  width: 48px;
-  background-repeat: no-repeat;
-  background-position: center; }
-
-.form-password .password-visible {
-  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAnUExURUdwTDExMTAwMDExMTMzMzExMTExMTAwMDAwMDIyMjIyMjAwMDIyMtDcR4EAAAAMdFJOUwDfIO86ksUQf1ivcKwSZ8wAAABaSURBVBjTY2AYcMB4Bg4EUDlMMtZgFezNBxUY2GXOSDgwMDA1nzlWwMB6cOKZw2lpNmcyZQIYmI0YvEAaljAoA/UoMLAedXGJCQCxQKYfYWDwMYBZJQDBlAMAlfIjX/5EzDQAAAAASUVORK5CYII=") !important; }
-
-.form-password .password-hidden {
-  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAtUExURUdwTDAwMDAwMDExMTExMTExMTExMTIyMjExMTAwMDAwMDIyMjIyMjAwMDIyMm633p8AAAAOdFJOUwAgEN9BwKGQzzB/YO9gZ/nLrQAAAK1JREFUGNOdzzEKwkAUhOF1QcUUsiBaiVikDnqBLSy0E71AULAOFp4jeALxJIIXEc0mEhH+M/jW6AF0qvmqN0+pPzOz5ebbu0jWVW9ZD2fe6FBMwpSz7zXLUQ+buKGggVO6MClbwYCn0ixO5IKETAU8IgoBXGcJeRsEMdkB8oi7YM6zDqMLN0GTshYXxrISaMtWm6C6o/qUkzBmrD4T/LZ9tbTnsfz+ME3d7of3X1WUUZSrxwjQAAAAAElFTkSuQmCC") !important; }
+.form-password .password-wrap {
+  display: flex; }
+  .form-password .password-wrap .password-toggle {
+    width: 48px;
+    background-repeat: no-repeat;
+    background-position: center; }
+  .form-password .password-wrap .password-visible {
+    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAnUExURUdwTDExMTAwMDExMTMzMzExMTExMTAwMDAwMDIyMjIyMjAwMDIyMtDcR4EAAAAMdFJOUwDfIO86ksUQf1ivcKwSZ8wAAABaSURBVBjTY2AYcMB4Bg4EUDlMMtZgFezNBxUY2GXOSDgwMDA1nzlWwMB6cOKZw2lpNmcyZQIYmI0YvEAaljAoA/UoMLAedXGJCQCxQKYfYWDwMYBZJQDBlAMAlfIjX/5EzDQAAAAASUVORK5CYII=") !important; }
+  .form-password .password-wrap .password-hidden {
+    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAtUExURUdwTDAwMDAwMDExMTExMTExMTExMTIyMjExMTAwMDAwMDIyMjIyMjAwMDIyMm633p8AAAAOdFJOUwAgEN9BwKGQzzB/YO9gZ/nLrQAAAK1JREFUGNOdzzEKwkAUhOF1QcUUsiBaiVikDnqBLSy0E71AULAOFp4jeALxJIIXEc0mEhH+M/jW6AF0qvmqN0+pPzOz5ebbu0jWVW9ZD2fe6FBMwpSz7zXLUQ+buKGggVO6MClbwYCn0ixO5IKETAU8IgoBXGcJeRsEMdkB8oi7YM6zDqMLN0GTshYXxrISaMtWm6C6o/qUkzBmrD4T/LZ9tbTnsfz+ME3d7of3X1WUUZSrxwjQAAAAAElFTkSuQmCC") !important; }
 
 .valid-feedback {
   display: none;
@@ -8006,47 +8006,47 @@ form.user .btn-user {
 
 @keyframes noise-anim {
   0% {
-    clip: rect(24px, 9999px, 70px, 0); }
+    clip: rect(81px, 9999px, 78px, 0); }
   5% {
-    clip: rect(63px, 9999px, 41px, 0); }
+    clip: rect(84px, 9999px, 36px, 0); }
   10% {
-    clip: rect(39px, 9999px, 79px, 0); }
+    clip: rect(15px, 9999px, 90px, 0); }
   15% {
-    clip: rect(27px, 9999px, 89px, 0); }
+    clip: rect(34px, 9999px, 83px, 0); }
   20% {
-    clip: rect(84px, 9999px, 4px, 0); }
+    clip: rect(58px, 9999px, 98px, 0); }
   25% {
-    clip: rect(36px, 9999px, 17px, 0); }
+    clip: rect(27px, 9999px, 48px, 0); }
   30% {
-    clip: rect(8px, 9999px, 73px, 0); }
+    clip: rect(3px, 9999px, 42px, 0); }
   35% {
-    clip: rect(22px, 9999px, 81px, 0); }
+    clip: rect(39px, 9999px, 61px, 0); }
   40% {
-    clip: rect(56px, 9999px, 39px, 0); }
+    clip: rect(16px, 9999px, 67px, 0); }
   45% {
-    clip: rect(55px, 9999px, 75px, 0); }
+    clip: rect(75px, 9999px, 75px, 0); }
   50% {
-    clip: rect(47px, 9999px, 43px, 0); }
+    clip: rect(8px, 9999px, 23px, 0); }
   55% {
-    clip: rect(82px, 9999px, 27px, 0); }
+    clip: rect(33px, 9999px, 55px, 0); }
   60% {
-    clip: rect(53px, 9999px, 67px, 0); }
+    clip: rect(37px, 9999px, 64px, 0); }
   65% {
-    clip: rect(13px, 9999px, 44px, 0); }
+    clip: rect(62px, 9999px, 7px, 0); }
   70% {
-    clip: rect(89px, 9999px, 99px, 0); }
+    clip: rect(11px, 9999px, 42px, 0); }
   75% {
-    clip: rect(4px, 9999px, 54px, 0); }
+    clip: rect(91px, 9999px, 94px, 0); }
   80% {
-    clip: rect(13px, 9999px, 60px, 0); }
+    clip: rect(65px, 9999px, 24px, 0); }
   85% {
-    clip: rect(89px, 9999px, 53px, 0); }
+    clip: rect(55px, 9999px, 49px, 0); }
   90% {
-    clip: rect(12px, 9999px, 75px, 0); }
+    clip: rect(65px, 9999px, 87px, 0); }
   95% {
-    clip: rect(5px, 9999px, 82px, 0); }
+    clip: rect(70px, 9999px, 1px, 0); }
   100% {
-    clip: rect(53px, 9999px, 56px, 0); } }
+    clip: rect(18px, 9999px, 22px, 0); } }
 
 .error:after {
   content: attr(data-text);
@@ -8062,47 +8062,47 @@ form.user .btn-user {
 
 @keyframes noise-anim-2 {
   0% {
-    clip: rect(77px, 9999px, 100px, 0); }
+    clip: rect(2px, 9999px, 14px, 0); }
   5% {
-    clip: rect(56px, 9999px, 1px, 0); }
+    clip: rect(56px, 9999px, 75px, 0); }
   10% {
-    clip: rect(28px, 9999px, 56px, 0); }
+    clip: rect(36px, 9999px, 1px, 0); }
   15% {
-    clip: rect(46px, 9999px, 53px, 0); }
+    clip: rect(23px, 9999px, 24px, 0); }
   20% {
-    clip: rect(71px, 9999px, 89px, 0); }
+    clip: rect(60px, 9999px, 99px, 0); }
   25% {
-    clip: rect(64px, 9999px, 44px, 0); }
+    clip: rect(16px, 9999px, 27px, 0); }
   30% {
-    clip: rect(35px, 9999px, 6px, 0); }
+    clip: rect(24px, 9999px, 72px, 0); }
   35% {
-    clip: rect(97px, 9999px, 10px, 0); }
+    clip: rect(97px, 9999px, 78px, 0); }
   40% {
-    clip: rect(23px, 9999px, 33px, 0); }
+    clip: rect(32px, 9999px, 49px, 0); }
   45% {
-    clip: rect(19px, 9999px, 66px, 0); }
+    clip: rect(33px, 9999px, 63px, 0); }
   50% {
-    clip: rect(49px, 9999px, 45px, 0); }
+    clip: rect(79px, 9999px, 36px, 0); }
   55% {
-    clip: rect(29px, 9999px, 55px, 0); }
+    clip: rect(37px, 9999px, 18px, 0); }
   60% {
-    clip: rect(85px, 9999px, 26px, 0); }
+    clip: rect(33px, 9999px, 5px, 0); }
   65% {
-    clip: rect(28px, 9999px, 78px, 0); }
+    clip: rect(63px, 9999px, 62px, 0); }
   70% {
-    clip: rect(78px, 9999px, 91px, 0); }
+    clip: rect(17px, 9999px, 60px, 0); }
   75% {
-    clip: rect(81px, 9999px, 93px, 0); }
+    clip: rect(75px, 9999px, 18px, 0); }
   80% {
-    clip: rect(41px, 9999px, 40px, 0); }
+    clip: rect(48px, 9999px, 46px, 0); }
   85% {
-    clip: rect(8px, 9999px, 16px, 0); }
+    clip: rect(38px, 9999px, 77px, 0); }
   90% {
-    clip: rect(59px, 9999px, 14px, 0); }
+    clip: rect(2px, 9999px, 18px, 0); }
   95% {
-    clip: rect(100px, 9999px, 60px, 0); }
+    clip: rect(7px, 9999px, 74px, 0); }
   100% {
-    clip: rect(70px, 9999px, 89px, 0); } }
+    clip: rect(81px, 9999px, 13px, 0); } }
 
 .error:before {
   content: attr(data-text);