Added a new basic section for styleguide

styleguide/_template.html

@@ -9,18 +9,6 @@
 <script>
     var j = jQuery.noConflict(true);
     j(function() {
-
-        // Show current section
-        var hash = window.location.hash.replace(/#/g, '');
-        if (hash) {
-          setTimeout(function() {
-            showSection(hash.split('-')[0]);
-          }, 0);
-        }
-
-        // Show section in Styleguide
-        j('#styleguide .section[data-section="' + j('#styleguide-menu a').first().data('section') + '"]').show();
-
       // Click on link with subheadings
       j('#styleguide-menu .submenulink').click(function(event) {
         var jqCurSubmenu = j('[data-submenu="' + j(this).data('section') + '"]');
@@ -46,11 +34,24 @@
         var jqCurSections = j('#styleguide .section[data-section="' + section + '"]');
         jqCurSections.show();
       }
+
+      // Show current section
+      var currentElement = window.location.hash.replace(/#/g, '');
+      if (currentElement) {
+        var section = currentElement.split('-')[0];
+        j('.submenulink[data-section="' + section + '"]').click();
+      } else {
+        // Show section in Styleguide
+        j('#styleguide .section[data-section="' + j('#styleguide-menu a').first().data('section') + '"]').show();
+      }
     });
 </script>
 
 <div id="styleguide-menu">
 	<ul>
+    <li>
+      <a class="submenulink" href="#Basics" data-section="Basics">Basics</a>
+    </li>
 	{{#each menu}}
 		<li>
 			{{#if headings.0.name}}
@@ -70,6 +71,21 @@
 </div>
 
 <div id="styleguide">
+  <div class="section" id="Basics" data-section="Basics" data-heading="Basics">
+    <div class="comment">
+      <h1>Basics</h1>
+      <p>Important notes about this styleguide</p>
+    </div>
+    <div class="result">
+      <ul>
+        <li>All new elements added in this repository should have included a 'CDB-' namespace.</li>
+      </ul>
+    </div>
+    <div class="markup">
+
+    </div>
+  </div>
+
 	{{#each sections}}
 		<div class="section" id="{{id}}" data-section="{{section}}" data-heading="{{heading}}">