fix(component): forms

default input message regex pattern on password input
Orange-OpenSource · Jul 4, 2016 · 017b89f · 017b89f
1 parent 568b743
commit 017b89f
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 4 deletions.
diff --git a/docs-orange/_includes/boostwatch/forms.html b/docs-orange/_includes/boostwatch/forms.html
@@ -167,6 +167,7 @@ <h2 id="forms">Forms</h2>
           <div class="form-group">
               <label class="form-control-label" for="inputDefault">Default input</label>
               <input class="form-control" id="inputDefault" type="text">
+              <span class="form-control-message">This is a hint message</span>
           </div>
 
           <div class="form-group">

diff --git a/docs-orange/examples/orange-form/index.html b/docs-orange/examples/orange-form/index.html
@@ -137,7 +137,8 @@
 					<div class="form-group row is-required">
 						<label for="inputPassword" class="col-sm-3 form-control-label">Password</label>
 						<div class="col-sm-9">
-							<input type="password" class="form-control" id="inputPassword" placeholder="password" required="true">
+							<input type="password" class="form-control" id="inputPassword" placeholder="password" required="true" pattern="^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])\w{6,}$">
+							<span class="form-control-message">Minimum six characters with one lowercase, one uppercase and a number</span>
 						</div>
 					</div>
 					<div class="form-group row is-required">

diff --git a/scss/_o-forms.scss b/scss/_o-forms.scss
@@ -35,13 +35,17 @@
     }
   }
 
-  &.has-danger {
-    .form-control-message {
+  .form-control-message {
       display: inline-block;
       padding: .625rem 0;
       font-size: $font-size-sm;
-      font-weight: bold;
+      font-weight: normal;
+  }
+
+  &.has-danger {
+    .form-control-message {
       color: $brand-danger;
+      font-weight: bold;
     }
   }