From cae1bc9f0a17a8867eb477ab77b11a2313dbe195 Mon Sep 17 00:00:00 2001
From: Trevor Buckner <calculuschild@gmail.com>
Date: Mon, 5 Sep 2022 23:31:23 -0400
Subject: [PATCH] Put tags in individual spans

---
 .../pages/basePages/listPage/brewItem/brewItem.jsx        | 3 ++-
 .../pages/basePages/listPage/brewItem/brewItem.less       | 8 ++++++++
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx
index fc69466f1..923ebef45 100644
--- a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx
+++ b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx
@@ -106,7 +106,8 @@ const BrewItem = createClass({
 			<div className='info'>
 				{brew.tags ? <>
 					<span className='brewTags' title={`Tags:\n${brew.tags.join('\n')}`}>
-						<i className='fas fa-tags'/> {brew.tags.join(', ')}
+						<i className='fas fa-tags'/>
+						{brew.tags.map((tag, idx)=>{return <><span>{tag}</span>{'\n'}</>;})}
 					</span>
 					<br />
 				</> : <></>
diff --git a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.less b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.less
index 762a0b8d5..d81ec3852 100644
--- a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.less
+++ b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.less
@@ -36,6 +36,14 @@
 			line-height  : 1.5em;
 		}
 	}
+	.brewTags span {
+		background-color: #c8ac6e3b;
+		margin-left: 2px;
+		border-radius: 0.5em;
+		padding: 1px 4px;
+		border: 1px solid #c8ac6e;
+		white-space: nowrap;
+	}
 	&:hover{
 		.links{
 			opacity : 1;