From 9c6d46bb145c086cc015083f2231d376dccd4758 Mon Sep 17 00:00:00 2001
From: Cheng Lou <chenglou92@gmail.com>
Date: Thu, 17 Oct 2013 10:36:07 -0400
Subject: [PATCH] Add clickable anchors to docs headers

Closes #434
---
 _css/react.scss          | 10 ++++++++++
 _plugins/header_links.rb |  2 +-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/_css/react.scss b/_css/react.scss
index f59ae2ff..3f457ec4 100644
--- a/_css/react.scss
+++ b/_css/react.scss
@@ -391,6 +391,16 @@ section.black content {
     font-size: 24px;
   }
 
+  h1, h2, h3, h4, h5, h6 {
+    a {
+      color: $darkTextColor;
+
+      &:hover {
+        text-decoration: underline;
+      }
+    }
+  }
+
   // H2s form documentation topic dividers. Extra space helps.
   h2 {
     margin-top: 30px;
diff --git a/_plugins/header_links.rb b/_plugins/header_links.rb
index 9f78b056..0e26af57 100644
--- a/_plugins/header_links.rb
+++ b/_plugins/header_links.rb
@@ -11,7 +11,7 @@ class Redcarpet::Render::HTML
       .gsub(/\s+/, "-")
       .gsub(/[^A-Za-z0-9\-_.]/, "")
 
-    return "<h#{level} id=\"#{clean_title}\">#{title}</h#{level}>"
+    return "<h#{level} id=\"#{clean_title}\"><a href=\"##{clean_title}\">#{title}</a></h#{level}>"
   end
 end