Add Search Docs input

2 files changed, 9 insertions, 3 deletions

diff --git a/docs/src/_layout/_docs-layout.pug b/docs/src/_layout/_docs-layout.pug
index 3393cfc..54bd626 100644
--- a/docs/src/_layout/_docs-layout.pug
+++ b/docs/src/_layout/_docs-layout.pug
@@ -8,8 +8,8 @@ block content
         i.icon.icon-menu
       .btns
         a.btn.btn-primary.float-right(href='https://github.com/picturepan2/spectre' target='_blank') GitHub
-        a.btn.mr-1.float-right(href='https://www.paypal.me/picturepan2' target='_blank') Sponsor
-        
+        a.btn.mr-1.float-right(href='https://www.paypal.me/picturepan2' target='_blank') PayPal
+
     #sidebar.docs-sidebar.off-canvas-sidebar
       .docs-brand
         if slug != parent
@@ -21,6 +21,7 @@ block content
             img(src='img/spectre-logo.svg' alt='Spectre.css CSS Framework')
             h2 SPECTRE
       .docs-nav
+        input.d-hide.form-input.input-sm(type="text" placeholder="Search Docs")
         .accordion-container
           +docs-accordion(
             'getting-started',
diff --git a/docs/src/scss/docs.scss b/docs/src/scss/docs.scss
index fe1710f..a2c0564 100644
--- a/docs/src/scss/docs.scss
+++ b/docs/src/scss/docs.scss
@@ -39,7 +39,7 @@
     position: absolute;
     right: 1.5rem;
     top: 1rem;
-    width: 8rem;
+    width: 20rem;
   }
 }
 
@@ -54,6 +54,10 @@
     -webkit-overflow-scrolling: touch;
   }
 
+  .form-input {
+    margin-bottom: 1rem;
+  }
+
   .accordion {
     margin-bottom: .75rem;
 
@@ -286,6 +290,7 @@
 
 .docs-brand {
   color: $primary-color;
+  height: 2rem;
   left: 1.5rem;
   position: fixed;
   top: .85rem;