From 90d945590a970718e8c8aa5be93826efac939746 Mon Sep 17 00:00:00 2001
From: Dmitry Shemin <dshemin@pushwoosh.com>
Date: Tue, 17 Sep 2019 23:29:04 +0700
Subject: [PATCH] ui: [bugfix] Tag wrapping on detail pages (#6478)

Makes sure that tags wrap on the detail pages for service and nodes whilst making sure they don't wrap on the listing pages.
---
 .../app/styles/components/dom-recycling-table/layout.scss  | 6 ++++++
 ui-v2/app/styles/components/tag-list/layout.scss           | 7 +++++++
 2 files changed, 13 insertions(+)

diff --git a/ui-v2/app/styles/components/dom-recycling-table/layout.scss b/ui-v2/app/styles/components/dom-recycling-table/layout.scss
index ecd1c52ab9..cbaaf255e5 100644
--- a/ui-v2/app/styles/components/dom-recycling-table/layout.scss
+++ b/ui-v2/app/styles/components/dom-recycling-table/layout.scss
@@ -11,3 +11,9 @@
   /* important required as ember-collection will inline an overflow: visible*/
   overflow-x: hidden !important;
 }
+%dom-recycling-table dd {
+  flex-wrap: nowrap;
+}
+%dom-recycling-table dd > * {
+  margin-bottom: 0;
+}
diff --git a/ui-v2/app/styles/components/tag-list/layout.scss b/ui-v2/app/styles/components/tag-list/layout.scss
index e1f28e6402..ee482a895e 100644
--- a/ui-v2/app/styles/components/tag-list/layout.scss
+++ b/ui-v2/app/styles/components/tag-list/layout.scss
@@ -8,7 +8,14 @@
 %tag-list dd {
   display: inline-flex;
   padding-left: 0;
+  flex-wrap: wrap;
+  justify-content: space-between;
+}
+%tag-list dd:after {
+  content: '';
+  flex: auto;
 }
 %tag-list dd > * {
   margin-right: 3px;
+  margin-bottom: 10px;
 }