fix(aio): improve positioning of heading-anchors

aio/src/styles/2-modules/_heading-anchors.scss

@@ -1,42 +1,43 @@
-h1, h2, h3, h4, h5, h6 {
-  .icon-link {
-    color: $darkgray;
-    vertical-align: middle;
-    visibility: hidden;
-    margin: 8px;
+.sidenav-content {
+  h1, h2, h3, h4, h5, h6 {
 
-    font: normal normal 24px 'Material Icons';
-    display: inline-block;
-    line-height: 1;
-    text-transform: none;
-    letter-spacing: normal;
-    word-wrap: normal;
-    white-space: nowrap;
-    direction: ltr;
+    .mat-icon, .material-icons {
+      visibility: hidden;
+      display: inline-block;
+      color: $mediumgray;
+      margin: 0 8px;
+    }
 
-    /* Support for all WebKit browsers. */
-    -webkit-font-smoothing: antialiased;
-    /* Support for Safari and Chrome. */
-    text-rendering: optimizeLegibility;
+    &:hover {
+      .mat-icon, .material-icons {
+        visibility: visible;
+      }
+    }
 
-    /* Support for Firefox. */
-    -moz-osx-font-smoothing: grayscale;
-
-    /* Support for IE. */
-    font-feature-settings: 'liga';
-
-    &:before { content: 'link'; }
+    a {
+      text-decoration: none;
+      padding-left: 8px;
+      margin-left: -50px;
+      display: inline-block;
+      vertical-align: middle;
+    }
   }
 
-  a {
-    text-decoration: none;
-    padding-left: 8px;
-    margin-left: -50px;
-    display: inline-block;
-    vertical-align: middle;
+  .l-sub-section {
+    h1, h2, h3, h4, h5, h6 {
+      a {
+        padding-right: 24px;
+        margin-left: -74px;
+      }
+    }
   }
 
-  &:hover .icon-link {
-    visibility: visible
+  .alert {
+    h1, h2, h3, h4, h5, h6 {
+      a {
+        padding-right: 40px;
+        margin-left: -90px;
+      }
+    }
   }
 }