From 3342cad0489184b38d0e05155bb105ff7de2a9b6 Mon Sep 17 00:00:00 2001
From: Patrick Yeo <patrick.yeo@liferay.com>
Date: Fri, 24 Jan 2020 15:58:20 -0800
Subject: [PATCH] fix(clayui.com): Make Search Bar larger in small screens and
 search dropdown highlight should go full width

fix(clayui.com): Scope secondary color to .docs-description, .clay-p so Clay CSS default color isn't overwritten by site styles

fixes #2792
---
 clayui.com/src/components/LayoutNav/LayoutNav.js | 4 ++--
 clayui.com/src/styles/_docsearch.scss            | 5 +++++
 clayui.com/src/styles/_guide.scss                | 5 +++--
 3 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/clayui.com/src/components/LayoutNav/LayoutNav.js b/clayui.com/src/components/LayoutNav/LayoutNav.js
index 4f396ed56c..d2b5f39d80 100644
--- a/clayui.com/src/components/LayoutNav/LayoutNav.js
+++ b/clayui.com/src/components/LayoutNav/LayoutNav.js
@@ -11,7 +11,7 @@ import Search from './Search';
 
 export default () => (
 	<nav className="navbar navbar-clay-site navbar-expand-lg navbar-light">
-		<div className="autofit-padded autofit-row">
+		<div className="autofit-float-sm-down autofit-padded autofit-row">
 			<div className="autofit-col autofit-col-expand">
 				<Search placeholder="Search..." />
 			</div>
@@ -19,7 +19,7 @@ export default () => (
 				<ul className="ml-auto navbar-nav">
 					<li className="nav-item">
 						<Link
-							className="ml-3 nav-link"
+							className="nav-link"
 							to="/docs/get-started/what-is-clay.html"
 						>
 							{'Docs'}
diff --git a/clayui.com/src/styles/_docsearch.scss b/clayui.com/src/styles/_docsearch.scss
index 933542f9c9..c5d8351f3f 100644
--- a/clayui.com/src/styles/_docsearch.scss
+++ b/clayui.com/src/styles/_docsearch.scss
@@ -129,4 +129,9 @@
 
 .algolia-autocomplete .ds-suggestion.ds-cursor .algolia-docsearch-suggestion--content {
     background-color: rgba(179, 71, 45, 0.15) !important;
+}
+
+.algolia-docsearch-suggestion--content,
+.algolia-docsearch-suggestion--title {
+    display: block !important;
 }
\ No newline at end of file
diff --git a/clayui.com/src/styles/_guide.scss b/clayui.com/src/styles/_guide.scss
index 6271374430..584c0103d3 100644
--- a/clayui.com/src/styles/_guide.scss
+++ b/clayui.com/src/styles/_guide.scss
@@ -1,9 +1,10 @@
 .docs {
-	.clay-blog-content,
-	.clay-docs-content {
+	.docs-description,
+	.clay-p {
 		color: #6B6C7E;
 	}
 
+
 	.nav-clay {
 		.nav-item .nav-link.active:after {
 			background-color: $brand-dark;