fixes

_src/_assets/javascripts/page-getstarted.js

@@ -14,30 +14,34 @@ jQuery(function($) {
 })
 
 
-//
-// Sticky nav
-//
-const menu = document.getElementsByClassName('menu--sub')[0]
-
-if ( window.innerWidth >= 768 ) {
-    const offset = menu.offsetTop
-
-    window.addEventListener('scroll', function() {
-        if (offset < window.pageYOffset) {
-            menu.classList.add('sticky')
-        } else {
-            menu.classList.remove('sticky')
-        }
-    }, false)
-}
-
-
 //
 // Scrollspy
 //
 gumshoe.init()
 
 
+//
+// Sticky nav
+//
+function stickyNav() {
+    const menu = document.getElementsByClassName('menu--sub')[0]
+
+    if ( window.innerWidth >= 768 ) {
+        const offset = menu.offsetTop
+
+        window.addEventListener('scroll', function() {
+            if (offset < window.pageYOffset) {
+                menu.classList.add('sticky')
+            } else {
+                menu.classList.remove('sticky')
+            }
+        }, false)
+    }
+}
+
+stickyNav()
+
+
 //
 // BigchainDB transaction tool
 //

_src/_assets/styles/_page-getstarted.scss

@@ -10,12 +10,16 @@
     .section-title {
         font-size: $font-size-h3;
         text-align: left;
-        margin-top: $spacer * 3;
-        margin-bottom: $spacer * 3;
+        margin-top: $spacer * 2;
+        margin-bottom: $spacer * 2;
 
         &:after {
             display: none;
         }
+
+        + .grid {
+            margin-bottom: 0;
+        }
     }
 }
 
@@ -52,6 +56,7 @@
         font-style: italic;
         border: 1px solid $gray-dark;
         background: none;
+        overflow-x: hidden;
     }
 }
 
@@ -73,11 +78,6 @@
 
 .code-example {
     @include transition;
-    opacity: .5;
-
-    &:hover {
-        opacity: 1;
-    }
 
     .nav-link,
     pre {
@@ -86,6 +86,7 @@
 
     .nav-tabs {
         border-bottom-color: $gray-light;
+        opacity: .6;
     }
 
     .nav-link {
@@ -105,14 +106,11 @@
 
     pre {
         background: none;
-        padding: $spacer * 1.5 0;
+        padding: $spacer * 1.5 0 0;
+        margin-bottom: 0;
     }
 }
 
-.code-example__message {
-    font-weight: $font-weight-bold;
-}
-
 .section-title--numbered {
     span {
         text-align: center;
@@ -231,14 +229,9 @@
 .starbase--intro {
     min-height: 10rem;
     margin-top: -($spacer * 8);
-    margin-bottom: 2%;
-
-    @media ($screen-sm) {
-        margin-bottom: 4%;
-    }
 
     .starbase__image {
-        margin-top: -($spacer * 8);
+        margin-top: -($spacer * 12);
 
         // surface layer
         &:before {

_src/_assets/styles/bigchain/_variables.scss

@@ -216,7 +216,7 @@ $state-success-text:             #fff !default;
 $state-success-bg:               rgba($brand-primary, .4) !default;
 
 $state-info-text:                #fff !default;
-$state-info-bg:                  rgba($brand-main-violet, .4) !default;
+$state-info-bg:                  rgba($brand-main-blue-light, .2) !default;
 
 $state-warning-text:             #fff !default;
 $state-warning-bg:               rgba($brand-warning, .4) !default;

_src/getstarted.html

@@ -155,13 +155,13 @@ conn.postTransaction(txSigned)
     </div>
 </nav>
 
-<section class="section section--architecture">
+<!-- <section class="section section--architecture">
     <div class="row row--wide">
         <figure class="architecture">
             <img class="img--responsive" src="/assets/img/architecture.svg" alt="BigchainDB Overview">
         </figure>
     </div>
-</section>
+</section> -->
 
 <section class="section section--server background--darker" id="server">
     <div class="row row--wide">