Change app-banner-divider to be applied per page basis and not in sit…

…e layout
CSCfi · Aug 28, 2024 · 1b64717 · 1b64717
1 parent ea8873b
commit 1b64717
Show file tree

Hide file tree

Showing 15 changed files with 275 additions and 248 deletions.
diff --git a/src/app/layout/layout.component.html b/src/app/layout/layout.component.html
@@ -22,7 +22,7 @@
   </div>
 
   <ng-template #content>
-    <app-banner-divider></app-banner-divider>
+    <!--<app-banner-divider></app-banner-divider>-->
     <div class="container-fluid main">
       <ng-content></ng-content>
     </div>

diff --git a/src/app/mydata/components/account-settings/account-settings.component.html b/src/app/mydata/components/account-settings/account-settings.component.html
@@ -1,3 +1,5 @@
+<app-banner-divider></app-banner-divider>
+
 <main id="main-content" class="account-settings-wrap">
   <div class="wrapper">
     <div class="row d-flex justify-content-between pt-3 pb-5">

diff --git a/src/app/mydata/components/account-settings/account-settings.component.ts b/src/app/mydata/components/account-settings/account-settings.component.ts
@@ -14,21 +14,23 @@ import { PrimaryActionButtonComponent } from '../../../shared/components/buttons
 import { MatProgressSpinner } from '@angular/material/progress-spinner';
 import { SecondaryButtonComponent } from '../../../shared/components/buttons/secondary-button/secondary-button.component';
 import { NgIf, AsyncPipe } from '@angular/common';
+import { BannerDividerComponent } from '@shared/components/banner-divider/banner-divider.component';
 
 @Component({
     selector: 'app-account-settings',
     templateUrl: './account-settings.component.html',
     styleUrls: ['./account-settings.component.scss'],
     encapsulation: ViewEncapsulation.None,
     standalone: true,
-    imports: [
-        NgIf,
-        SecondaryButtonComponent,
-        MatProgressSpinner,
-        PrimaryActionButtonComponent,
-        DialogComponent,
-        AsyncPipe,
-    ],
+  imports: [
+    NgIf,
+    SecondaryButtonComponent,
+    MatProgressSpinner,
+    PrimaryActionButtonComponent,
+    DialogComponent,
+    AsyncPipe,
+    BannerDividerComponent
+  ]
 })
 export class AccountSettingsComponent implements OnInit {
   orcid: any;

diff --git a/src/app/mydata/components/home/home.component.html b/src/app/mydata/components/home/home.component.html
@@ -3,6 +3,8 @@
  :author: CSC - IT Center for Science Ltd., Espoo Finland [email protected]
  :license: MIT -->
 
+<app-banner-divider></app-banner-divider>
+
 <main id="main-content">
   <div class="d-block d-lg-flex wrapper mx-auto justify-content-between">
     <div class="col-12 col-lg-6">

diff --git a/src/app/mydata/components/home/home.component.ts b/src/app/mydata/components/home/home.component.ts
@@ -11,21 +11,23 @@ import { UtilityService } from '@shared/services/utility.service';
 import { OidcSecurityService } from 'angular-auth-oidc-client';
 import { Router, RouterLink } from '@angular/router';
 import { NotificationService } from '@shared/services/notification.service';
-import { DialogEventsService } from '@shared/services/dialog-events.service';
-import { SecondaryButtonComponent } from '../../../shared/components/buttons/secondary-button/secondary-button.component';
+import { DialogEventsService } from '@shared/services/dialog-events.service';
+import { SecondaryButtonComponent } from '../../../shared/components/buttons/secondary-button/secondary-button.component';
 import { PrimaryActionButtonComponent } from '../../../shared/components/buttons/primary-action-button/primary-action-button.component';
+import { BannerDividerComponent } from '@shared/components/banner-divider/banner-divider.component';
 
 
-@Component({
-    selector: 'app-home',
-    templateUrl: './home.component.html',
-    styleUrls: ['./home.component.scss'],
-    standalone: true,
-    imports: [
-        PrimaryActionButtonComponent,
-        RouterLink,
-        SecondaryButtonComponent,
-    ],
+@Component({
+    selector: 'app-home',
+    templateUrl: './home.component.html',
+    styleUrls: ['./home.component.scss'],
+    standalone: true,
+  imports: [
+    PrimaryActionButtonComponent,
+    RouterLink,
+    SecondaryButtonComponent,
+    BannerDividerComponent
+  ]
 })
 export class HomeComponent implements OnInit {
   title = $localize`:@@home:Etusivu`;

diff --git a/src/app/mydata/components/mydata-terms/mydata-terms.component.html b/src/app/mydata/components/mydata-terms/mydata-terms.component.html
@@ -3,6 +3,8 @@
  :author: CSC - IT Center for Science Ltd., Espoo Finland [email protected]
  :license: MIT -->
 
+<app-banner-divider></app-banner-divider>
+
 <main id="main-content py-3" [class.py-3]="path !== 'service-deployment'">
   <div class="wrapper">
     <div

diff --git a/src/app/mydata/components/mydata-terms/mydata-terms.component.ts b/src/app/mydata/components/mydata-terms/mydata-terms.component.ts
@@ -8,15 +8,16 @@
 import { Component, Input, OnInit } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 import { AppSettingsService } from '@shared/services/app-settings.service';
-import { UtilityService } from '@shared/services/utility.service';
-import { SanitizeHtmlPipe } from '../../../shared/pipes/sanitize-html.pipe';
+import { UtilityService } from '@shared/services/utility.service';
+import { SanitizeHtmlPipe } from '../../../shared/pipes/sanitize-html.pipe';
 import { NgIf } from '@angular/common';
+import { BannerDividerComponent } from '@shared/components/banner-divider/banner-divider.component';
 
-@Component({
-    selector: 'app-mydata-terms',
-    templateUrl: './mydata-terms.component.html',
-    standalone: true,
-    imports: [NgIf, SanitizeHtmlPipe],
+@Component({
+  selector: 'app-mydata-terms',
+  templateUrl: './mydata-terms.component.html',
+  standalone: true,
+  imports: [NgIf, SanitizeHtmlPipe, BannerDividerComponent]
 })
 
 /*

diff --git a/src/app/mydata/components/profile/data-sources/data-sources.component.html b/src/app/mydata/components/profile/data-sources/data-sources.component.html
@@ -3,6 +3,8 @@
  :author: CSC - IT Center for Science Ltd., Espoo Finland [email protected]
  :license: MIT -->
 
+<app-banner-divider></app-banner-divider>
+
 <main id="main-content">
   <div class="wrapper">
     <div class="row justify-content-between py-3">

diff --git a/src/app/mydata/components/profile/data-sources/data-sources.component.ts b/src/app/mydata/components/profile/data-sources/data-sources.component.ts
@@ -17,27 +17,29 @@ import { DataSourcesTableComponent } from './data-sources-table/data-sources-tab
 import { NotificationService } from '@shared/services/notification.service';
 import { AppSettingsService } from '@shared/services/app-settings.service';
 import { FieldTypes } from '@mydata/constants/fieldTypes';
-import { clone, cloneDeep } from 'lodash-es';
-import { DataSourcesSelectionActionsComponent } from './data-sources-selection-actions/data-sources-selection-actions.component';
-import { ActiveFiltersListComponent } from '../../../../shared/components/active-filters-list/active-filters-list.component';
-import { SortByButtonComponent } from '../../../../shared/components/buttons/sort-by-button/sort-by-button.component';
-import { DataSourcesFiltersComponent } from './data-sources-filters/data-sources-filters.component';
+import { clone, cloneDeep } from 'lodash-es';
+import { DataSourcesSelectionActionsComponent } from './data-sources-selection-actions/data-sources-selection-actions.component';
+import { ActiveFiltersListComponent } from '../../../../shared/components/active-filters-list/active-filters-list.component';
+import { SortByButtonComponent } from '../../../../shared/components/buttons/sort-by-button/sort-by-button.component';
+import { DataSourcesFiltersComponent } from './data-sources-filters/data-sources-filters.component';
 import { NgTemplateOutlet, NgIf } from '@angular/common';
-
-@Component({
-    selector: 'app-data-sources',
-    templateUrl: './data-sources.component.html',
-    styleUrls: ['./data-sources.component.scss'],
-    standalone: true,
-    imports: [
-        NgTemplateOutlet,
-        DataSourcesFiltersComponent,
-        SortByButtonComponent,
-        NgIf,
-        ActiveFiltersListComponent,
-        DataSourcesTableComponent,
-        DataSourcesSelectionActionsComponent,
-    ],
+import { BannerDividerComponent } from '@shared/components/banner-divider/banner-divider.component';
+
+@Component({
+    selector: 'app-data-sources',
+    templateUrl: './data-sources.component.html',
+    styleUrls: ['./data-sources.component.scss'],
+    standalone: true,
+  imports: [
+    NgTemplateOutlet,
+    DataSourcesFiltersComponent,
+    SortByButtonComponent,
+    NgIf,
+    ActiveFiltersListComponent,
+    DataSourcesTableComponent,
+    DataSourcesSelectionActionsComponent,
+    BannerDividerComponent
+  ]
 })
 export class DataSourcesComponent implements OnInit, OnDestroy {
   orcidData: Record<string, unknown>;

diff --git a/src/app/mydata/components/profile/profile.component.html b/src/app/mydata/components/profile/profile.component.html
@@ -5,6 +5,8 @@
 
 <app-welcome-dialog *ngIf="showWelcomeDialog"></app-welcome-dialog>
 
+<app-banner-divider></app-banner-divider>
+
 <main id="main-content">
   <div class="wrapper">
     <div class="row d-flex justify-content-between pt-3 pb-5">

diff --git a/src/app/mydata/components/profile/profile.component.ts b/src/app/mydata/components/profile/profile.component.ts
@@ -34,40 +34,42 @@ import { CollaborationsService } from '@mydata/services/collaborations.service';
 import { lastValueFrom, Observable, Subject, timer, BehaviorSubject, combineLatest } from 'rxjs';
 import { cloneDeep } from 'lodash-es';
 import { Person } from '@portal/models/person/person.model';
-import { SingleItemService } from '@portal/services/single-item.service';
-import { DialogComponent } from '../../../shared/components/dialog/dialog.component';
-import { MydataBetaInfoComponent } from '../mydata-beta-info/mydata-beta-info.component';
-import { CollaborationCardComponent } from './cards/collaboration-card/collaboration-card.component';
-import { MatProgressSpinner } from '@angular/material/progress-spinner';
-import { ProfileSummaryComponent } from './profile-summary/profile-summary.component';
-import { ContactCardComponent } from './cards/contact-card/contact-card.component';
-import { DraftSummaryComponent } from './draft-summary/draft-summary.component';
-import { MatButton } from '@angular/material/button';
-import { PrimaryActionButtonComponent } from '../../../shared/components/buttons/primary-action-button/primary-action-button.component';
-import { WelcomeDialogComponent } from './welcome-dialog/welcome-dialog.component';
+import { SingleItemService } from '@portal/services/single-item.service';
+import { DialogComponent } from '../../../shared/components/dialog/dialog.component';
+import { MydataBetaInfoComponent } from '../mydata-beta-info/mydata-beta-info.component';
+import { CollaborationCardComponent } from './cards/collaboration-card/collaboration-card.component';
+import { MatProgressSpinner } from '@angular/material/progress-spinner';
+import { ProfileSummaryComponent } from './profile-summary/profile-summary.component';
+import { ContactCardComponent } from './cards/contact-card/contact-card.component';
+import { DraftSummaryComponent } from './draft-summary/draft-summary.component';
+import { MatButton } from '@angular/material/button';
+import { PrimaryActionButtonComponent } from '../../../shared/components/buttons/primary-action-button/primary-action-button.component';
+import { WelcomeDialogComponent } from './welcome-dialog/welcome-dialog.component';
 import { NgIf, AsyncPipe } from '@angular/common';
-
-@Component({
-    selector: 'app-profile',
-    templateUrl: './profile.component.html',
-    styleUrls: ['./profile.component.scss'],
-    encapsulation: ViewEncapsulation.None,
-    standalone: true,
-    imports: [
-        NgIf,
-        WelcomeDialogComponent,
-        PrimaryActionButtonComponent,
-        MatButton,
-        DraftSummaryComponent,
-        RouterLink,
-        ContactCardComponent,
-        ProfileSummaryComponent,
-        MatProgressSpinner,
-        CollaborationCardComponent,
-        MydataBetaInfoComponent,
-        DialogComponent,
-        AsyncPipe,
-    ],
+import { BannerDividerComponent } from '@shared/components/banner-divider/banner-divider.component';
+
+@Component({
+    selector: 'app-profile',
+    templateUrl: './profile.component.html',
+    styleUrls: ['./profile.component.scss'],
+    encapsulation: ViewEncapsulation.None,
+    standalone: true,
+  imports: [
+    NgIf,
+    WelcomeDialogComponent,
+    PrimaryActionButtonComponent,
+    MatButton,
+    DraftSummaryComponent,
+    RouterLink,
+    ContactCardComponent,
+    ProfileSummaryComponent,
+    MatProgressSpinner,
+    CollaborationCardComponent,
+    MydataBetaInfoComponent,
+    DialogComponent,
+    AsyncPipe,
+    BannerDividerComponent
+  ]
 })
 export class ProfileComponent implements OnInit, OnDestroy {
   @ViewChild('collaborationComponentRef') collaborationComponentRef;

diff --git a/...p/mydata/components/service-deployment/cancel-deployment/cancel-deployment.component.html b/...p/mydata/components/service-deployment/cancel-deployment/cancel-deployment.component.html
@@ -1,55 +1,57 @@
-<main id="main-content" class="col col-lg-3 mx-auto">
-  <mat-spinner
-    *ngIf="loading"
-    class="mx-auto"
-    [diameter]="80"
-    i18n-aria-label="@@loading"
-    aria-label="Ladataan"
-  ></mat-spinner>
-
-  <ng-container *ngIf="!loading">
-    <div class="row pb-4">
-      <div class="col text-center">
-        <h1 class="h4" i18n="@@cancelServiceDeployment">
-          Peruutetaanko palvelun käyttöönotto?
-        </h1>
-      </div>
-      <!-- Icon -->
-      <i class="col-12 pt-3 h1 primary-color text-center fas fa-undo-alt"></i>
-    </div>
-
-    <div class="row pb-4 d-flex justify-content-center">
-      <div class="col">
-        <p>
-          <ng-container i18n="@@deploymentAbort">
-            Käyttöönotto keskeytetään, ja mitään tietoja ei tallenneta.
-          </ng-container>
-        </p>
-      </div>
-    </div>
-
-    <div class="row pb-3 d-flex justify-content-center">
-      <div class="col">
-        <app-secondary-button
-          i18n-content="@@yesCancelDeployment"
-          content="	Kyllä, peruuta käyttöönotto"
-          tabindex="-1"
-          [big]="true"
-          (click)="cancelDeployment()"
-        >
-        </app-secondary-button>
-      </div>
-    </div>
-    <div class="row d-flex justify-content-center">
-      <div class="col">
-        <app-secondary-button
-          i18n-content="@@noContinueDeployment"
-          content="Ei, jatkan käyttöönottoa"
-          [big]="true"
-          (click)="continueDeployment()"
-        >
-        </app-secondary-button>
-      </div>
-    </div>
-  </ng-container>
-</main>
+<app-banner-divider></app-banner-divider>
+
+<main id="main-content" class="col col-lg-3 mx-auto">
+  <mat-spinner
+    *ngIf="loading"
+    class="mx-auto"
+    [diameter]="80"
+    i18n-aria-label="@@loading"
+    aria-label="Ladataan"
+  ></mat-spinner>
+
+  <ng-container *ngIf="!loading">
+    <div class="row pb-4">
+      <div class="col text-center">
+        <h1 class="h4" i18n="@@cancelServiceDeployment">
+          Peruutetaanko palvelun käyttöönotto?
+        </h1>
+      </div>
+      <!-- Icon -->
+      <i class="col-12 pt-3 h1 primary-color text-center fas fa-undo-alt"></i>
+    </div>
+
+    <div class="row pb-4 d-flex justify-content-center">
+      <div class="col">
+        <p>
+          <ng-container i18n="@@deploymentAbort">
+            Käyttöönotto keskeytetään, ja mitään tietoja ei tallenneta.
+          </ng-container>
+        </p>
+      </div>
+    </div>
+
+    <div class="row pb-3 d-flex justify-content-center">
+      <div class="col">
+        <app-secondary-button
+          i18n-content="@@yesCancelDeployment"
+          content="	Kyllä, peruuta käyttöönotto"
+          tabindex="-1"
+          [big]="true"
+          (click)="cancelDeployment()"
+        >
+        </app-secondary-button>
+      </div>
+    </div>
+    <div class="row d-flex justify-content-center">
+      <div class="col">
+        <app-secondary-button
+          i18n-content="@@noContinueDeployment"
+          content="Ei, jatkan käyttöönottoa"
+          [big]="true"
+          (click)="continueDeployment()"
+        >
+        </app-secondary-button>
+      </div>
+    </div>
+  </ng-container>
+</main>