deprecate "headerImagePath"

app/src/app.config.json.tpl

@@ -35,7 +35,6 @@
     "name": "Alfresco Content Application",
     "version": "4.0.0-A.2",
     "logo": "assets/images/alfresco-logo-flower.svg",
-    "headerImagePath": "assets/images/mastHead-bg-shapesPattern.svg",
     "copyright": "APP.COPYRIGHT"
   },
   "viewer.maxRetries": 1,

docs/configuration/README.md

@@ -100,18 +100,6 @@ You can change the header text and background colors by specifying the color cod
 }
 ```
 
-### Header background image
-
-You can change the header background image by specifying the path to the corresponding resource:
-
-```json
-{
-    "application": {
-      "headerImagePath": "assets/images/mastHead-bg-shapesPattern.svg"
-    }
-}
-```
-
 ### Restricted content
 
 You can restrict users from uploading certain types of files and folders by setting or extending the list of rules at the "files.excluded" path.

docs/ja/getting-started/configuration.md

@@ -99,18 +99,6 @@ Alfresco コンテンツアプリケーションの左上隅に表示される
 }
 ```
 
-### ヘッダーの背景画像
-
-ヘッダーの背景画像を変更するには、対応するリソースへのパスを指定します:
-
-```json
-{
-    "application": {
-      "headerImagePath": "assets/images/mastHead-bg-shapesPattern.svg"
-    }
-}
-```
-
 ### 制限されたコンテンツ
 
 "files.excluded" パスにあるルールのリストを設定または拡張することで、ユーザーが特定の種類のファイルやフォルダをアップロードできないように制限することができます。

projects/aca-content/src/lib/components/header/header.component.scss

@@ -3,7 +3,6 @@
   z-index: 2;
 
   .mat-toolbar {
-    background-image: var(--header-background-image) !important;
     background-repeat: no-repeat !important;
 
     .aca-current-user {

projects/aca-content/src/lib/components/header/header.component.ts

@@ -27,7 +27,7 @@ import { Component, ViewEncapsulation, Output, EventEmitter, OnInit, Input, OnDe
 import { Store } from '@ngrx/store';
 import { Observable, Subject } from 'rxjs';
 import { ContentActionRef } from '@alfresco/adf-extensions';
-import { AppStore, getHeaderColor, getAppName, getLogoPath, getHeaderImagePath, getHeaderTextColor } from '@alfresco/aca-shared/store';
+import { AppStore, getHeaderColor, getAppName, getLogoPath, getHeaderTextColor } from '@alfresco/aca-shared/store';
 import { AppExtensionService } from '@alfresco/aca-shared';
 import { takeUntil } from 'rxjs/operators';
 import { AppConfigService, SidenavLayoutComponent } from '@alfresco/adf-core';
@@ -68,10 +68,6 @@ export class AppHeaderComponent implements OnInit, OnDestroy {
     this.appName$ = store.select(getAppName);
     this.logo$ = store.select(getLogoPath);
     this.landingPage = this.appConfigService.get('landingPage', '/personal-files');
-
-    store.select(getHeaderImagePath).subscribe((path) => {
-      document.body.style.setProperty('--header-background-image', `url('${path}')`);
-    });
   }
 
   ngOnInit() {

projects/aca-content/src/lib/store/initial-state.ts

@@ -30,7 +30,6 @@ export const INITIAL_APP_STATE: AppState = {
   headerColor: '#ffffff',
   headerTextColor: '#000000',
   logoPath: 'assets/images/alfresco-logo-white.svg',
-  headerImagePath: 'assets/images/mastHead-bg-shapesPattern.svg',
   customCssPath: '',
   webFontPath: '',
   sharedUrl: '',

projects/aca-content/src/lib/ui/variables/variables.scss

@@ -66,7 +66,6 @@ $defaults: (
   --theme-title-color: mat.get-color-from-palette($foreground, text, 0.87),
   --theme-text-disabled-color: mat.get-color-from-palette($foreground, text, 0.38),
   --theme-border-color: mat.get-color-from-palette($foreground, text, 0.07),
-  --header-background-image: url('/assets/images/mastHead-bg-shapesPattern.svg'),
   --theme-card-background-color: mat.get-color-from-palette($background, card),
   --theme-foreground-text-color: mat.get-color-from-palette($foreground, text, 0.72),
   --theme-foreground-text-bold-color: mat.get-color-from-palette($foreground, text, 0.87),

projects/aca-preview/src/lib/components/preview.component.spec.ts

@@ -64,7 +64,6 @@ export const INITIAL_APP_STATE: AppState = {
   headerColor: '#ffffff',
   headerTextColor: '#000000',
   logoPath: 'assets/images/alfresco-logo-white.svg',
-  headerImagePath: 'assets/images/mastHead-bg-shapesPattern.svg',
   customCssPath: '',
   webFontPath: '',
   sharedUrl: '',

projects/aca-shared/src/lib/components/document-base-page/document-base-page.spec.ts

@@ -44,7 +44,6 @@ export const INITIAL_APP_STATE: AppState = {
   headerColor: '#ffffff',
   headerTextColor: '#000000',
   logoPath: 'assets/images/alfresco-logo-white.svg',
-  headerImagePath: 'assets/images/mastHead-bg-shapesPattern.svg',
   customCssPath: '',
   webFontPath: '',
   sharedUrl: '',

projects/aca-shared/src/lib/components/page-layout/page-layout.component.html

@@ -1,10 +1,9 @@
-<div class="aca-content-container" [ngClass]="{'aca-page-layout-container' : hideSidenav}">
+<div class="aca-content-container">
     <div class="aca-content-header">
-        <div class="aca-menu-icon" [ngClass]="{'aca-display-menu' : !hideSidenav}" (click)="toggleClick()" (keypress)="toggleClick()">
+        <div class="aca-menu-icon" [ngClass]="{'aca-menu-hidden' : !hideSidenav}" (click)="toggleClick()" (keypress)="toggleClick()">
             <mat-icon title="{{'APP.TOOLTIPS.EXPAND_NAVIGATION' | translate}}">menu</mat-icon>
         </div>
-        <ng-content select="aca-page-layout-header">
+        <ng-content select="aca-page-layout-header"></ng-content>
-        </ng-content>
     </div>
     <ng-content select="aca-page-layout-error" *ngIf="hasError"></ng-content>
     <ng-content select="aca-page-layout-content" *ngIf="!hasError"></ng-content>

projects/aca-shared/src/lib/components/page-layout/page-layout.component.scss

@@ -29,20 +29,10 @@
     margin-top: 2px;
   }
 
-  .aca-display-menu {
+  .aca-menu-hidden {
     display: none;
   }
 
-  .aca-page-layout-container {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    bottom: 0;
-    right: 0;
-    height: 100%;
-  }
-
   .aca-page-layout-header {
     display: flex;
     align-items: center;

projects/aca-shared/src/lib/services/app.service.ts

@@ -227,7 +227,6 @@ export class AppService implements OnDestroy {
       headerColor: this.config.get<string>('headerColor'),
       headerTextColor: this.config.get<string>('headerTextColor', '#000000'),
       logoPath: this.config.get<string>('application.logo'),
-      headerImagePath: this.config.get<string>('application.headerImagePath'),
       customCssPath: this.config.get<string>('customCssPath'),
       webFontPath: this.config.get<string>('webFontPath'),
       sharedUrl: baseShareUrl

projects/aca-shared/src/lib/testing/lib-testing-module.ts

@@ -45,7 +45,6 @@ export const initialState = {
     appName: 'Alfresco Content Application',
     headerColor: '#ffffff',
     logoPath: 'assets/images/alfresco-logo-white.svg',
-    headerImagePath: 'assets/images/mastHead-bg-shapesPattern.svg',
     sharedUrl: '',
     user: {
       isAdmin: null,

projects/aca-shared/store/src/selectors/app.selectors.ts

@@ -34,7 +34,6 @@ export const getAppName = createSelector(selectApp, (state) => state.appName);
 export const getLogoPath = createSelector(selectApp, (state) => state.logoPath);
 export const getCustomCssPath = createSelector(selectApp, (state) => state.customCssPath);
 export const getCustomWebFontPath = createSelector(selectApp, (state) => state.webFontPath);
-export const getHeaderImagePath = createSelector(selectApp, (state) => state.headerImagePath);
 export const getUserProfile = createSelector(selectApp, (state) => state.user);
 export const getCurrentFolder = createSelector(selectApp, (state) => state.navigation.currentFolder);
 export const getCurrentVersion = createSelector(selectApp, (state) => state.currentNodeVersion);

projects/aca-shared/store/src/states/app.state.ts

@@ -36,7 +36,6 @@ export interface AppState {
   logoPath: string;
   customCssPath: string;
   webFontPath: string;
-  headerImagePath: string;
   sharedUrl: string;
   currentNodeVersion: VersionEntry;
   selection: SelectionState;