|
1 |
| -<div class="govuk-header__container govuk-width-container"> |
2 |
| - <div class="govuk-header__logo"> |
3 |
| - <span class="govuk-header__logotype-crown"> |
| 1 | +<header class="moj-header" role="banner"> |
| 2 | + <div class="moj-header__container"> |
| 3 | + <div class="moj-header__logo"> |
4 | 4 | <ng-container *ngIf="hearingVenueIsScottish$ | async; then sctsCrest; else hmctsCrest"></ng-container>
|
5 | 5 | <ng-template #sctsCrest>
|
6 |
| - <img |
7 |
| - id="header-logo-scot" |
8 |
| - class="govuk-header__logotype-crest" |
9 |
| - src="/assets/images/scot-crest-white.png" |
10 |
| - height="40" |
11 |
| - [attr.alt]="'participants-panel.scottish-crest' | translate" |
12 |
| - /> |
| 6 | + <span class="moj-header__logotype-crest"> |
| 7 | + <img |
| 8 | + id="header-logo-scot" |
| 9 | + class="govuk-header__logotype-crest" |
| 10 | + src="/assets/images/scot-crest-white.png" |
| 11 | + height="40" |
| 12 | + [attr.alt]="'participants-panel.scottish-crest' | translate" |
| 13 | + /> |
| 14 | + </span> |
13 | 15 | </ng-template>
|
14 | 16 | <ng-template #hmctsCrest>
|
15 | 17 | <app-header-logo-svg></app-header-logo-svg>
|
16 | 18 | </ng-template>
|
17 |
| - <span class="govuk-header__service-name govuk-!-margin-left-1"> |
18 |
| - {{ 'header.hm-courts' | translate }} & {{ 'header.tribunals-service' | translate }}</span |
19 |
| - > |
20 |
| - </span> |
21 |
| - </div> |
22 | 19 |
|
23 |
| - <div class="govuk-header__content"> |
24 |
| - <nav class="govuk-header__navigation" [attr.aria-label]="'header.account-details' | translate"> |
25 |
| - <ul class="govuk-header__navigation-list"> |
26 |
| - <li class="govuk-header__navigation-item stay-right"> |
27 |
| - <span id="header-username">{{ username }}</span> |
28 |
| - </li> |
29 |
| - </ul> |
30 |
| - </nav> |
31 |
| - </div> |
32 |
| - <div class="govuk-header__content govuk-header__content_secondary"> |
33 |
| - <nav class="govuk-header__navigation" [attr.aria-label]="'header.account-navigation-label' | translate"> |
34 |
| - <ul class="govuk-header__navigation-list"> |
35 |
| - <li *ngIf="loggedIn" class="govuk-header__navigation-item stay-right"> |
36 |
| - <a id="logout-link" class="govuk-header__link" [routerLink]="logoutRoute">{{ 'header.sign-out' | translate }}</a> |
37 |
| - </li> |
38 |
| - </ul> |
39 |
| - </nav> |
| 20 | + <a class="moj-header__link moj-header__link--organisation-name" href="javascript:void(0)">{{ |
| 21 | + 'header.organisation-name' | translate |
| 22 | + }}</a> |
| 23 | + |
| 24 | + <a class="moj-header__link moj-header__link--service-name" href="javascript:void(0)">{{ 'header.service-name' | translate }}</a> |
| 25 | + </div> |
| 26 | + <div *ngIf="loggedIn" class="moj-header__content"> |
| 27 | + <nav class="moj-header__navigation" aria-label="Account navigation"> |
| 28 | + <ul class="moj-header__navigation-list"> |
| 29 | + <li class="moj-header__navigation-item"> |
| 30 | + <a id="header-username" class="moj-header__navigation-link" href="javascript:void(0)" aria-current="page">{{ username }}</a> |
| 31 | + </li> |
| 32 | + |
| 33 | + <li class="moj-header__navigation-item"> |
| 34 | + <a id="logout-link" class="govuk-header__link" [routerLink]="logoutRoute">{{ 'header.sign-out' | translate }}</a> |
| 35 | + </li> |
| 36 | + </ul> |
| 37 | + </nav> |
| 38 | + </div> |
40 | 39 | </div>
|
41 |
| -</div> |
| 40 | +</header> |
0 commit comments