[design proposal] adding a mixin to style social issue badge

src/Bundle/ChillPersonBundle/Resources/public/chill/chillperson.scss

@@ -1,7 +1,8 @@
 // Access to Bootstrap variables and mixins
 @import '~ChillMainAssets/module/bootstrap/shared';
 
-// Override Main generic assets
+// Complete/override Main generic assets
+@import './scss/mixins';
 @import './scss/render_box.scss';
 @import './scss/flex_table.scss';
 

src/Bundle/ChillPersonBundle/Resources/public/chill/scss/mixins.scss

@@ -0,0 +1,18 @@
+///
+///  Social Issue mixin
+//   define visual badge for all social issues
+///
+
+$social-issue-color: $chill-pink;
+
+@mixin badge_social_issue {
+    text-transform: capitalize !important;
+    font-weight: 500 !important;
+    border-left: 20px groove $social-issue-color;
+    &:before {
+        content: '\f04b';
+        font-family: ForkAwesome;
+        color: $social-issue-color;
+        margin: 0 0.3em 0 -0.7em;
+    }
+}

src/Bundle/ChillPersonBundle/Resources/public/chill/scss/render_box.scss

@@ -1,3 +1,5 @@
+/// variables
+
 /// CHILL ENTITY RENDER BOX
 .chill-entity {
 
@@ -11,6 +13,10 @@
     /// SOCIAL-ISSUE
     &.entity-social-issue {
         margin-right: 0.3em;
+        font-size: 120%;
+        span.badge {
+            @include badge_social_issue;
+        }
     }
 }