Update to support octicon and change header anchor styles

1 files changed, 23 insertions, 14 deletions

diff --git a/public/css/github-extract.css b/public/css/github-extract.css
index 04c47938..3caf247f 100644
--- a/public/css/github-extract.css
+++ b/public/css/github-extract.css
@@ -14,38 +14,29 @@
     color: #c00;
 }
 .markdown-body .anchor {
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    display: block;
-    padding-right: 6px;
-    padding-left: 30px;
-    margin-left: -30px;
+    display: inline-block;
+    padding-right: 2px;
+    margin-left: -18.36px;
 }
 .markdown-body .anchor:focus {
     outline: none;
 }
 .markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .markdown-body h5, .markdown-body h6 {
-    position: relative;
     margin-top: 1em;
     margin-bottom: 16px;
     font-weight: bold;
     line-height: 1.4;
 }
 .markdown-body h1 .octicon-link, .markdown-body h2 .octicon-link, .markdown-body h3 .octicon-link, .markdown-body h4 .octicon-link, .markdown-body h5 .octicon-link, .markdown-body h6 .octicon-link {
-    display: none;
     color: #000;
     vertical-align: middle;
+    visibility: hidden;
 }
 .markdown-body h1:hover .anchor, .markdown-body h2:hover .anchor, .markdown-body h3:hover .anchor, .markdown-body h4:hover .anchor, .markdown-body h5:hover .anchor, .markdown-body h6:hover .anchor {
-    padding-left: 8px;
-    margin-left: -30px;
-    line-height: 1;
     text-decoration: none;
 }
 .markdown-body h1:hover .anchor .octicon-link, .markdown-body h2:hover .anchor .octicon-link, .markdown-body h3:hover .anchor .octicon-link, .markdown-body h4:hover .anchor .octicon-link, .markdown-body h5:hover .anchor .octicon-link, .markdown-body h6:hover .anchor .octicon-link {
-    display: inline-block;
+    visibility: visible;
 }
 .markdown-body h1 tt, .markdown-body h1 code, .markdown-body h2 tt, .markdown-body h2 code, .markdown-body h3 tt, .markdown-body h3 code, .markdown-body h4 tt, .markdown-body h4 code, .markdown-body h5 tt, .markdown-body h5 code, .markdown-body h6 tt, .markdown-body h6 code {
     font-size: inherit;
@@ -56,26 +47,44 @@
     line-height: 1.2;
     border-bottom: 1px solid #eee;
 }
+.markdown-body h1 .anchor {
+    line-height: 1;
+}
 .markdown-body h2 {
     padding-bottom: 0.3em;
     font-size: 1.75em;
     line-height: 1.225;
     border-bottom: 1px solid #eee;
 }
+.markdown-body h2 .anchor {
+    line-height: 1;
+}
 .markdown-body h3 {
     font-size: 1.5em;
     line-height: 1.43;
 }
+.markdown-body h3 .anchor {
+    line-height: 1.2;
+}
 .markdown-body h4 {
     font-size: 1.25em;
 }
+.markdown-body h4 .anchor {
+    line-height: 1.2;
+}
 .markdown-body h5 {
     font-size: 1em;
 }
+.markdown-body h5 .anchor {
+    line-height: 1.1;
+}
 .markdown-body h6 {
     font-size: 1em;
     color: #777;
 }
+.markdown-body h6 .anchor {
+    line-height: 1.1;
+}
 .markdown-body p, .markdown-body blockquote, .markdown-body ul, .markdown-body ol, .markdown-body dl, .markdown-body table, .markdown-body pre {
     margin-top: 0;
     margin-bottom: 16px;