fix(text-field): Removed white-space chars from helper text

material-components · Jul 25, 2018 · b132601 · b132601
1 parent 3578a2b
commit b132601
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 12 deletions.
diff --git a/demos/text-field.html b/demos/text-field.html
@@ -80,8 +80,8 @@ <h2>Full Functionality JS Component (Floating Label, Validation)</h2>
             <div class="mdc-line-ripple"></div>
           </div>
           <p id="my-text-field-helper-text" class="mdc-text-field-helper-text"
-             aria-hidden="true" style="display:none;">
-            Helper Text (possibly validation message)
+             aria-hidden="true" style="display:none;"
+             >Helper Text (possibly validation message)
           </p>
         </section>
         <div>
@@ -131,14 +131,14 @@ <h2>Password field with validation</h2>
           <div class="mdc-line-ripple"></div>
         </div>
         <p class="mdc-text-field-helper-text mdc-text-field-helper-text--persistent mdc-text-field-helper-text--validation-msg"
-           id="pw-validation-msg">
-          Must be at least 8 characters long
+           id="pw-validation-msg"
+          >Must be at least 8 characters long
         </p>
       </section>
 
       <section class="example">
         <h2>Outlined Text Field</h2>
-        <div id="demo-tf-outlined-wrapper">
+        <div id="demo-tf-outlined-wrapper" class="demo-text-field-wrapper">
           <div id="tf-outlined-example" class="mdc-text-field mdc-text-field--outlined" data-demo-no-auto-js>
             <input type="text" id="tf-outlined-input" class="mdc-text-field__input"
                    aria-controls="name-validation-message"
@@ -152,8 +152,8 @@ <h2>Outlined Text Field</h2>
             <div class="mdc-notched-outline__idle"></div>
           </div>
           <p class="mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg"
-             id="name-validation-message">
-            Helper Text (possibly validation message)
+             id="name-validation-message"
+            >Helper Text (possibly validation message)
           </p>
         </div>
         <div>
@@ -198,8 +198,8 @@ <h2>Text Field box</h2>
           </div>
           <p class="mdc-text-field-helper-text"
             id="box-name-validation-message"
-            style="display: none;">
-            Helper Text (possibly validation message)
+            style="display: none;"
+            >Helper Text (possibly validation message)
           </p>
         </div>
         <div>

diff --git a/packages/mdc-textfield/helper-text/README.md b/packages/mdc-textfield/helper-text/README.md
@@ -57,9 +57,7 @@ the input element.
   <label for="username" class="mdc-floating-label">Username</label>
   <div class="mdc-line-ripple"></div>
 </div>
-<p id="username-helper-text" class="mdc-text-field-helper-text" aria-hidden="true">
-  This will be displayed on your public profile
-</p>
+<p id="username-helper-text" class="mdc-text-field-helper-text" aria-hidden="true">This will be displayed on your public profile</p>
 ```
 
 When using our vanilla JS component, if the browser sees that the input element has an `aria-controls`