Add a line on UI to make search results obvious

webclient/src/Results.js

@@ -60,27 +60,30 @@ class Results extends React.Component {
 				</Helmet>
 				{error && <p>Connection error?</p>}
 				{stories ?
-					<div>
+					<>
-						{stories.length ?
+						<p>Search results:</p>
-							stories.map((x, i) =>
+						<div className='comment lined'>
-								<div className='item' key={i}>
+							{stories.length ?
-									<div className='title'>
+								stories.map((x, i) =>
-										<Link className='link' to={'/' + x.id}>
+									<div className='item' key={i}>
-											<img className='source-logo' src={logos[x.source]} alt='source logo' /> {x.title}
+										<div className='title'>
-										</Link>
+											<Link className='link' to={'/' + x.id}>
+												<img className='source-logo' src={logos[x.source]} alt='source logo' /> {x.title}
+											</Link>
 
-										<span className='source'>
+											<span className='source'>
-											&#8203;({sourceLink(x)})
+												&#8203;({sourceLink(x)})
-										</span>
+											</span>
+										</div>
+
+										{infoLine(x)}
 									</div>
-
+								)
-									{infoLine(x)}
+							:
-								</div>
+								<p>none</p>
-							)
+							}
-						:
+						</div>
-							<p>no results</p>
+					</>
-						}
-					</div>
 				:
 					<p>loading...</p>
 				}