From d69b539a98be7b15dd91654c7b56f79d53319601 Mon Sep 17 00:00:00 2001
From: habubey <habubey@outlook.com>
Date: Wed, 3 Aug 2022 00:25:39 +0300
Subject: [PATCH 1/2] Password label is same as meter color

---
 components/lib/password/Password.js             |  2 +-
 public/themes/arya-blue/theme.css               | 10 +++++++++-
 public/themes/arya-green/theme.css              | 10 ++++++++++
 public/themes/arya-orange/theme.css             |  9 +++++++++
 public/themes/arya-purple/theme.css             |  9 +++++++++
 public/themes/bootstrap4-dark-blue/theme.css    |  9 +++++++++
 public/themes/bootstrap4-dark-purple/theme.css  |  9 +++++++++
 public/themes/bootstrap4-light-blue/theme.css   |  9 +++++++++
 public/themes/bootstrap4-light-purple/theme.css | 10 ++++++++++
 public/themes/fluent-light/theme.css            | 10 ++++++++++
 public/themes/lara-dark-blue/theme.css          |  9 +++++++++
 public/themes/lara-dark-indigo/theme.css        | 10 ++++++++++
 public/themes/lara-dark-purple/theme.css        |  9 +++++++++
 public/themes/lara-dark-teal/theme.css          | 10 ++++++++++
 public/themes/lara-light-blue/theme.css         |  9 +++++++++
 public/themes/lara-light-indigo/theme.css       |  9 +++++++++
 public/themes/lara-light-purple/theme.css       |  9 +++++++++
 public/themes/lara-light-teal/theme.css         |  9 +++++++++
 public/themes/luna-amber/theme.css              | 10 +++++++++-
 public/themes/luna-blue/theme.css               |  9 +++++++++
 public/themes/luna-green/theme.css              | 10 +++++++++-
 public/themes/luna-pink/theme.css               |  9 +++++++++
 public/themes/md-dark-deeppurple/theme.css      |  9 +++++++++
 public/themes/md-dark-indigo/theme.css          | 10 +++++++++-
 public/themes/md-light-deeppurple/theme.css     | 10 +++++++++-
 public/themes/md-light-indigo/theme.css         | 10 +++++++++-
 public/themes/mdc-dark-deeppurple/theme.css     | 10 +++++++++-
 public/themes/mdc-dark-indigo/theme.css         |  9 +++++++++
 public/themes/mdc-light-deeppurple/theme.css    | 10 +++++++++-
 public/themes/mdc-light-indigo/theme.css        |  9 +++++++++
 public/themes/nova-accent/theme.css             | 10 +++++++++-
 public/themes/nova-alt/theme.css                |  9 +++++++++
 public/themes/nova/theme.css                    |  9 +++++++++
 public/themes/rhea/theme.css                    | 10 +++++++++-
 public/themes/saga-blue/theme.css               |  9 +++++++++
 public/themes/saga-green/theme.css              | 10 +++++++++-
 public/themes/saga-orange/theme.css             | 10 +++++++++-
 public/themes/saga-purple/theme.css             | 10 +++++++++-
 public/themes/tailwind-light/theme.css          |  9 +++++++++
 public/themes/vela-blue/theme.css               |  9 +++++++++
 public/themes/vela-green/theme.css              |  9 +++++++++
 public/themes/vela-orange/theme.css             |  9 +++++++++
 public/themes/vela-purple/theme.css             | 10 +++++++++-
 43 files changed, 384 insertions(+), 15 deletions(-)

diff --git a/components/lib/password/Password.js b/components/lib/password/Password.js
index 342baa5fc5..0b51099add 100644
--- a/components/lib/password/Password.js
+++ b/components/lib/password/Password.js
@@ -269,7 +269,7 @@ export const Password = React.memo(React.forwardRef((props, ref) => {
                 <div className="p-password-meter">
                     <div className={`p-password-strength ${strength}`} style={{ width }}></div>
                 </div>
-                <div className="p-password-info">
+                <div className={`p-password-info ${strength}`}>
                     {infoTextState}
                 </div>
             </>
diff --git a/public/themes/arya-blue/theme.css b/public/themes/arya-blue/theme.css
index 0c372068b9..fa95453d5e 100644
--- a/public/themes/arya-blue/theme.css
+++ b/public/themes/arya-blue/theme.css
@@ -1438,7 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #C5E1A5;
 }
-
+.p-password-panel .p-password-info.weak {
+  color: #F48FB1;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FFE082;
+}
+.p-password-panel .p-password-info.strong {
+  color: #C5E1A5;
+}
 .p-radiobutton {
   width: 20px;
   height: 20px;
diff --git a/public/themes/arya-green/theme.css b/public/themes/arya-green/theme.css
index 5fe0f27031..6ca7c48c14 100644
--- a/public/themes/arya-green/theme.css
+++ b/public/themes/arya-green/theme.css
@@ -1439,6 +1439,16 @@
   background: #C5E1A5;
 }
 
+.p-password-panel .p-password-info.weak {
+  color: #F48FB1;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FFE082;
+}
+.p-password-panel .p-password-info.strong {
+  color: #C5E1A5;
+}
+
 .p-radiobutton {
   width: 20px;
   height: 20px;
diff --git a/public/themes/arya-orange/theme.css b/public/themes/arya-orange/theme.css
index cc976972da..20f8c77186 100644
--- a/public/themes/arya-orange/theme.css
+++ b/public/themes/arya-orange/theme.css
@@ -1438,6 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #C5E1A5;
 }
+.p-password-panel .p-password-info.weak {
+  color: #F48FB1;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FFE082;
+}
+.p-password-panel .p-password-info.strong {
+  color: #C5E1A5;
+}
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/arya-purple/theme.css b/public/themes/arya-purple/theme.css
index 503b818bf1..7949def293 100644
--- a/public/themes/arya-purple/theme.css
+++ b/public/themes/arya-purple/theme.css
@@ -1438,6 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #C5E1A5;
 }
+.p-password-panel .p-password-info.weak {
+  color: #F48FB1;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FFE082;
+}
+.p-password-panel .p-password-info.strong {
+  color: #C5E1A5;
+}
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/bootstrap4-dark-blue/theme.css b/public/themes/bootstrap4-dark-blue/theme.css
index 799e611789..3cd5b38fa4 100644
--- a/public/themes/bootstrap4-dark-blue/theme.css
+++ b/public/themes/bootstrap4-dark-blue/theme.css
@@ -1442,6 +1442,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #9fdaa8;
 }
+.p-password-panel .p-password-info.weak {
+  color: #f19ea6;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ffe082;
+}
+.p-password-panel .p-password-info.strong {
+  color: #9fdaa8;
+}
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/bootstrap4-dark-purple/theme.css b/public/themes/bootstrap4-dark-purple/theme.css
index e0791fa169..1fbe11922f 100644
--- a/public/themes/bootstrap4-dark-purple/theme.css
+++ b/public/themes/bootstrap4-dark-purple/theme.css
@@ -1442,6 +1442,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #9fdaa8;
 }
+.p-password-panel .p-password-info.weak {
+  color: #f19ea6;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ffe082;
+}
+.p-password-panel .p-password-info.strong {
+  color: #9fdaa8;
+}
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/bootstrap4-light-blue/theme.css b/public/themes/bootstrap4-light-blue/theme.css
index a0e9a89905..5b0da06fbc 100644
--- a/public/themes/bootstrap4-light-blue/theme.css
+++ b/public/themes/bootstrap4-light-blue/theme.css
@@ -1442,6 +1442,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #28a745;
 }
+.p-password-panel .p-password-info.weak {
+  color: #dc3545;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ffc107;
+}
+.p-password-panel .p-password-info.strong {
+  color: #28a745;
+}
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/bootstrap4-light-purple/theme.css b/public/themes/bootstrap4-light-purple/theme.css
index 94842870c9..1c1a034ca7 100644
--- a/public/themes/bootstrap4-light-purple/theme.css
+++ b/public/themes/bootstrap4-light-purple/theme.css
@@ -1442,6 +1442,16 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #28a745;
 }
+.p-password-panel .p-password-info.weak {
+  color: #dc3545;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ffc107;
+}
+.p-password-panel .p-password-info.strong {
+  color: #28a745;
+}
+
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/fluent-light/theme.css b/public/themes/fluent-light/theme.css
index 9414733b2b..a531ecdb20 100644
--- a/public/themes/fluent-light/theme.css
+++ b/public/themes/fluent-light/theme.css
@@ -1438,6 +1438,16 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #498205;
 }
+.p-password-panel .p-password-info.weak {
+  color: #d13438;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ffaa44;
+}
+.p-password-panel .p-password-info.strong {
+  color: #498205;
+}
+
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/lara-dark-blue/theme.css b/public/themes/lara-dark-blue/theme.css
index bbcf25f583..04e7c4ad6e 100644
--- a/public/themes/lara-dark-blue/theme.css
+++ b/public/themes/lara-dark-blue/theme.css
@@ -1438,6 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #93deac;
 }
+.p-password-panel .p-password-info.weak {
+  color: #eb9a9c;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ffcf91;
+}
+.p-password-panel .p-password-info.strong {
+  color: #93deac;
+}
 
 .p-radiobutton {
   width: 22px;
diff --git a/public/themes/lara-dark-indigo/theme.css b/public/themes/lara-dark-indigo/theme.css
index 6b5f736677..536808d7cd 100644
--- a/public/themes/lara-dark-indigo/theme.css
+++ b/public/themes/lara-dark-indigo/theme.css
@@ -1438,6 +1438,16 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #93deac;
 }
+.p-password-panel .p-password-info.weak {
+  color: #eb9a9c;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ffcf91;
+}
+.p-password-panel .p-password-info.strong {
+  color: #93deac;
+}
+
 
 .p-radiobutton {
   width: 22px;
diff --git a/public/themes/lara-dark-purple/theme.css b/public/themes/lara-dark-purple/theme.css
index 8ca6baaeae..7de4426dd5 100644
--- a/public/themes/lara-dark-purple/theme.css
+++ b/public/themes/lara-dark-purple/theme.css
@@ -1438,6 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #93deac;
 }
+.p-password-panel .p-password-info.weak {
+  color: #eb9a9c;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ffcf91;
+}
+.p-password-panel .p-password-info.strong {
+  color: #93deac;
+}
 
 .p-radiobutton {
   width: 22px;
diff --git a/public/themes/lara-dark-teal/theme.css b/public/themes/lara-dark-teal/theme.css
index ec424f77df..ed042ef00a 100644
--- a/public/themes/lara-dark-teal/theme.css
+++ b/public/themes/lara-dark-teal/theme.css
@@ -1438,6 +1438,16 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #93deac;
 }
+.p-password-panel .p-password-info.weak {
+  color: #eb9a9c;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ffcf91;
+}
+.p-password-panel .p-password-info.strong {
+  color: #93deac;
+}
+
 
 .p-radiobutton {
   width: 22px;
diff --git a/public/themes/lara-light-blue/theme.css b/public/themes/lara-light-blue/theme.css
index 382d4f8be5..4206b8f9c6 100644
--- a/public/themes/lara-light-blue/theme.css
+++ b/public/themes/lara-light-blue/theme.css
@@ -1438,6 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #29c76f;
 }
+.p-password-panel .p-password-info.weak {
+  color: #ea5455;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ff9f42;
+}
+.p-password-panel .p-password-info.strong {
+  color: #29c76f;
+}
 
 .p-radiobutton {
   width: 22px;
diff --git a/public/themes/lara-light-indigo/theme.css b/public/themes/lara-light-indigo/theme.css
index 20fc718600..c6fdc57d21 100644
--- a/public/themes/lara-light-indigo/theme.css
+++ b/public/themes/lara-light-indigo/theme.css
@@ -1438,6 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #29c76f;
 }
+.p-password-panel .p-password-info.weak {
+  color: #ea5455;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ff9f42;
+}
+.p-password-panel .p-password-info.strong {
+  color: #29c76f;
+}
 
 .p-radiobutton {
   width: 22px;
diff --git a/public/themes/lara-light-purple/theme.css b/public/themes/lara-light-purple/theme.css
index 69199b6087..9b3cc3972f 100644
--- a/public/themes/lara-light-purple/theme.css
+++ b/public/themes/lara-light-purple/theme.css
@@ -1438,6 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #29c76f;
 }
+.p-password-panel .p-password-info.weak {
+  color: #ea5455;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ff9f42;
+}
+.p-password-panel .p-password-info.strong {
+  color: #29c76f;
+}
 
 .p-radiobutton {
   width: 22px;
diff --git a/public/themes/lara-light-teal/theme.css b/public/themes/lara-light-teal/theme.css
index 18f7b8fea5..8c269963bc 100644
--- a/public/themes/lara-light-teal/theme.css
+++ b/public/themes/lara-light-teal/theme.css
@@ -1438,6 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #29c76f;
 }
+.p-password-panel .p-password-info.weak {
+  color: #ea5455;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ff9f42;
+}
+.p-password-panel .p-password-info.strong {
+  color: #29c76f;
+}
 
 .p-radiobutton {
   width: 22px;
diff --git a/public/themes/luna-amber/theme.css b/public/themes/luna-amber/theme.css
index 9e1937516c..7d4b02a88c 100644
--- a/public/themes/luna-amber/theme.css
+++ b/public/themes/luna-amber/theme.css
@@ -1442,7 +1442,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #AED581;
 }
-
+.p-password-panel .p-password-info.weak {
+  color: #E57373;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FFB74D;
+}
+.p-password-panel .p-password-info.strong {
+  color: #AED581;
+}
 .p-radiobutton {
   width: 20px;
   height: 20px;
diff --git a/public/themes/luna-blue/theme.css b/public/themes/luna-blue/theme.css
index 3e4a068b62..122676360d 100644
--- a/public/themes/luna-blue/theme.css
+++ b/public/themes/luna-blue/theme.css
@@ -1442,6 +1442,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #AED581;
 }
+.p-password-panel .p-password-info.weak {
+  color: #E57373;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FFB74D;
+}
+.p-password-panel .p-password-info.strong {
+  color: #AED581;
+}
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/luna-green/theme.css b/public/themes/luna-green/theme.css
index 197599c73f..150807bb44 100644
--- a/public/themes/luna-green/theme.css
+++ b/public/themes/luna-green/theme.css
@@ -1442,7 +1442,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #AED581;
 }
-
+.p-password-panel .p-password-info.weak {
+  color: #E57373;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FFB74D;
+}
+.p-password-panel .p-password-info.strong {
+  color: #AED581;
+}
 .p-radiobutton {
   width: 20px;
   height: 20px;
diff --git a/public/themes/luna-pink/theme.css b/public/themes/luna-pink/theme.css
index e1af307622..a4a441a95a 100644
--- a/public/themes/luna-pink/theme.css
+++ b/public/themes/luna-pink/theme.css
@@ -1442,6 +1442,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #AED581;
 }
+.p-password-panel .p-password-info.weak {
+  color: #E57373;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FFB74D;
+}
+.p-password-panel .p-password-info.strong {
+  color: #AED581;
+}
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/md-dark-deeppurple/theme.css b/public/themes/md-dark-deeppurple/theme.css
index d978c9e516..728c6c3509 100644
--- a/public/themes/md-dark-deeppurple/theme.css
+++ b/public/themes/md-dark-deeppurple/theme.css
@@ -1462,6 +1462,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #C5E1A5;
 }
+.p-password-panel .p-password-info.weak {
+  color: #EF9A9A;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FFF59D;
+}
+.p-password-panel .p-password-info.strong {
+  color: #C5E1A5;
+}
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/md-dark-indigo/theme.css b/public/themes/md-dark-indigo/theme.css
index b7fd315b32..c39938cacd 100644
--- a/public/themes/md-dark-indigo/theme.css
+++ b/public/themes/md-dark-indigo/theme.css
@@ -1462,7 +1462,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #C5E1A5;
 }
-
+.p-password-panel .p-password-info.weak {
+  color: #EF9A9A;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FFF59D;
+}
+.p-password-panel .p-password-info.strong {
+  color: #C5E1A5;
+}
 .p-radiobutton {
   width: 20px;
   height: 20px;
diff --git a/public/themes/md-light-deeppurple/theme.css b/public/themes/md-light-deeppurple/theme.css
index 89862e7ea8..c88446ebec 100644
--- a/public/themes/md-light-deeppurple/theme.css
+++ b/public/themes/md-light-deeppurple/theme.css
@@ -1462,7 +1462,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #689F38;
 }
-
+.p-password-panel .p-password-info.weak {
+  color: #D32F2F;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FBC02D;
+}
+.p-password-panel .p-password-info.strong {
+  color: #689F38;
+}
 .p-radiobutton {
   width: 20px;
   height: 20px;
diff --git a/public/themes/md-light-indigo/theme.css b/public/themes/md-light-indigo/theme.css
index 9506705a42..e0694b5ead 100644
--- a/public/themes/md-light-indigo/theme.css
+++ b/public/themes/md-light-indigo/theme.css
@@ -1462,7 +1462,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #689F38;
 }
-
+.p-password-panel .p-password-info.weak {
+  color: #D32F2F;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FBC02D;
+}
+.p-password-panel .p-password-info.strong {
+  color: #689F38;
+}
 .p-radiobutton {
   width: 20px;
   height: 20px;
diff --git a/public/themes/mdc-dark-deeppurple/theme.css b/public/themes/mdc-dark-deeppurple/theme.css
index e5839064cd..6d7975d973 100644
--- a/public/themes/mdc-dark-deeppurple/theme.css
+++ b/public/themes/mdc-dark-deeppurple/theme.css
@@ -1462,7 +1462,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #C5E1A5;
 }
-
+.p-password-panel .p-password-info.weak {
+  color: #EF9A9A;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FFF59D;
+}
+.p-password-panel .p-password-info.strong {
+  color: #C5E1A5;
+}
 .p-radiobutton {
   width: 20px;
   height: 20px;
diff --git a/public/themes/mdc-dark-indigo/theme.css b/public/themes/mdc-dark-indigo/theme.css
index d1b2ff5b98..854061da14 100644
--- a/public/themes/mdc-dark-indigo/theme.css
+++ b/public/themes/mdc-dark-indigo/theme.css
@@ -1462,6 +1462,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #C5E1A5;
 }
+.p-password-panel .p-password-info.weak {
+  color: #EF9A9A;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FFF59D;
+}
+.p-password-panel .p-password-info.strong {
+  color: #C5E1A5;
+}
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/mdc-light-deeppurple/theme.css b/public/themes/mdc-light-deeppurple/theme.css
index acaf6958fb..e15a5a8a3f 100644
--- a/public/themes/mdc-light-deeppurple/theme.css
+++ b/public/themes/mdc-light-deeppurple/theme.css
@@ -1462,7 +1462,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #689F38;
 }
-
+.p-password-panel .p-password-info.weak {
+  color: #D32F2F;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FBC02D;
+}
+.p-password-panel .p-password-info.strong {
+  color: #689F38;
+}
 .p-radiobutton {
   width: 20px;
   height: 20px;
diff --git a/public/themes/mdc-light-indigo/theme.css b/public/themes/mdc-light-indigo/theme.css
index b483a56687..8c08ab490c 100644
--- a/public/themes/mdc-light-indigo/theme.css
+++ b/public/themes/mdc-light-indigo/theme.css
@@ -1462,6 +1462,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #689F38;
 }
+.p-password-panel .p-password-info.weak {
+  color: #D32F2F;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FBC02D;
+}
+.p-password-panel .p-password-info.strong {
+  color: #689F38;
+}
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/nova-accent/theme.css b/public/themes/nova-accent/theme.css
index 15adeb8959..daabcfec76 100644
--- a/public/themes/nova-accent/theme.css
+++ b/public/themes/nova-accent/theme.css
@@ -1438,7 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #34A835;
 }
-
+.p-password-panel .p-password-info.weak {
+  color: #e91224;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ffba01;
+}
+.p-password-panel .p-password-info.strong {
+  color: #34A835;
+}
 .p-radiobutton {
   width: 20px;
   height: 20px;
diff --git a/public/themes/nova-alt/theme.css b/public/themes/nova-alt/theme.css
index 92bb3e84fa..c9b55c8dcb 100644
--- a/public/themes/nova-alt/theme.css
+++ b/public/themes/nova-alt/theme.css
@@ -1442,6 +1442,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #34A835;
 }
+.p-password-panel .p-password-info.weak {
+  color: #e91224;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ffba01;
+}
+.p-password-panel .p-password-info.strong {
+  color: #34A835;
+}
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/nova/theme.css b/public/themes/nova/theme.css
index 3e1044c560..ee6ce5bf19 100644
--- a/public/themes/nova/theme.css
+++ b/public/themes/nova/theme.css
@@ -1442,6 +1442,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #34A835;
 }
+.p-password-panel .p-password-info.weak {
+  color: #e91224;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ffba01;
+}
+.p-password-panel .p-password-info.strong {
+  color: #34A835;
+}
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/rhea/theme.css b/public/themes/rhea/theme.css
index 5ba138ad35..5202618baa 100644
--- a/public/themes/rhea/theme.css
+++ b/public/themes/rhea/theme.css
@@ -1438,7 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #A3E2C6;
 }
-
+.p-password-panel .p-password-info.weak {
+  color: #F4B6B6;
+}
+.p-password-panel .p-password-info.medium {
+  color: #ffe38e;
+}
+.p-password-panel .p-password-info.strong {
+  color: #A3E2C6;
+}
 .p-radiobutton {
   width: 20px;
   height: 20px;
diff --git a/public/themes/saga-blue/theme.css b/public/themes/saga-blue/theme.css
index 3bd52973e5..6cafdc075c 100644
--- a/public/themes/saga-blue/theme.css
+++ b/public/themes/saga-blue/theme.css
@@ -1438,6 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #689F38;
 }
+.p-password-panel .p-password-info.weak {
+  color: #D32F2F;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FBC02D;
+}
+.p-password-panel .p-password-info.strong {
+  color: #689F38;
+}
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/saga-green/theme.css b/public/themes/saga-green/theme.css
index 5d02c42e15..724b685b1d 100644
--- a/public/themes/saga-green/theme.css
+++ b/public/themes/saga-green/theme.css
@@ -1438,7 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #689F38;
 }
-
+.p-password-panel .p-password-info.weak {
+  color: #D32F2F;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FBC02D;
+}
+.p-password-panel .p-password-info.strong {
+  color: #689F38;
+}
 .p-radiobutton {
   width: 20px;
   height: 20px;
diff --git a/public/themes/saga-orange/theme.css b/public/themes/saga-orange/theme.css
index b3d1d857f2..998cd31a10 100644
--- a/public/themes/saga-orange/theme.css
+++ b/public/themes/saga-orange/theme.css
@@ -1438,7 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #689F38;
 }
-
+.p-password-panel .p-password-info.weak {
+  color: #D32F2F;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FBC02D;
+}
+.p-password-panel .p-password-info.strong {
+  color: #689F38;
+}
 .p-radiobutton {
   width: 20px;
   height: 20px;
diff --git a/public/themes/saga-purple/theme.css b/public/themes/saga-purple/theme.css
index 95f04c4d9f..a2fcf1c252 100644
--- a/public/themes/saga-purple/theme.css
+++ b/public/themes/saga-purple/theme.css
@@ -1438,7 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #689F38;
 }
-
+.p-password-panel .p-password-info.weak {
+  color: #D32F2F;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FBC02D;
+}
+.p-password-panel .p-password-info.strong {
+  color: #689F38;
+}
 .p-radiobutton {
   width: 20px;
   height: 20px;
diff --git a/public/themes/tailwind-light/theme.css b/public/themes/tailwind-light/theme.css
index 642e5927ce..44adbf5c7f 100644
--- a/public/themes/tailwind-light/theme.css
+++ b/public/themes/tailwind-light/theme.css
@@ -1473,6 +1473,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #22C55E;
 }
+.p-password-panel .p-password-info.weak {
+  color: #EF4444;
+}
+.p-password-panel .p-password-info.medium {
+  color: #F59E0B;
+}
+.p-password-panel .p-password-info.strong {
+  color: #22C55E;
+}
 
 .p-radiobutton {
   width: 16px;
diff --git a/public/themes/vela-blue/theme.css b/public/themes/vela-blue/theme.css
index 6d5dee0ca2..694d13ad4f 100644
--- a/public/themes/vela-blue/theme.css
+++ b/public/themes/vela-blue/theme.css
@@ -1438,6 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #C5E1A5;
 }
+.p-password-panel .p-password-info.weak {
+  color: #F48FB1;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FFE082;
+}
+.p-password-panel .p-password-info.strong {
+  color: #C5E1A5;
+}
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/vela-green/theme.css b/public/themes/vela-green/theme.css
index 99feea6541..fb4672a0af 100644
--- a/public/themes/vela-green/theme.css
+++ b/public/themes/vela-green/theme.css
@@ -1438,6 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #C5E1A5;
 }
+.p-password-panel .p-password-info.weak {
+  color: #F48FB1;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FFE082;
+}
+.p-password-panel .p-password-info.strong {
+  color: #C5E1A5;
+}
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/vela-orange/theme.css b/public/themes/vela-orange/theme.css
index 6479f19386..bf14a9c028 100644
--- a/public/themes/vela-orange/theme.css
+++ b/public/themes/vela-orange/theme.css
@@ -1438,6 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #C5E1A5;
 }
+.p-password-panel .p-password-info.weak {
+  color: #F48FB1;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FFE082;
+}
+.p-password-panel .p-password-info.strong {
+  color: #C5E1A5;
+}
 
 .p-radiobutton {
   width: 20px;
diff --git a/public/themes/vela-purple/theme.css b/public/themes/vela-purple/theme.css
index 102d435007..d44a2e977b 100644
--- a/public/themes/vela-purple/theme.css
+++ b/public/themes/vela-purple/theme.css
@@ -1438,7 +1438,15 @@
 .p-password-panel .p-password-meter .p-password-strength.strong {
   background: #C5E1A5;
 }
-
+.p-password-panel .p-password-info.weak {
+  color: #F48FB1;
+}
+.p-password-panel .p-password-info.medium {
+  color: #FFE082;
+}
+.p-password-panel .p-password-info.strong {
+  color: #C5E1A5;
+}
 .p-radiobutton {
   width: 20px;
   height: 20px;

From fd1d5942771943c5eb4cc2dbbe54a7ae1d46760d Mon Sep 17 00:00:00 2001
From: Melloware <mellowaredev@gmail.com>
Date: Sat, 10 Sep 2022 11:08:29 -0400
Subject: [PATCH 2/2] Update Password.js

---
 components/lib/password/Password.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/lib/password/Password.js b/components/lib/password/Password.js
index d908800a4f..2760a45137 100644
--- a/components/lib/password/Password.js
+++ b/components/lib/password/Password.js
@@ -267,7 +267,7 @@ export const Password = React.memo(
                     <div className="p-password-meter">
                         <div className={`p-password-strength ${strength}`} style={{ width }}></div>
                     </div>
-                    <div className="p-password-info ${strength}">{infoTextState}</div>
+                    <div className={`p-password-info ${strength}`}>{infoTextState}</div>
                 </>
             );