fix(web): SearchBoxWithKeyboardShortcuts example

Author: mohdashraf010897

packages/web/examples/SearchBoxWithKeyboardShortcuts/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/SearchBoxWithKeyboardShortcuts/src/index.js

@@ -12,14 +12,12 @@ const Main = () => (
 		<div className="row">
 			<div className="col">
 				<SearchBox
-					title="SearchBox"
+					title="SearchBox with keyboard shortcuts"
 					dataField={['original_title', 'original_title.search']}
 					componentId="MoviesSensor"
-					focusShortcuts={['SHIFT+Y']}
+					focusShortcuts={['CMD + K']}
 				/>
-			</div>
-
-			<div className="col">
+				<br />
 				<ReactiveList
 					componentId="SearchResult"
 					dataField="original_title"