inteligr8/alfresco-content-app
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-content-app.git synced 2025-07-31 17:38:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ACS-5675] replace breadcrumbs with H1 tags (#3358)

Browse Source 
* rename tabs css class to match the ACA app

* fix incorrect tooltip for close button

* fix close button layout and a11y

* lazy loading for details component

* replace breadcrumbs with H1 tag

* replace breadcrumbs with H1 tag

* cleanup unused playwright pages

* remove breadcrumbs from e2e

* remove line height
This commit is contained in:
Denys Vuika
2023-07-21 10:42:23 +01:00
committed by GitHub
parent e2257bad23
commit 9204194e53
42 changed files with 99 additions and 206 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
projects/aca-content/src/lib/components/details/details.component.html
View File

@@ -17,22 +17,31 @@
-
<span class="acs-details-breadcrumb-item">{{ 'APP.INFO_DRAWER.TITLE' | translate }}</span>
</div>
<div class="acs-close-members-container">
<button mat-icon-button data-automation-id="close-library" title="{{ 'APP.INFO_DRAWER.CLOSE_LIBRARY' | translate }}" (click)="goBack()">
<mat-icon>close</mat-icon>
</button>
</div>
<button
class="aca-close-details-button"
mat-icon-button
data-automation-id="close-library"
title="{{ 'APP.INFO_DRAWER.CLOSE' | translate }}"
(click)="goBack()">
<mat-icon>close</mat-icon>
</button>
</div>
<mat-tab-group [selectedIndex]="activeTab" class="adw-details-tabs">
<mat-tab-group [selectedIndex]="activeTab" class="aca-details-tabs" animationDuration="0">
<mat-tab label="{{ 'APP.INFO_DRAWER.TABS.PROPERTIES' | translate }}">
<app-metadata-tab *ngIf="node && !isLoading; else loading" [node]="node"> </app-metadata-tab>
<ng-template matTabContent>
<app-metadata-tab *ngIf="node && !isLoading; else loading" [node]="node"></app-metadata-tab>
</ng-template>
</mat-tab>
<mat-tab label="{{ 'APP.INFO_DRAWER.TABS.COMMENTS' | translate }}">
<app-comments-tab *ngIf="node && !isLoading; else loading" [node]="node"> </app-comments-tab>
<ng-template matTabContent>
<app-comments-tab *ngIf="node && !isLoading; else loading" [node]="node"></app-comments-tab>
</ng-template>
</mat-tab>
<mat-tab label="{{ 'APP.INFO_DRAWER.TABS.PERMISSIONS' | translate }}">
<adf-permission-list *ngIf="node && !isLoading; else loading" [nodeId]="node.id"></adf-permission-list>
<ng-template matTabContent>
<adf-permission-list *ngIf="node && !isLoading; else loading" [nodeId]="node.id"></adf-permission-list>
</ng-template>
</mat-tab>
</mat-tab-group>
</div>
@@ -40,5 +49,5 @@
</aca-page-layout>
<ng-template #loading>
<mat-progress-bar color="primary" mode="indeterminate"> </mat-progress-bar>
<mat-progress-bar color="primary" mode="indeterminate"></mat-progress-bar>
</ng-template>

20
projects/aca-content/src/lib/components/details/details.component.scss
View File

@@ -1,9 +1,23 @@
app-details-manager {
.aca-close-details-button {
margin-right: 15px;
margin-top: 2px;
outline: none;
border-radius: 4px;
&:focus-visible {
outline: 2px solid var(--theme-blue-button-color);
border-radius: 4px;
}
}
}
.acs-details-container {
background-color: var(--theme-card-background-color);
width: 100%;
}
.adw-details-tabs {
.aca-details-tabs {
margin-top: 40px;
height: calc(100% - 80px);
@@ -21,10 +35,6 @@
display: flex;
align-items: center;
justify-content: space-between;
.acs-close-members-container {
margin-right: 15px;
}
}
.acs-details-breadcrumb {