diff --git a/_includes/c_knowledgebase-item.html b/_includes/c_knowledgebase-item.html index 4be0f94..ecd3378 100644 --- a/_includes/c_knowledgebase-item.html +++ b/_includes/c_knowledgebase-item.html @@ -55,7 +55,7 @@

{% if include.item.tags.size > 0 %} -
+
{% for tag in include.item.tags -%}{{ tag }}{%- endfor %}
{% endif %} diff --git a/_sass/_knowledgebase.scss b/_sass/_knowledgebase.scss index ef02f67..be845ac 100644 --- a/_sass/_knowledgebase.scss +++ b/_sass/_knowledgebase.scss @@ -81,11 +81,10 @@ .knowledgebase-item__tags { position: relative; - background-color: var(--custom-knowledgebase-tags-bg); - padding: calc(var(--bulma-size-5) * .25) calc(var(--bulma-size-5) * .75); - border-radius: var(--bulma-size-5); margin-top: calc(var(--bulma-size-5) * .5); + flex-wrap: wrap; + // --- blue line &:after { content: ''; width: calc(var(--bulma-size-5) * 4); @@ -97,14 +96,9 @@ } } -.knowledgebase-item__tag:not(:last-child):not(.knowledgebase-item__tag--icon) { - &:after { - content: ' \2022 '; - } -} - -.knowledgebase-item__tag--icon { - aspect-ratio: 1; - display: inline-flex; - padding: calc(var(--bulma-size-5) * .25); +.knowledgebase-item__tag { + background-color: var(--custom-knowledgebase-tags-bg); + padding: calc(var(--bulma-size-5) * .25) calc(var(--bulma-size-5) * .75); + border-radius: var(--bulma-size-5); + white-space: nowrap; }