fix conflict

3 files changed, 71 insertions, 5 deletions

diff --git a/content/assets/javascripts/docs.js b/content/assets/javascripts/docs.js
index dad14481..ae70aad0 100644
--- a/content/assets/javascripts/docs.js
+++ b/content/assets/javascripts/docs.js
@@ -26,6 +26,11 @@ function toggleNavigation() {
         // if there is a nested ul after the first anchor
         if(nav[0].children[0].children.length > 1) {
           var menu = nav[0].children[0].children[1];
+          var footnotes = menu.querySelector('.footnotes');
+
+          if (footnotes) {
+            footnotes.remove();
+          }
 
           // grab the h1's li anchor text
           var title = document.createElement('h4');
@@ -39,6 +44,8 @@ function toggleNavigation() {
           var sidebarHeight = sidebar.querySelector('ul').getBoundingClientRect().height + 55;
 
           document.addEventListener('scroll', function() {
+            if (window.innerWidth < 1099) return;
+
             if (window.scrollY + sidebarHeight >= main[0].offsetHeight) {
               sidebar.style.position = 'absolute';
               sidebar.style.top = (main[0].offsetHeight - sidebarHeight) + 'px';
@@ -46,7 +53,7 @@ function toggleNavigation() {
               sidebar.style.position = '';
               sidebar.style.top = '';
             }
-          });
+          }, { passive : true });
         }
 
         // remove what is left of the old navigation
diff --git a/content/assets/stylesheets/comments.scss b/content/assets/stylesheets/comments.scss
new file mode 100644
index 00000000..aa2e868a
--- /dev/null
+++ b/content/assets/stylesheets/comments.scss
@@ -0,0 +1,13 @@
+---
+version: 1
+---
+
+@import "variables";
+
+.comments {
+  margin-top: 15px;
+  padding-top: 10px;
+  border-top-style: solid;
+  border-top-color: $border-color;
+  border-top-width: 1px;
+}
diff --git a/content/assets/stylesheets/stylesheet.scss b/content/assets/stylesheets/stylesheet.scss
index 06d5635f..ac52ff3a 100644
--- a/content/assets/stylesheets/stylesheet.scss
+++ b/content/assets/stylesheets/stylesheet.scss
@@ -1,6 +1,7 @@
 ---
-version: 20
+version: 23
 ---
+
 @import "variables";
 
 *, *::before, *::after {
@@ -50,6 +51,7 @@ table {
     text-align: left;
     padding: 7px 10px;
     border: 1px solid $table-border-color;
+    font-size: $body-font-size;
   }
 
   @media all and (max-width: $mobile-width) {
@@ -77,6 +79,12 @@ blockquote {
 
 pre {
   background-color: $pre-background-color;
+
+  code {
+    word-wrap: normal;
+    word-break: normal;
+    white-space: pre;
+  }
 }
 
 hr {
@@ -91,7 +99,6 @@ code, code span {
 p code, li code, table code {
   color: $code-color;
   background-color: $code-background-color;
-  padding: 2px 4px;
 }
 
 a > code {
@@ -161,6 +168,10 @@ h6 {
   box-shadow: 0 3px 3px $main-box-shadow;
   background: $main-background-color;
 
+  @media (max-width: $mobile-width) {
+    padding: 20px 10px;
+  }
+
   a {
     text-decoration: none;
   }
@@ -322,7 +333,7 @@ h6 {
     background-color: $white;
     -webkit-appearance: none;
     padding: 7px 11px 7px 28px;
-    margin: -5px;
+    margin: -20;
     width: 190px;
     background-image: url("<%= @items['/assets/images/icon_search.svg'].path %>");
     background-repeat: no-repeat;
@@ -532,7 +543,7 @@ h6 {
 }
 
 // https://gitlab.com/gitlab-com/gitlab-docs/issues/107#note_36655246
-*[id]::before {
+*[id]:not(sup)::before {
   display: block;
   content: " ";
   margin-top: -75px;
@@ -544,3 +555,38 @@ h6 {
   color: $article-metadata;
   display: block;
 }
+
+// Override bootstrap's alert color
+.alert {
+  color: inherit;
+}
+
+//
+// Algolia search for mobile
+// https://github.com/algolia/docsearch/issues/181#issuecomment-301730219
+//
+// Since some values are added by Javascript, we have to add the
+// !important option to override these values.
+// scss-lint:disable ImportantRule
+.algolia-autocomplete {
+  // On a max-width of 768px
+  @media (max-width: 768px) {
+    .ds-dropdown-menu {
+      max-width: calc(100vw - 32px) !important;
+      min-width: calc(100vw - 32px) !important;
+      width: calc(100vw - 32px) !important;
+      margin-left: 16px !important;
+    }
+    .algolia-docsearch-suggestion--content {
+      width: 100% !important;
+      padding-left: 0 !important;
+    }
+    .algolia-docsearch-suggestion--content::before {
+      display: none !important;
+    }
+    .algolia-docsearch-suggestion--subcategory-column {
+      display: none !important;
+    }
+  }
+}
+// scss-lint:enable ImportantRule