Adjust document outline to use an a tag vs button

WordPress · Oct 19, 2018 · b743cec · b743cec
1 parent ce02ee2
commit b743cec
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/packages/editor/src/components/document-outline/item.js b/packages/editor/src/components/document-outline/item.js
@@ -29,7 +29,8 @@ const TableOfContentsItem = ( {
 			}
 		) }
 	>
-		<button
+		<a
+			href={ '#' + level }
 			className="document-outline__button"
 			onClick={ onClick }
 		>
@@ -50,7 +51,7 @@ const TableOfContentsItem = ( {
 				{ children }
 			</span>
 			<span className="screen-reader-text">{ __( '(Click to focus this heading)' ) }</span>
-		</button>
+		</a>
 	</li>
 );
 

diff --git a/packages/editor/src/components/document-outline/style.scss b/packages/editor/src/components/document-outline/style.scss
@@ -11,6 +11,10 @@
 	display: flex;
 	margin: 4px 0;
 
+	a {
+		text-decoration: none;
+	}
+
 	.document-outline__emdash::before {
 		color: $light-gray-500;
 		margin-right: 4px;