diff --git a/src/theme.scss b/src/theme.scss index e9b61025b..daae4fb08 100644 --- a/src/theme.scss +++ b/src/theme.scss @@ -1361,37 +1361,46 @@ footer { // ---------------------------- // https://codepen.io/webmatze/pen/isuHh -.tag-input-container { - input { - float: left; - height: 18px; - padding: 0px; - font-size: 14px; - line-height: 18px; - color: black; - border: 0px; - margin: 1px; - &:focus { - outline: 0; - box-shadow: 0px; +tag-input { + height: auto !important; + + .tag-input-container { + display: flex; + flex-direction: row; + flex-wrap: wrap; + + input { + flex-grow: 1; + height: 18px; + padding: 0px; + font-size: 14px; + line-height: 18px; + color: black; + border: 0px; + margin: 1px; + &:focus { + outline: 0; + box-shadow: 0px; + } } - } - .input-tag { - padding: 2px 4px; - line-height: 12px; - font-size: 11px; - background-color: #e3eaf6; - float: left; - border-radius: 2px; - margin: 2px 5px 2px 0px; - border: 1px solid #a9b6d2; - .delete-tag { - display: inline-block; - font-size: 12px; - cursor: pointer; - padding: 0px 2px; - &:hover { - background-color: #96b4d2; + + .input-tag { + padding: 2px 4px; + line-height: 12px; + font-size: 11px; + background-color: #e3eaf6; + border-radius: 2px; + margin: 2px 5px 2px 0px; + border: 1px solid #a9b6d2; + + .delete-tag { + display: inline-block; + font-size: 12px; + cursor: pointer; + padding: 0px 2px; + &:hover { + background-color: #96b4d2; + } } } }