mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[ADF-3358][ADF-3359][ADF-3360] Logo link and tooltip and hex colors (#3648)
* [ADF-3358] link on logo * [ADF-3358] test link on logo * [ADF-3360] tooltip on logo * [ADF-3360] update logo docs * [ADF-3359] allow hex color codes for the background color * [ADF-3358] better name for property
This commit is contained in:
committed by
Eugenio Romano
parent
70605c8982
commit
8d8ab1e682
@@ -1,9 +1,11 @@
|
||||
<mat-toolbar color="{{color}}">
|
||||
<mat-toolbar color="{{color}}" [style.background-color]="color">
|
||||
<button *ngIf="showSidenavToggle" data-automation-id="adf-menu-icon" class="mat-icon-button adf-menu-icon" mat-icon-button (click)="toggleMenu()">
|
||||
<mat-icon class="mat-icon material-icon" role="img" aria-hidden="true">menu</mat-icon>
|
||||
</button>
|
||||
|
||||
<img src="{{logo}}" class="adf-app-logo">
|
||||
<a [routerLink]="redirectUrl" title="{{ tooltip }}">
|
||||
<img src="{{logo}}" class="adf-app-logo" />
|
||||
</a>
|
||||
|
||||
<span fxFlex="1 1 auto" fxShow fxHide.lt-sm="true" class="adf-app-title">{{title}}</span>
|
||||
<ng-content></ng-content>
|
||||
|
@@ -22,6 +22,7 @@ import { CoreTestingModule } from '../../../testing/core.testing.module';
|
||||
import { By } from '@angular/platform-browser';
|
||||
import { LayoutModule } from '../..';
|
||||
import { Component } from '@angular/core';
|
||||
import { RouterTestingModule } from '@angular/router/testing';
|
||||
import { MaterialModule } from './../../../material.module';
|
||||
|
||||
describe('HeaderLayoutComponent', () => {
|
||||
@@ -78,6 +79,22 @@ describe('HeaderLayoutComponent', () => {
|
||||
expect(src).toEqual('logo.png');
|
||||
});
|
||||
|
||||
it('should have custom url link set on logo when the redirectUrl is set', () => {
|
||||
component.redirectUrl = '/customHomePage';
|
||||
fixture.detectChanges();
|
||||
|
||||
const logoAnchor = fixture.nativeElement.querySelector('mat-toolbar>a');
|
||||
expect(/\/customHomePage$/.test(logoAnchor.href)).toEqual(true);
|
||||
});
|
||||
|
||||
it('should have custom tooltip text set on logo when the tooltip parameter is set', () => {
|
||||
component.tooltip = 'logo title';
|
||||
fixture.detectChanges();
|
||||
|
||||
const logoAnchor = fixture.nativeElement.querySelector('mat-toolbar>a');
|
||||
expect(logoAnchor.title).toEqual('logo title');
|
||||
});
|
||||
|
||||
it('test click on sidenav button', () => {
|
||||
component.showSidenavToggle = true;
|
||||
fixture.detectChanges();
|
||||
@@ -117,7 +134,7 @@ describe('HeaderLayoutComponent', () => {
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [HeaderLayoutTesterComponent],
|
||||
imports: [ LayoutModule, MaterialModule ]
|
||||
imports: [ LayoutModule, MaterialModule, RouterTestingModule ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
@@ -26,6 +26,8 @@ import { Component, Input, Output, EventEmitter, ViewEncapsulation, OnInit } fro
|
||||
export class HeaderLayoutComponent implements OnInit {
|
||||
@Input() title: string;
|
||||
@Input() logo: string;
|
||||
@Input() redirectUrl: string | any[] = '/';
|
||||
@Input() tooltip: string;
|
||||
@Input() color: string;
|
||||
@Input() showSidenavToggle: boolean = true;
|
||||
@Output() clicked = new EventEmitter<any>();
|
||||
|
Reference in New Issue
Block a user