128 lines
4.0 KiB
HTML
128 lines
4.0 KiB
HTML
<div class="container">
|
|
<mat-tab-group
|
|
mat-stretch-tabs
|
|
animationDuration="0ms"
|
|
(selectedTabChange)="onSelectedTabChange($event)"
|
|
class="global-menu"
|
|
>
|
|
<mat-tab [aria-label]="MainMenu.Group">
|
|
<ng-template mat-tab-label>
|
|
<!--<mat-icon>group</mat-icon>-->
|
|
<div
|
|
class="icon-item"
|
|
matTooltip="{{ 'group.label' | translate }}"
|
|
matTooltipPosition="after"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width="24"
|
|
height="24"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
stroke-width="1.5"
|
|
stroke-linecap="butt"
|
|
stroke-linejoin="round"
|
|
>
|
|
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path>
|
|
<circle cx="12" cy="7" r="4"></circle>
|
|
</svg>
|
|
</div>
|
|
</ng-template>
|
|
</mat-tab>
|
|
<mat-tab [aria-label]="MainMenu.Chat">
|
|
<ng-template mat-tab-label>
|
|
<div
|
|
class="icon-item"
|
|
[matBadgeHidden]="badgeChatUnReadCount <= 0"
|
|
[matBadge]="badgeChatUnReadCount"
|
|
matBadgeDescription="{{
|
|
'chat.badgeDescriptionForUnread' | translate
|
|
}}"
|
|
matBadgeColor="accent"
|
|
matBadgePosition="above after"
|
|
matTooltip="{{ 'chat.label' | translate }}"
|
|
matTooltipPosition="after"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width="24"
|
|
height="24"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="#000000"
|
|
stroke-width="1.5"
|
|
stroke-linecap="butt"
|
|
stroke-linejoin="bevel"
|
|
>
|
|
<path
|
|
d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"
|
|
></path>
|
|
</svg>
|
|
</div>
|
|
</ng-template>
|
|
</mat-tab>
|
|
<mat-tab [aria-label]="MainMenu.Organization">
|
|
<ng-template mat-tab-label>
|
|
<div
|
|
class="icon-item"
|
|
matTooltip="{{ 'organization.chart' | translate }}"
|
|
matTooltipPosition="after"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width="24"
|
|
height="24"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="#000000"
|
|
stroke-width="1.5"
|
|
stroke-linecap="butt"
|
|
stroke-linejoin="bevel"
|
|
>
|
|
<circle class="st0" cx="18.4" cy="18.5" r="3" />
|
|
<circle class="st0" cx="12" cy="5" r="3" />
|
|
<path class="st0" d="M12.4,10.5h4c1.1,0,2,0.9,2,2v3" />
|
|
<circle class="st0" cx="6.1" cy="18.5" r="3" />
|
|
<path class="st0" d="M6.1,15.5v-3c0-1.1,0.9-2,2-2h4" />
|
|
<line class="st0" x1="12" y1="8" x2="12" y2="9" />
|
|
</svg>
|
|
</div>
|
|
</ng-template>
|
|
</mat-tab>
|
|
|
|
<mat-tab [aria-label]="MainMenu.Message">
|
|
<ng-template mat-tab-label>
|
|
<div
|
|
class="icon-item"
|
|
[matBadgeHidden]="(badgeMessageUnReadCount$ | async) <= 0"
|
|
[matBadge]="badgeMessageUnReadCount$ | async"
|
|
matBadgeDescription="{{
|
|
'message.badgeDescriptionForUnread' | translate
|
|
}}"
|
|
matBadgeColor="accent"
|
|
matBadgePosition="above after"
|
|
matTooltip="{{ 'message.label' | translate }}"
|
|
matTooltipPosition="after"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width="24"
|
|
height="24"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="#000000"
|
|
stroke-width="1.5"
|
|
stroke-linecap="butt"
|
|
stroke-linejoin="bevel"
|
|
>
|
|
<polygon
|
|
points="21.368 12.001 3 21.609 3 14 11 12 3 9.794 3 2.394"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
</ng-template>
|
|
</mat-tab>
|
|
</mat-tab-group>
|
|
</div>
|