Differentiate between full name and username in css and break long words

app/modules/profile/profile-bar/profile-bar.jade

@@ -5,7 +5,7 @@ section.profile-bar
     // a.button-green
     //     span(translate="USER.PROFILE.FOLLOW")
     div.profile-data
-        h1 {{::vm.user.get("full_name_display")}}
+        h1(ng-class="{'not-full-name': !vm.user.get('full_name')}") {{::vm.user.get("full_name_display")}}
         h2 {{::vm.stats.get('roles').join(", ")}}
         // div.location
         //     include ../../../svg/location.svg

app/modules/profile/styles/profile-bar.scss

@@ -70,6 +70,9 @@
         margin-bottom: .5rem;
         text-transform: none;
     }
+    .not-full-name {
+        word-wrap: break-word;
+    }
     h2 {
         @extend %light;
         @extend %larger;