Merge pull request #138 from material-components/v6-update

fix: update 101, 102, and 103 to v6

Author: asyncliz

mdc-101/complete/index.html

@@ -25,15 +25,17 @@ <h1>SHRINE</h1>
   </section>
 
   <form action="home.html">
-    <label class="mdc-text-field username">
+    <label class="mdc-text-field mdc-text-field--filled username">
+      <span class="mdc-text-field__ripple"></span>
       <input type="text" class="mdc-text-field__input" aria-labelledby="username-label" name="username" required>
       <span class="mdc-floating-label" id="username-label">Username</span>
-      <div class="mdc-line-ripple"></div>
+      <span class="mdc-line-ripple"></span>
     </label>
-    <label class="mdc-text-field password">
+    <label class="mdc-text-field mdc-text-field--filled password">
+      <span class="mdc-text-field__ripple"></span>
       <input type="password" class="mdc-text-field__input" aria-labelledby="password-label" name="password" required minlength="8">
       <span class="mdc-floating-label" id="password-label">Password</span>
-      <div class="mdc-line-ripple"></div>
+      <span class="mdc-line-ripple"></span>
     </label>
     <div class="button-container">
       <button type="button" class="mdc-button cancel">

mdc-101/complete/login.scss

@@ -15,7 +15,7 @@
 
 .username,
 .password {
-  display: block;
+  display: flex;
   width: 300px;
   margin: 20px auto;
 }

mdc-101/complete/package-lock.json

@@ -20,8 +20,8 @@
     "webpack-dev-server": "^2.4.3"
   },
   "dependencies": {
-    "@material/button": "^4.0.0",
-    "@material/ripple": "^4.0.0",
-    "@material/textfield": "^4.0.0"
+    "@material/button": "^6.0.0",
+    "@material/ripple": "^6.0.0",
+    "@material/textfield": "^6.0.0"
   }
 }

mdc-101/complete/package.json

@@ -25,15 +25,17 @@ <h1>SHRINE</h1>
   </section>
 
   <form action="home.html">
-    <label class="mdc-text-field username">
+    <label class="mdc-text-field mdc-text-field--filled username">
+      <span class="mdc-text-field__ripple"></span>
       <input type="text" class="mdc-text-field__input" aria-labelledby="username-label" name="username" required>
       <span class="mdc-floating-label" id="username-label">Username</span>
-      <div class="mdc-line-ripple"></div>
+      <span class="mdc-line-ripple"></span>
     </label>
-    <label class="mdc-text-field password">
+    <label class="mdc-text-field mdc-text-field--filled password">
+      <span class="mdc-text-field__ripple"></span>
       <input type="password" class="mdc-text-field__input" aria-labelledby="password-label" name="password" required minlength="8">
       <span class="mdc-floating-label" id="password-label">Password</span>
-      <div class="mdc-line-ripple"></div>
+      <span class="mdc-line-ripple"></span>
     </label>
     <div class="button-container">
       <button type="button" class="mdc-button cancel">

mdc-102/complete/index.html

@@ -15,7 +15,7 @@
 
 .username,
 .password {
-  display: block;
+  display: flex;
   width: 300px;
   margin: 20px auto;
 }