From d02ce2b603d781b082dc574f418c3cb8ca1fefce Mon Sep 17 00:00:00 2001
From: Stanislas Bernard <bernardstanislas@gmail.com>
Date: Mon, 15 Jun 2015 16:08:25 +0200
Subject: [PATCH] [sticky-navigation] Remove bootstrap behaviour, make our own
 for affix

---
 common/sticky-navigation/index.js                     | 9 ++++++---
 common/sticky-navigation/style/sticky-navigation.scss | 6 +++++-
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/common/sticky-navigation/index.js b/common/sticky-navigation/index.js
index ea1678cd5..f8568b321 100644
--- a/common/sticky-navigation/index.js
+++ b/common/sticky-navigation/index.js
@@ -26,7 +26,8 @@ let StickyNavigation = {
         return ({
             titleSelector: '[data-menu]',
             scrolledElementSelector: 'body',
-            hasBackToTop: true
+            hasBackToTop: true,
+            affixMargin: 80
         });
     },
     /**
@@ -37,7 +38,8 @@ let StickyNavigation = {
         scrolledElementSelector: type('string'),
         triggerHeight: type('number'),
         style: type('object'),
-        hasBackToTop: type('bool')
+        hasBackToTop: type('bool'),
+        affixMargin: type('number')
     },
     /**
      * Component did mount, attach the scroll spy
@@ -96,6 +98,7 @@ let StickyNavigation = {
      */
     _scrollSpy() {
         let scrollPosition = document.querySelector(this.props.scrolledElementSelector).scrollTop;
+        this.setState({affixNav: this.props.affixMargin < scrollPosition});
         if (this.state && this.state.titleList) {
             this.state.titleList.forEach((title) => {
                 if (title.offsetTop <= scrollPosition && title.offsetTop + title.offsetHeight > scrollPosition) {
@@ -140,7 +143,7 @@ let StickyNavigation = {
      */
     render() {
         return (
-            <nav data-focus='sticky-navigation' className={this._getStyleClassName()} data-spy="affix" data-offset-top="0" data-offset-bottom="0">
+            <nav data-focus='sticky-navigation' className={this._getStyleClassName()} data-affix={this.state && this.state.affixNav ? 'true' : 'false'} ref='nav'>
                 {this._renderList()}
             </nav>
         )
diff --git a/common/sticky-navigation/style/sticky-navigation.scss b/common/sticky-navigation/style/sticky-navigation.scss
index ba6c29734..fe52d96fe 100644
--- a/common/sticky-navigation/style/sticky-navigation.scss
+++ b/common/sticky-navigation/style/sticky-navigation.scss
@@ -7,9 +7,13 @@ $sticky-nav-active-color:#36b7b9;
   float: left;
   font-size: 13pt;
 
-  &.affix {
+  &[data-affix='true'] {
+    position: fixed;
     top: 80px;
   }
+  &[data-affix='false'] {
+
+  }
 
   div {
     padding: 5px 10px;