From 0e2f716de5f2cd951e9b58d13a1d909bcb32f52e Mon Sep 17 00:00:00 2001
From: Jeremy Thomas <bbxdesign@gmail.com>
Date: Sat, 29 Jul 2017 14:59:10 +0100
Subject: [PATCH] Optimize message docs

---
 docs/_javascript/main.js                   | 25 +++++++++++++++++++++-
 docs/css/bulma-docs.css                    |  2 +-
 docs/documentation/components/message.html | 24 ++++++++++-----------
 docs/lib/main.js                           | 24 ++++++++++++++++++++-
 sass/elements/title.sass                   |  2 +-
 5 files changed, 61 insertions(+), 16 deletions(-)

diff --git a/docs/_javascript/main.js b/docs/_javascript/main.js
index a58bd3cb..c9fe455a 100644
--- a/docs/_javascript/main.js
+++ b/docs/_javascript/main.js
@@ -11,7 +11,7 @@ document.addEventListener('DOMContentLoaded', () => {
         const target = $el.getAttribute('href');
         const $target = document.getElementById(target.substring(1));
         $target.scrollIntoView(true);
-        window.history.replaceState(null, document.title, `${window.location.origin}${window.location.pathname}${target}`);
+        // window.history.replaceState(null, document.title, `${window.location.origin}${window.location.pathname}${target}`);
         return false;
       });
     });
@@ -152,4 +152,27 @@ document.addEventListener('DOMContentLoaded', () => {
     return Array.prototype.slice.call(document.querySelectorAll(selector), 0);
   }
 
+  let latestKnownScrollY = 0;
+  let ticking = false;
+
+  function scrollUpdate() {
+    ticking = false;
+    // do stuff
+  }
+
+
+  function onScroll() {
+    latestKnownScrollY = window.scrollY;
+    scrollRequestTick();
+  }
+
+  function scrollRequestTick() {
+    if(!ticking) {
+      requestAnimationFrame(scrollUpdate);
+    }
+    ticking = true;
+  }
+
+   window.addEventListener('scroll', onScroll, false);
+
 });
diff --git a/docs/css/bulma-docs.css b/docs/css/bulma-docs.css
index 12cbaf6e..bacf8958 100644
--- a/docs/css/bulma-docs.css
+++ b/docs/css/bulma-docs.css
@@ -3510,7 +3510,7 @@ a.tag:hover {
 .title {
   color: #363636;
   font-size: 2rem;
-  font-weight: 700;
+  font-weight: 600;
   line-height: 1.125;
 }
 
diff --git a/docs/documentation/components/message.html b/docs/documentation/components/message.html
index f7038094..aac9f5f9 100644
--- a/docs/documentation/components/message.html
+++ b/docs/documentation/components/message.html
@@ -210,9 +210,20 @@ variables:
       </div>
     </div>
 
+    {% include heading.html name="Colors" %}
+
+    <div class="columns">
+      <div class="column is-half">
+        {{message_colors_example}}
+      </div>
+      <div class="column is-half">
+        {% highlight html %}{{message_colors_example}}{% endhighlight %}
+      </div>
+    </div>
+
     <hr>
 
-    <h3 class="subtitle">Message body only</h3>
+    <h3 class="title">Message body only</h3>
     <div class="content">
       <p>You can <strong>omit</strong> the message header:</p>
     </div>
@@ -225,17 +236,6 @@ variables:
       </div>
     </div>
 
-    {% include heading.html name="Colors" %}
-
-    <div class="columns">
-      <div class="column is-half">
-        {{message_colors_example}}
-      </div>
-      <div class="column is-half">
-        {% highlight html %}{{message_colors_example}}{% endhighlight %}
-      </div>
-    </div>
-
     {% include heading.html name="Sizes" %}
 
     <div class="columns">
diff --git a/docs/lib/main.js b/docs/lib/main.js
index 482e2cf0..99a89737 100644
--- a/docs/lib/main.js
+++ b/docs/lib/main.js
@@ -13,7 +13,7 @@ document.addEventListener('DOMContentLoaded', function () {
         var target = $el.getAttribute('href');
         var $target = document.getElementById(target.substring(1));
         $target.scrollIntoView(true);
-        window.history.replaceState(null, document.title, '' + window.location.origin + window.location.pathname + target);
+        // window.history.replaceState(null, document.title, `${window.location.origin}${window.location.pathname}${target}`);
         return false;
       });
     });
@@ -153,4 +153,26 @@ document.addEventListener('DOMContentLoaded', function () {
   function getAll(selector) {
     return Array.prototype.slice.call(document.querySelectorAll(selector), 0);
   }
+
+  var latestKnownScrollY = 0;
+  var ticking = false;
+
+  function scrollUpdate() {
+    ticking = false;
+    // do stuff
+  }
+
+  function onScroll() {
+    latestKnownScrollY = window.scrollY;
+    scrollRequestTick();
+  }
+
+  function scrollRequestTick() {
+    if (!ticking) {
+      requestAnimationFrame(scrollUpdate);
+    }
+    ticking = true;
+  }
+
+  window.addEventListener('scroll', onScroll, false);
 });
\ No newline at end of file
diff --git a/sass/elements/title.sass b/sass/elements/title.sass
index b604e808..f9a50c5f 100755
--- a/sass/elements/title.sass
+++ b/sass/elements/title.sass
@@ -1,6 +1,6 @@
 $title-color: $grey-darker !default
 $title-size: $size-3 !default
-$title-weight: $weight-bold !default
+$title-weight: $weight-semibold !default
 $title-strong-color: inherit !default
 $title-strong-weight: inherit !default