From 3d86eaecbc0214513804ab38d6c65c1e07a3b097 Mon Sep 17 00:00:00 2001
From: Stuart Taylor <staylor1012@gmail.com>
Date: Wed, 20 Dec 2017 16:48:17 +0000
Subject: [PATCH] fix(style): Update search bar and apply styles (#16218)

* fix(style): Update search bar and apply styles

* chore(pkg): Bump react-freecodecamp-search version so there is no autocomplete
---
 common/app/Nav/Nav.jsx  |  5 ++++-
 common/app/Nav/nav.less | 16 ++++++++++++++++
 package-lock.json       |  6 +++---
 package.json            |  2 +-
 4 files changed, 24 insertions(+), 5 deletions(-)

diff --git a/common/app/Nav/Nav.jsx b/common/app/Nav/Nav.jsx
index d82e3e7059..936eeccbcb 100644
--- a/common/app/Nav/Nav.jsx
+++ b/common/app/Nav/Nav.jsx
@@ -204,7 +204,10 @@ export class FCCNav extends React.Component {
               />
             </a>
           </NavbarBrand>
-          <FCCSearchBar dropdown={ true } />
+          <FCCSearchBar
+            dropdown={ true }
+            placeholder='&#xf002; What would you like to know?'
+          />
         </Navbar.Header>
         <Navbar.Collapse>
           <Nav
diff --git a/common/app/Nav/nav.less b/common/app/Nav/nav.less
index 1637236c91..63710194a7 100644
--- a/common/app/Nav/nav.less
+++ b/common/app/Nav/nav.less
@@ -208,6 +208,22 @@ li.nav-avatar {
     flex-grow: 1
   }
 
+  ::-webkit-input-placeholder {
+    color: @brand-primary;
+  }
+
+  ::-moz-placeholder {
+    color: @brand-primary;
+  }
+
+  ::-ms-placeholder {
+    color: @brand-primary;
+  }
+
+  ::placeholder {
+    color: @brand-primary;
+  }
+
   .navbar-header {
     flex-grow: 1;
     display: flex;
diff --git a/package-lock.json b/package-lock.json
index 269a22ef81..0efd404d0e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13383,9 +13383,9 @@
       }
     },
     "react-freecodecamp-search": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/react-freecodecamp-search/-/react-freecodecamp-search-1.3.1.tgz",
-      "integrity": "sha512-hwQVx9J2DR2h9ow5E0ACHdYmGc/XloPXVz8hcDPOadF+Cu0GGazpIfpDwA+mVwzANCVR9zBg7TswPP0cbENlBA==",
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/react-freecodecamp-search/-/react-freecodecamp-search-1.4.1.tgz",
+      "integrity": "sha512-ftzu4mx4UEVK/lPlkcq4gMsbAcohkkVSYzK0yRVI386MFreuO0b8iZ5aCpHJY+wXZp+U/VBtQiR5pBCNOwzfNA==",
       "requires": {
         "rxjs": "5.5.5",
         "xhr": "2.4.1"
diff --git a/package.json b/package.json
index bcddac7dd8..b54207848a 100644
--- a/package.json
+++ b/package.json
@@ -113,7 +113,7 @@
     "react-codemirror": "^0.3.0",
     "react-dom": "^15.6.2",
     "react-fontawesome": "^1.2.0",
-    "react-freecodecamp-search": "^1.3.1",
+    "react-freecodecamp-search": "^1.4.1",
     "react-images": "^0.5.1",
     "react-motion": "~0.4.2",
     "react-no-ssr": "^1.0.1",