diff --git a/app/assets/javascripts/discourse/templates/components/user-small.hbs b/app/assets/javascripts/discourse/templates/components/user-small.hbs
index 2bf19059d..ac22ea37a 100644
--- a/app/assets/javascripts/discourse/templates/components/user-small.hbs
+++ b/app/assets/javascripts/discourse/templates/components/user-small.hbs
@@ -1,7 +1,9 @@
-{{#link-to 'user' user.username}}
- {{avatar user imageSize="tiny"}}
- {{user.username}}
- {{#if user.name}}
- ({{user.name}})
- {{/if}}
-{{/link-to}}
+
+ {{#link-to 'user' user.username}}{{avatar user imageSize="large"}}{{/link-to}}
+
+
+
+ {{#link-to 'user' user.username}}{{user.username}}{{/link-to}}
+ {{user.name}}
+ {{user.title}}
+
diff --git a/app/assets/stylesheets/common/base/about.scss b/app/assets/stylesheets/common/base/about.scss
index fdaafacb7..af5d06a5c 100644
--- a/app/assets/stylesheets/common/base/about.scss
+++ b/app/assets/stylesheets/common/base/about.scss
@@ -6,13 +6,43 @@ section.about {
}
.user-small {
- padding: 5px;
- width: 200px;
+ padding: 8px;
+ width: 205px;
+ height: 60px;
float: left;
- img {
+ .user-image {
+ float: left;
padding-right: 4px;
}
+
+ .user-detail {
+ float: left;
+ width: 70%;
+
+ span {
+ float: left;
+ width: 90%;
+ padding-left: 5px;
+ }
+
+ .username a {
+ font-weight: bold;
+ font-size: 16px;
+ color: scale-color($primary, $lightness: 30%);
+ }
+
+ .name {
+ font-size: 13px;
+ color: scale-color($primary, $lightness: 30%);
+ }
+
+ .title {
+ font-size: 13px;
+ color: scale-color($primary, $lightness: 50%);
+ }
+
+ }
}
p {
diff --git a/app/serializers/user_name_serializer.rb b/app/serializers/user_name_serializer.rb
index b1fa1c2e1..ac7beaa8d 100644
--- a/app/serializers/user_name_serializer.rb
+++ b/app/serializers/user_name_serializer.rb
@@ -1,5 +1,5 @@
class UserNameSerializer < ApplicationSerializer
- attributes :id, :username, :name, :uploaded_avatar_id, :avatar_template
+ attributes :id, :username, :name, :title, :uploaded_avatar_id, :avatar_template
def include_name?
SiteSetting.enable_names?