mirror of
https://github.com/Alfresco/alfresco-content-app.git
synced 2025-10-01 14:41:14 +00:00
cleanup header actions
This commit is contained in:
committed by
Sheena Malhotra
parent
cddb2a1fcf
commit
a25cd8a1d5
@@ -1,31 +1,22 @@
|
||||
<div>
|
||||
<div class="adf-toolbar--spacer adf-toolbar-divider"></div>
|
||||
<span class="action-bar">
|
||||
<button class="aca-mat-button aca-create-button" mat-button data-automation-id="create-button"
|
||||
*ngIf="canShowCreateButton()"
|
||||
[matMenuTriggerFor]="createMenu">
|
||||
{{ 'APP.HEADER.BUTTONS.CREATE' | translate }}
|
||||
</button>
|
||||
<mat-menu #createMenu="matMenu" role="menu" class="app-create-menu__root-menu app-create-menu__sub-menu"
|
||||
[overlapTrigger]="false" yPosition="below">
|
||||
<div *ngFor="let action of createActions; trackBy: trackByActionId">
|
||||
<app-toolbar-menu-item [actionRef]="action"></app-toolbar-menu-item>
|
||||
</div>
|
||||
</mat-menu>
|
||||
<adf-toolbar class="adf-toolbar--inline">
|
||||
<button mat-flat-button data-automation-id="create-button" *ngIf="canShowCreateButton()" [matMenuTriggerFor]="createMenu">
|
||||
{{ 'APP.HEADER.BUTTONS.CREATE' | translate }}
|
||||
</button>
|
||||
<mat-menu #createMenu="matMenu" role="menu" class="app-create-menu__root-menu app-create-menu__sub-menu" [overlapTrigger]="false" yPosition="below">
|
||||
<div *ngFor="let action of createActions; trackBy: trackByActionId">
|
||||
<app-toolbar-menu-item [actionRef]="action"></app-toolbar-menu-item>
|
||||
</div>
|
||||
</mat-menu>
|
||||
|
||||
<button class="aca-mat-button aca-upload-button" mat-button data-automation-id="upload-button"
|
||||
*ngIf="canShowUploadButton()" [matMenuTriggerFor]="uploadMenu">
|
||||
{{ 'APP.HEADER.BUTTONS.UPLOAD' | translate }}
|
||||
</button>
|
||||
<mat-menu #uploadMenu="matMenu" role="menu" class="app-upload-menu__root-menu app-upload-menu__sub-menu"
|
||||
[overlapTrigger]="false" yPosition="below">
|
||||
<div *ngFor="let action of uploadActions; trackBy: trackByActionId">
|
||||
<app-toolbar-menu-item [actionRef]="action"></app-toolbar-menu-item>
|
||||
</div>
|
||||
</mat-menu>
|
||||
<button mat-flat-button color="primary" data-automation-id="upload-button" *ngIf="canShowUploadButton()" [matMenuTriggerFor]="uploadMenu">
|
||||
{{ 'APP.HEADER.BUTTONS.UPLOAD' | translate }}
|
||||
</button>
|
||||
<mat-menu #uploadMenu="matMenu" role="menu" class="app-upload-menu__root-menu app-upload-menu__sub-menu" [overlapTrigger]="false" yPosition="below">
|
||||
<div *ngFor="let action of uploadActions; trackBy: trackByActionId">
|
||||
<app-toolbar-menu-item [actionRef]="action"></app-toolbar-menu-item>
|
||||
</div>
|
||||
</mat-menu>
|
||||
|
||||
<adf-toolbar-divider *ngIf="canShowSearchSeparator()">
|
||||
</adf-toolbar-divider>
|
||||
<aca-search-input class="app-search-input"></aca-search-input>
|
||||
</span>
|
||||
</div>
|
||||
<adf-toolbar-divider *ngIf="canShowSearchSeparator()"></adf-toolbar-divider>
|
||||
<aca-search-input class="app-search-input"></aca-search-input>
|
||||
</adf-toolbar>
|
||||
|
@@ -1,47 +1,18 @@
|
||||
.aca-page-layout-header {
|
||||
|
||||
.app-search-input {
|
||||
background: none;
|
||||
}
|
||||
|
||||
.action-bar {
|
||||
display: flex;
|
||||
flex: auto;
|
||||
height: 32px;
|
||||
margin-left: 24px;
|
||||
.mat-flat-button {
|
||||
min-width: auto;
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
adf-toolbar-divider {
|
||||
width: 24px;
|
||||
height: 32px;
|
||||
margin: 4px 0 0 12px;
|
||||
.app-search-input {
|
||||
padding-bottom: 0 !important;
|
||||
|
||||
.app-search-container {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
& > button {
|
||||
margin-left: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.aca-mat-button {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
letter-spacing: 0.25px;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
border-radius: 6px;
|
||||
border: none;
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
.aca-create-button {
|
||||
background-color: var(--theme-create-button-background-color);
|
||||
color: var(--theme-create-button-text-color);
|
||||
}
|
||||
|
||||
.aca-upload-button {
|
||||
background-color: var(--theme-upload-button-background-color);
|
||||
color: var(--theme-upload-button-text-color);
|
||||
}
|
||||
}
|
||||
|
@@ -78,7 +78,7 @@ describe('HeaderActionsComponent', () => {
|
||||
fixture.detectChanges();
|
||||
await fixture.whenStable();
|
||||
|
||||
const buttons = fixture.debugElement.queryAll(By.css('.action-bar > .aca-mat-button'));
|
||||
const buttons = fixture.debugElement.queryAll(By.css('.mat-flat-button'));
|
||||
|
||||
expect(buttons.length).toBe(2);
|
||||
expect(getCreateButton()).toBeTruthy();
|
||||
@@ -91,7 +91,7 @@ describe('HeaderActionsComponent', () => {
|
||||
fixture.detectChanges();
|
||||
await fixture.whenStable();
|
||||
|
||||
const buttons = fixture.debugElement.queryAll(By.css('.action-bar > .aca-mat-button'));
|
||||
const buttons = fixture.debugElement.queryAll(By.css('.mat-flat-button'));
|
||||
|
||||
expect(buttons.length).toBe(1);
|
||||
expect(getCreateButton()).toBeTruthy();
|
||||
|
Reference in New Issue
Block a user