LOOP-1245: Wrap badges instead of inline.

Author: yepzdk

web/profiles/custom/os2loop/themes/os2loop_theme/assets/components/layout/title.scss

@@ -11,11 +11,15 @@
 		color: $loop-white;
 	}
 
-	.title-badges {
-		div + div,
-		span + a.badge,
-		a.badge + a.badge {
-			@extend .ml-15;
-		}
+	&-badges {
+		display: flex;
+		column-gap: 15px;
+		align-items: flex-start;
+
+		// div + div,
+		// span + a.badge,
+		// a.badge + a.badge {
+		// 	@extend .ml-15;
+		// }
 	}
 }

web/profiles/custom/os2loop/themes/os2loop_theme/templates/field/field--node--os2loop-shared-profession.html.twig

@@ -39,7 +39,7 @@
 #}
 {% import '@os2loop_theme/macros.html.twig' as macros %}
 
-<div{{ attributes }} class="d-inline-flex align-items-center">
+<div{{ attributes }} class="align-items-center">
   <span{{ title_attributes.addClass(element['#view_mode'] == 'list_display' ? 'd-none') }}>
     {{ label }}:
   </span>

web/profiles/custom/os2loop/themes/os2loop_theme/templates/macros.html.twig

@@ -37,7 +37,7 @@
         </div>
       </div>
       <div class="row no-gutters mb-30">
-        <div class="col title-badges d-inline-flex">
+        <div class="col title-badges">
           {# badges #}
           <div class="badge badge-{{ class }}">{{ class|capitalize|t }}</div>
           {{ content.os2loop_shared_subject }}