Updates the nav structure and adds entry page

craft/config/general.php

@@ -14,11 +14,11 @@
   ),
 
   '.dev' => array(
-    'siteUrl' => 'playbook.octopus.dev',
+    'siteUrl' => 'http://playbook.octopus.dev',
   ),
 
   '.us' => array(
-    'siteUrl' => 'playbook.octop.us',
+    'siteUrl' => 'http://playbook.octop.us',
   ),
 
 );

craft/templates/_layouts/default.html

@@ -29,10 +29,10 @@
       <div class="container py-1 px-1">
         {% nav category in craft.categories.group('topics').level(1) %}
           {% if category.descendants.first %}
-            {% if craft.request.url != category.descendants.first.url %}
-              <a href="{{ category.descendants.first.url }}" class="d-inline-block px-1 py-2 cg-4">{{ category.title }}</a>
+            {% if craft.request.firstSegment != category.slug %}
+              <a href="{{ category.descendants.first.url }}" class="tw-book d-inline-block px-1 py-2 cg-4">{{ category.title }}</a>
             {% else %}
-              <a href="{{ category.descendants.first.url }}" class="d-inline-block px-1 py-2 c-white">{{ category.title }}</a>
+              <a href="{{ category.descendants.first.url }}" class="tw-book d-inline-block px-1 py-2 c-white">{{ category.title }}</a>
             {% endif %}
           {% endif %}
         {% endnav %}
@@ -41,6 +41,22 @@
 
   </header>
 
+  {% if craft.request.firstSegment %}
+    <nav class="mb-5 cbgg-7">
+      <div class="container px-1">
+        {% set linkClasses = 'px-1 py-2' %}
+        {% nav child in craft.categories.slug(craft.request.firstSegment)[0].children %}
+          {% if craft.request.url != child.url %}
+            <a href="{{ child.url }}" class="cg-3 {{ linkClasses }}">{{ child.title }}</a>
+          {% else %}
+            <a class="c-black {{ linkClasses }}">{{ child.title }}</a>
+          {% endif %}
+        {% endnav %}
+      </div>
+    </nav>
+  {% endif %}
+
+
   <main>
 
     {% block content %}

craft/templates/topics/_entry.html

@@ -0,0 +1,16 @@
+{% extends "_layouts/default" %}
+
+{% block content %}
+
+  {% if craft.request.urlReferrer %}
+    <nav class="container mt-5 px-2">
+      <a href="{{ craft.request.urlReferrer }}">Back</a>
+    </nav>
+  {% endif %}
+
+  <section class="container py-4 px-2">
+    <h1 class="t-2 c-black t-md-3 mb-1">{{ entry.title }}</h1>
+
+    {{ entry.body }}
+  </section>
+{% endblock %}

craft/templates/topics/index.html

@@ -4,19 +4,6 @@
 
 {% block content %}
 
-  <nav class="mb-5 cbgg-7">
-    <div class="container px-1">
-      {% set linkClasses = 'px-1 py-2' %}
-      {% nav child in category.parent.children %}    
-        {% if craft.request.url != child.url %}
-          <a href="{{ child.url }}" class="cg-3 {{ linkClasses }}">{{ child.title }}</a>
-        {% else %}
-          <a class="c-black {{ linkClasses }}">{{ child.title }}</a>
-        {% endif %}
-      {% endnav %}
-    </div>
-  </nav>
-
   <nav class="container mb-4 px-2">
     <div class="d-inline-block bb-6 pr-4">
       {% set typeLinkClasses = 'd-inline-block px-1 py-1' %}

source/scss/_settings.scss

@@ -32,21 +32,20 @@ $debug-color-primary: rgba(255, 9, 206, 0.5);
 // Font weights.
 $tw-light: 200; 
 $tw-book: 300;
-$tw-medium: 500;
+$tw-medium: 400;
 $tw-semibold: 700;
 $tw-bold: 700;
 
 // Defaults.
-// 
 
 $default-brand-height: 1.5rem;
-
 $spacing-increments: 0.6 1.2 2.6 4.2 6.8 11 18 29 46 75;
 
 
 // Tyopgraphy.
 $default-type-family: 'Gotham Narrow SSm', 'Proxima Nova', 'Helvetica', sans-serif;
 $default-type-color: #313233;
+$default-type-weight: $tw-book;
 $default-line-height: 1.625;
 $display-type-family: 'Gotham', 'Proxima Nova', 'Helvetica', sans-serif;
 

source/scss/global/_base.scss

@@ -1,5 +1,6 @@
 * {
   box-sizing: border-box;
+  @extend .tw-book;
 }
 
 h1,
@@ -8,5 +9,12 @@ h3,
 h4,
 p,
 nav a {
+  @extend .tw-book;
+}
+
+
+// Use font-smoothing when we have light type on 
+// a dark background.
+.cbg-black {
   @extend .antialiased;
 }

source/scss/init.scss

@@ -13,4 +13,5 @@
 @import '../../node_modules/decent-scss/modules/table';
 @import '../../node_modules/decent-scss/modules/interaction';
 
-@import 'global/base';
+@import 'global/base';
+@import 'global/font';