fix(web): SearchBoxWithAutosuggestions example

Author: mohdashraf010897

packages/web/examples/SearchBoxWithAutosuggestions/src/index.css

@@ -15,11 +15,11 @@ body {
 .col {
 	flex: 1;
 	padding: 15px;
+	max-width: 100%;
 }
 
 .row > .col:first-child {
 	border-right: 1px solid #ccc;
-	max-width: 400px;
 }
 
 .row > .col:last-child {
@@ -70,11 +70,6 @@ body {
 .authors-list {
 	color: #9d9d9d;
 	font-weight: bold;
-	overflow: hidden;
-	text-overflow: ellipsis;
-	display: -webkit-box;
-	-webkit-line-clamp: 2;
-	-webkit-box-orient: vertical;
 }
 
 .ratings-list {
@@ -151,3 +146,12 @@ body {
 .col .meetup-list-image {
 	background-size: cover;
 }
+.authors-list {
+	color: #9d9d9d;
+	font-weight: bold;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	display: -webkit-box;
+	-webkit-line-clamp: 2;
+	-webkit-box-orient: vertical;
+}

packages/web/examples/SearchBoxWithAutosuggestions/src/index.js

@@ -15,6 +15,7 @@ const Main = () => (
 	>
 		<div className="row">
 			<div className="col">
+				{' '}
 				<SearchBox
 					title="SearchBox"
 					dataField={['original_title', 'original_title.search']}
@@ -37,15 +38,13 @@ const Main = () => (
 					enableRecentSuggestions
 					recentSuggestionsConfig={{
 						size: 5,
-						minHits: 5,
+						minHits: 2,
 						minChars: 3,
 						index: 'movies-demo-app', // further restrict the index to search on
 						sectionLabel: '<b>Recent suggestions 🙌🏻</b>',
 					}}
 				/>
-			</div>
-
-			<div className="col">
+				<br />
 				<ReactiveList
 					componentId="SearchResult"
 					dataField="original_title"