+
{{ initials }}
diff --git a/apps/red-ui/src/app/common/initials-avatar/initials-avatar.component.scss b/apps/red-ui/src/app/common/initials-avatar/initials-avatar.component.scss
index 4fa6482c9..61c92d816 100644
--- a/apps/red-ui/src/app/common/initials-avatar/initials-avatar.component.scss
+++ b/apps/red-ui/src/app/common/initials-avatar/initials-avatar.component.scss
@@ -1,3 +1,5 @@
+@import '../../../assets/styles/red-variables';
+
.wrapper {
display: flex;
align-items: center;
@@ -7,3 +9,7 @@
margin-left: 6px;
}
}
+
+.border {
+ border: 1px solid $grey-7;
+}
diff --git a/apps/red-ui/src/app/common/initials-avatar/initials-avatar.component.ts b/apps/red-ui/src/app/common/initials-avatar/initials-avatar.component.ts
index 140126905..a4999dced 100644
--- a/apps/red-ui/src/app/common/initials-avatar/initials-avatar.component.ts
+++ b/apps/red-ui/src/app/common/initials-avatar/initials-avatar.component.ts
@@ -8,17 +8,10 @@ import { User } from '@redaction/red-ui-http';
styleUrls: ['./initials-avatar.component.scss']
})
export class InitialsAvatarComponent implements OnInit, OnChanges {
- @Input()
- public userId: string;
-
- @Input()
- public color = 'lightgray';
-
- @Input()
- public size: 'small' | 'large' = 'small';
-
- @Input()
- public withName = false;
+ @Input() public userId: string;
+ @Input() public color = 'lightgray';
+ @Input() public size: 'small' | 'large' = 'small';
+ @Input() public withName = false;
public _user: User;
@@ -67,7 +60,10 @@ export class InitialsAvatarComponent implements OnInit, OnChanges {
if (this.color.includes('-')) {
return this.color;
}
- const textColor = !this._user || !this._userService.isManager(this._user) ? 'dark' : 'red';
- return `${this.color}-${textColor}`;
+ return `${this.color}-dark`;
+ }
+
+ public get hasBorder(): boolean {
+ return !!this._user && this._userService.userId !== this.userId && this._userService.isManager(this._user);
}
}
diff --git a/apps/red-ui/src/assets/styles/red-page-layout.scss b/apps/red-ui/src/assets/styles/red-page-layout.scss
index a2ea6a528..d48a37437 100644
--- a/apps/red-ui/src/assets/styles/red-page-layout.scss
+++ b/apps/red-ui/src/assets/styles/red-page-layout.scss
@@ -118,6 +118,12 @@ body {
margin-bottom: 24px;
}
}
+
+ @media only screen and (max-width: 1600px) {
+ redaction-initials-avatar .username {
+ display: none;
+ }
+ }
}
.right-container {