From 07ca35aaa750c12e76d634a2926f0c5e21067566 Mon Sep 17 00:00:00 2001 From: Rodrigo Nascimento Date: Tue, 19 Dec 2017 22:17:36 -0200 Subject: [PATCH] Fix: Rooms and users are using different avatar style --- .../components/sidebar/sidebar-item.css | 18 +++++++++++++++- .../client/avatar/avatar.js | 5 +++++ .../client/sidebarItem.html | 21 ++++++++----------- server/startup/avatar.js | 6 +----- 4 files changed, 32 insertions(+), 18 deletions(-) diff --git a/packages/rocketchat-theme/client/imports/components/sidebar/sidebar-item.css b/packages/rocketchat-theme/client/imports/components/sidebar/sidebar-item.css index 4ed0718b4a6c..dfbefa526bfb 100644 --- a/packages/rocketchat-theme/client/imports/components/sidebar/sidebar-item.css +++ b/packages/rocketchat-theme/client/imports/components/sidebar/sidebar-item.css @@ -29,6 +29,10 @@ margin: 0 auto; } + &__room-type { + height: var(--sidebar-item-big-height); + } + &__user-thumb { width: var(--sidebar-item-big-thumb-size); height: var(--sidebar-item-big-thumb-size); @@ -108,6 +112,18 @@ &__icon { font-size: 1rem; fill: currentColor; + display: flex; + align-items: center; + } + + &__room-type { + left: 4px; + font-size: 1rem; + fill: currentColor; + display: flex; + align-items: center; + position: absolute; + height: var(--sidebar-item-height); } &__user-thumb { @@ -119,7 +135,7 @@ position: absolute; top: 50%; - left: 10px; + left: 8px; width: var(--sidebar-item-user-status-size); height: var(--sidebar-item-user-status-size); diff --git a/packages/rocketchat-ui-account/client/avatar/avatar.js b/packages/rocketchat-ui-account/client/avatar/avatar.js index 10bd7de73310..555bf769cd7e 100644 --- a/packages/rocketchat-ui-account/client/avatar/avatar.js +++ b/packages/rocketchat-ui-account/client/avatar/avatar.js @@ -11,6 +11,11 @@ Template.avatar.helpers({ return; } Session.get(`avatar_random_${ username }`); + + if (this.roomIcon) { + username = `@${ username }`; + } + url = getAvatarUrlFromUsername(username); } return `background-image:url(${ url });`; diff --git a/packages/rocketchat-ui-sidenav/client/sidebarItem.html b/packages/rocketchat-ui-sidenav/client/sidebarItem.html index ca993384ec4f..53746c6f7392 100644 --- a/packages/rocketchat-ui-sidenav/client/sidebarItem.html +++ b/packages/rocketchat-ui-sidenav/client/sidebarItem.html @@ -3,20 +3,17 @@ {{#if statusClass}}
{{/if}} + {{#if icon}} +
+ {{> icon block="sidebar-item__icon" icon=icon}} +
+ {{/if}} - {{#if icon}} -
- {{> icon block="sidebar-item__icon" icon=icon}} +
+
+ {{> avatar username=username roomIcon=icon}}
- {{else}} - {{#if avatar}} -
-
- {{> avatar username=username}} -
-
- {{/if}} - {{/if}} +
diff --git a/server/startup/avatar.js b/server/startup/avatar.js index 0109c70945c3..600bb305a0e1 100644 --- a/server/startup/avatar.js +++ b/server/startup/avatar.js @@ -75,12 +75,8 @@ Meteor.startup(function() { initials = username; } else { color = RocketChat.getAvatarColor(username); - username = username.replace(/[^A-Za-z0-9]/g, '.').replace(/\.+/g, '.').replace(/(^\.)|(\.$)/g, ''); - const usernameParts = username.split('.'); - - initials = usernameParts.length > 1 ? _.first(usernameParts)[0] + _.last(usernameParts)[0] : username.replace(/[^A-Za-z0-9]/g, '').substr(0, 2); - initials = initials.toUpperCase(); + initials = username.replace(/[^A-Za-z0-9]/g, '').substr(0, 1).toUpperCase(); } const svg = `\n\n\n\n${ initials }\n\n`;