fix: semantics a --> button

material-components · May 29, 2019 · 8382c2a · 8382c2a
1 parent b2e6491
commit 8382c2a
Show file tree

Hide file tree

Showing 22 changed files with 45 additions and 45 deletions.
diff --git a/packages/mdc-top-app-bar/README.md b/packages/mdc-top-app-bar/README.md
@@ -44,7 +44,7 @@ npm install @material/top-app-bar
 <header class="mdc-top-app-bar">
   <div class="mdc-top-app-bar__row">
     <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-      <a href="#" class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</a>
+      <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button>
       <span class="mdc-top-app-bar__title">Title</span>
     </section>
   </div>
@@ -94,13 +94,13 @@ Top app bars can contain action items which are placed on the side opposite the
 <header class="mdc-top-app-bar">
   <div class="mdc-top-app-bar__row">
     <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-      <a href="#" class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</a>
+      <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button>
       <span class="mdc-top-app-bar__title">Title</span>
     </section>
     <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-      <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download">file_download</a>
-      <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Print this page">print</a>
-      <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</a>
+      <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download">file_download</button>
+      <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Print this page">print</button>
+      <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</button>
     </section>
   </div>
 </header>
@@ -114,11 +114,11 @@ Short top app bars are top app bars that can collapse to the navigation icon sid
 <header class="mdc-top-app-bar mdc-top-app-bar--short">
   <div class="mdc-top-app-bar__row">
     <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-      <a href="#" class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</a>
+      <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button>
       <span class="mdc-top-app-bar__title">Title</span>
     </section>
     <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-      <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</a>
+      <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</button>
     </section>
   </div>
 </header>

diff --git a/test/screenshot/spec/mdc-drawer/classes/dismissible-below-top-app-bar.html b/test/screenshot/spec/mdc-drawer/classes/dismissible-below-top-app-bar.html
@@ -52,7 +52,7 @@
             <span class="mdc-top-app-bar__title">Dismissible Drawer<i class="test-font--redact-prev-letter"></i></span>
           </section>
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download" alt="Download">file_download</a>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download" alt="Download">file_download</button>
           </section>
         </div>
       </header>

diff --git a/test/screenshot/spec/mdc-drawer/classes/dismissible.html b/test/screenshot/spec/mdc-drawer/classes/dismissible.html
@@ -104,7 +104,7 @@ <h6 class="mdc-list-group__subheader">Labels</h6>
               <span class="mdc-top-app-bar__title">Dismissible Drawer<i class="test-font--redact-prev-letter"></i></span>
             </section>
             <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-              <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download" alt="Download">file_download</a>
+              <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download" alt="Download">file_download</button>
             </section>
           </div>
         </header>

diff --git a/test/screenshot/spec/mdc-drawer/classes/modal.html b/test/screenshot/spec/mdc-drawer/classes/modal.html
@@ -105,7 +105,7 @@ <h6 class="mdc-list-group__subheader">Labels</h6>
               <span class="mdc-top-app-bar__title">Modal Drawer<i class="test-font--redact-prev-letter"></i></span>
             </section>
             <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-              <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download" alt="Download">file_download</a>
+              <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download" alt="Download">file_download</button>
             </section>
           </div>
         </header>

diff --git a/test/screenshot/spec/mdc-drawer/classes/permanent.html b/test/screenshot/spec/mdc-drawer/classes/permanent.html
@@ -104,7 +104,7 @@ <h6 class="mdc-list-group__subheader">Labels</h6>
               <span class="mdc-top-app-bar__title">Permanent Drawer<i class="test-font--redact-prev-letter"></i></span>
             </section>
             <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-              <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download" alt="Download">file_download</a>
+              <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download" alt="Download">file_download</button>
             </section>
           </div>
         </header>

diff --git a/test/screenshot/spec/mdc-drawer/mixins/fill-color-accessible.html b/test/screenshot/spec/mdc-drawer/mixins/fill-color-accessible.html
@@ -103,7 +103,7 @@ <h6 class="mdc-list-group__subheader">Labels</h6>
               <span class="mdc-list-item__text"><span class="mdc-top-app-bar__title">Permanent Drawer<i class="test-font--redact-prev-letter"></i></span></span>
             </section>
             <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-              <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download" alt="Download">file_download</a>
+              <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download" alt="Download">file_download</button>
             </section>
           </div>
         </header>

diff --git a/test/screenshot/spec/mdc-drawer/mixins/fill-color.html b/test/screenshot/spec/mdc-drawer/mixins/fill-color.html
@@ -104,7 +104,7 @@ <h6 class="mdc-list-group__subheader">Labels</h6>
               <span class="mdc-top-app-bar__title">Permanent Drawer<i class="test-font--redact-prev-letter"></i></span>
             </section>
             <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-              <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download" alt="Download">file_download</a>
+              <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download" alt="Download">file_download</button>
             </section>
           </div>
         </header>

diff --git a/test/screenshot/spec/mdc-drawer/mixins/width.html b/test/screenshot/spec/mdc-drawer/mixins/width.html
@@ -96,7 +96,7 @@ <h6 class="mdc-list-group__subheader">Labels</h6>
             <span class="mdc-top-app-bar__title">Dismissible Drawer<i class="test-font--redact-prev-letter"></i></span>
           </section>
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download" alt="Download">file_download</a>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download" alt="Download">file_download</button>
           </section>
         </div>
       </header>

diff --git a/test/screenshot/spec/mdc-top-app-bar/classes/baseline-dense-prominent-with-action-items.html b/test/screenshot/spec/mdc-top-app-bar/classes/baseline-dense-prominent-with-action-items.html
@@ -46,13 +46,13 @@
       <header class="mdc-top-app-bar test-top-app-bar mdc-top-app-bar--dense mdc-top-app-bar--prominent">
         <div class="mdc-top-app-bar__row">
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-            <a href="#" class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</a>
+            <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button>
             <span class="mdc-top-app-bar__title">Title</span>
           </section>
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download">file_download</a>
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Print this page">print</a>
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</a>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download">file_download</button>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Print this page">print</button>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</button>
           </section>
         </div>
       </header>

diff --git a/test/screenshot/spec/mdc-top-app-bar/classes/baseline-dense-prominent.html b/test/screenshot/spec/mdc-top-app-bar/classes/baseline-dense-prominent.html
@@ -46,7 +46,7 @@
       <header class="mdc-top-app-bar test-top-app-bar mdc-top-app-bar--dense mdc-top-app-bar--prominent">
         <div class="mdc-top-app-bar__row">
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-            <a href="#" class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</a>
+            <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button>
             <span class="mdc-top-app-bar__title">Title</span>
           </section>
         </div>

diff --git a/test/screenshot/spec/mdc-top-app-bar/classes/baseline-dense-with-action-items.html b/test/screenshot/spec/mdc-top-app-bar/classes/baseline-dense-with-action-items.html
@@ -46,13 +46,13 @@
       <header class="mdc-top-app-bar test-top-app-bar mdc-top-app-bar--dense">
         <div class="mdc-top-app-bar__row">
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-            <a href="#" class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</a>
+            <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button>
             <span class="mdc-top-app-bar__title">Title</span>
           </section>
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download">file_download</a>
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Print this page">print</a>
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</a>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download">file_download</button>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Print this page">print</button>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</button>
           </section>
         </div>
       </header>

diff --git a/test/screenshot/spec/mdc-top-app-bar/classes/baseline-dense.html b/test/screenshot/spec/mdc-top-app-bar/classes/baseline-dense.html
@@ -46,7 +46,7 @@
       <header class="mdc-top-app-bar test-top-app-bar mdc-top-app-bar--dense">
         <div class="mdc-top-app-bar__row">
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-            <a href="#" class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</a>
+            <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button>
             <span class="mdc-top-app-bar__title">Title</span>
           </section>
         </div>

diff --git a/test/screenshot/spec/mdc-top-app-bar/classes/baseline-fixed-with-action-items.html b/test/screenshot/spec/mdc-top-app-bar/classes/baseline-fixed-with-action-items.html
@@ -46,13 +46,13 @@
       <header class="mdc-top-app-bar test-top-app-bar mdc-top-app-bar--fixed">
         <div class="mdc-top-app-bar__row">
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-            <a href="#" class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</a>
+            <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button>
             <span class="mdc-top-app-bar__title">Title</span>
           </section>
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download">file_download</a>
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Print this page">print</a>
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</a>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download">file_download</button>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Print this page">print</button>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</button>
           </section>
         </div>
       </header>

diff --git a/test/screenshot/spec/mdc-top-app-bar/classes/baseline-fixed.html b/test/screenshot/spec/mdc-top-app-bar/classes/baseline-fixed.html
@@ -46,7 +46,7 @@
       <header class="mdc-top-app-bar test-top-app-bar mdc-top-app-bar--fixed">
         <div class="mdc-top-app-bar__row">
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-            <a href="#" class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</a>
+            <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button>
             <span class="mdc-top-app-bar__title">Title</span>
           </section>
         </div>

diff --git a/test/screenshot/spec/mdc-top-app-bar/classes/baseline-prominent-with-action-items.html b/test/screenshot/spec/mdc-top-app-bar/classes/baseline-prominent-with-action-items.html
@@ -46,13 +46,13 @@
       <header class="mdc-top-app-bar test-top-app-bar mdc-top-app-bar--prominent">
         <div class="mdc-top-app-bar__row">
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-            <a href="#" class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</a>
+            <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button>
             <span class="mdc-top-app-bar__title">Title</span>
           </section>
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download">file_download</a>
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Print this page">print</a>
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</a>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download">file_download</button>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Print this page">print</button>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</button>
           </section>
         </div>
       </header>

diff --git a/test/screenshot/spec/mdc-top-app-bar/classes/baseline-prominent.html b/test/screenshot/spec/mdc-top-app-bar/classes/baseline-prominent.html
@@ -46,7 +46,7 @@
       <header class="mdc-top-app-bar test-top-app-bar mdc-top-app-bar--prominent">
         <div class="mdc-top-app-bar__row">
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-            <a href="#" class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</a>
+            <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button>
             <span class="mdc-top-app-bar__title">Title</span>
           </section>
         </div>

diff --git a/test/screenshot/spec/mdc-top-app-bar/classes/baseline-short-collapsed-with-action-items.html b/test/screenshot/spec/mdc-top-app-bar/classes/baseline-short-collapsed-with-action-items.html
@@ -46,11 +46,11 @@
       <header class="mdc-top-app-bar mdc-top-app-bar--short mdc-top-app-bar--short-collapsed">
         <div class="mdc-top-app-bar__row">
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-            <a href="#" class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</a>
+            <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button>
             <span class="mdc-top-app-bar__title">Title</span>
           </section>
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</a>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</button>
           </section>
         </div>
       </header>

diff --git a/test/screenshot/spec/mdc-top-app-bar/classes/baseline-short-collapsed.html b/test/screenshot/spec/mdc-top-app-bar/classes/baseline-short-collapsed.html
@@ -46,7 +46,7 @@
       <header class="mdc-top-app-bar mdc-top-app-bar--short mdc-top-app-bar--short-collapsed">
         <div class="mdc-top-app-bar__row">
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-            <a href="#" class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</a>
+            <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button>
             <span class="mdc-top-app-bar__title">Title</span>
           </section>
         </div>

diff --git a/test/screenshot/spec/mdc-top-app-bar/classes/baseline-short-with-action-items.html b/test/screenshot/spec/mdc-top-app-bar/classes/baseline-short-with-action-items.html
@@ -46,11 +46,11 @@
       <header class="mdc-top-app-bar mdc-top-app-bar--short">
         <div class="mdc-top-app-bar__row">
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-            <a href="#" class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</a>
+            <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button>
             <span class="mdc-top-app-bar__title">Title</span>
           </section>
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</a>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</button>
           </section>
         </div>
       </header>

diff --git a/test/screenshot/spec/mdc-top-app-bar/classes/baseline-short.html b/test/screenshot/spec/mdc-top-app-bar/classes/baseline-short.html
@@ -46,7 +46,7 @@
       <header class="mdc-top-app-bar mdc-top-app-bar--short">
         <div class="mdc-top-app-bar__row">
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-            <a href="#" class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</a>
+            <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button>
             <span class="mdc-top-app-bar__title">Title</span>
           </section>
         </div>

diff --git a/test/screenshot/spec/mdc-top-app-bar/classes/baseline-with-action-items.html b/test/screenshot/spec/mdc-top-app-bar/classes/baseline-with-action-items.html
@@ -46,13 +46,13 @@
       <header class="mdc-top-app-bar test-top-app-bar">
         <div class="mdc-top-app-bar__row">
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
-            <a href="#" class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</a>
+            <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button>
             <span class="mdc-top-app-bar__title">Title</span>
           </section>
           <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download">file_download</a>
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Print this page">print</a>
-            <a href="#" class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</a>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Download">file_download</button>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Print this page">print</button>
+            <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Bookmark this page">bookmark</button>
           </section>
         </div>
       </header>