feat(home-button): add home-button component to library (#923)

* feat(home-button): add home-button component to library
* refactor(home-button): transfer home button to common package

gulpfile.js

@@ -173,6 +173,7 @@ gulp.task('core:concatStyles', done => {
       './packages/common/src/lib/collapsible/collapsible.theming.scss',
       './packages/common/src/lib/entity/entity.theming.scss',
       './packages/common/src/lib/entity/entity-table/entity-table.theming.scss',
+      './packages/common/src/lib/home-button/home-button.theming.scss',
       './packages/common/src/lib/list/list.theming.scss',
       './packages/common/src/lib/panel/panel.theming.scss',
       './packages/common/src/lib/tool/tool.theming.scss',

packages/common/src/lib/home-button/home-button.component.html

@@ -0,0 +1,9 @@
+<button
+    id="homeButton"
+    mat-icon-button
+    tooltip-position="below"
+    matTooltipShowDelay="500"
+    [matTooltip]="'igo.context.sidenav.mainMenu' | translate"
+    (click)="onUnselectButtonClick()">
+    <mat-icon svgIcon="home"></mat-icon>
+</button>

packages/common/src/lib/home-button/home-button.component.scss

@@ -0,0 +1,8 @@
+#homeButton {
+  position: absolute;
+  top: 50px;
+  left: 0px;
+  border-radius: 0;
+  height: 46px;
+  width: 48px;
+}

packages/common/src/lib/home-button/home-button.component.ts

@@ -0,0 +1,17 @@
+import { Component, EventEmitter, Output } from '@angular/core';
+
+@Component({
+  selector: 'igo-home-button',
+  templateUrl: './home-button.component.html',
+  styleUrls: ['./home-button.component.scss']
+})
+export class HomeButtonComponent {
+
+  @Output() unselectButton = new EventEmitter<any>();
+
+  constructor() {}
+
+  onUnselectButtonClick() {
+    this.unselectButton.emit();
+  }
+}

packages/common/src/lib/home-button/home-button.module.ts

@@ -0,0 +1,26 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { IgoLanguageModule } from '@igo2/core';
+
+import { MatButtonModule } from '@angular/material/button';
+import { MatIconModule } from '@angular/material/icon';
+import { MatTooltipModule } from '@angular/material/tooltip';
+
+import { HomeButtonComponent } from './home-button.component';
+
+/**
+ * @ignore
+ */
+@NgModule({
+  imports: [
+    CommonModule,
+    MatIconModule,
+    MatButtonModule,
+    MatTooltipModule,
+    IgoLanguageModule
+  ],
+  exports: [HomeButtonComponent],
+  declarations: [HomeButtonComponent],
+  providers: []
+})
+export class IgoHomeButtonModule {}

packages/common/src/lib/home-button/home-button.theming.scss

@@ -0,0 +1,16 @@
+@mixin igo-home-button-theming($theme) {
+  $primary: map-get($theme, primary);
+  $accent: map-get($theme, accent);
+  $foreground: map-get($theme, foreground);
+
+  igo-home-button > #homeButton {
+    background-color: mat.get-color-from-palette($primary);
+    color: mat.get-color-from-palette($primary, default-contrast);
+
+    &:hover {
+      background-color: mat.get-color-from-palette($accent, lighter);
+      color: black;
+    }
+  }
+}
+

packages/common/src/lib/home-button/index.ts

@@ -0,0 +1 @@
+export * from './home-button.component';

packages/common/src/public_api.ts

@@ -18,6 +18,7 @@ export * from './lib/dynamic-component/dynamic-outlet/dynamic-outlet.module';
 export * from './lib/flexible/flexible.module';
 export * from './lib/form/form.module';
 export * from './lib/form/form/form.module';
+export * from './lib/home-button/home-button.module';
 export * from './lib/form/form-field/form-field.module';
 export * from './lib/form/form-group/form-group.module';
 export * from './lib/entity/entity.module';
@@ -54,6 +55,7 @@ export * from './lib/custom-html';
 export * from './lib/drag-drop';
 export * from './lib/dynamic-component';
 export * from './lib/form';
+export * from './lib/home-button';
 export * from './lib/entity';
 export * from './lib/flexible';
 export * from './lib/image';

packages/common/src/style/common.theming.scss

@@ -8,4 +8,5 @@
   @include igo-panel-theming($theme);
   @include igo-tool-theming($theme);
   @include igo-tour-theming($theme);
+  @include igo-home-button-theming($theme);
 }