diff --git a/src/app/_layout/app-footer/_app-footer-theme.scss b/src/app/_layout/app-footer/_app-footer-theme.scss
new file mode 100644
index 000000000..bde2fc9ee
--- /dev/null
+++ b/src/app/_layout/app-footer/_app-footer-theme.scss
@@ -0,0 +1,36 @@
+@use "@angular/material" as mat;
+@use "sass:map";
+
+@mixin color($theme) {
+ $color-config: map.get($theme, "color");
+ $primary: map.get($color-config, "primary");
+
+ .footer {
+ background-color: mat.m2-get-color-from-palette($primary, "default-contrast");
+ color: mat.m2-get-color-from-palette($primary);
+
+ a,
+ .toplink,
+ .footer-copy,
+ mat-icon {
+ color: mat.m2-get-color-from-palette($primary);
+
+ }
+
+ mat-toolbar {
+ background-color: mat.m2-get-color-from-palette($primary, "darker");
+ }
+
+ a {
+ color: mat.m2-get-color-from-palette($primary, "default-contrast");
+ }
+ }
+}
+
+@mixin theme($theme) {
+
+ // Check if the 'color' key exists in the theme map
+ @if map.has-key($theme, "color") {
+ @include color($theme);
+ }
+}
diff --git a/src/app/_layout/app-footer/app-footer.component.html b/src/app/_layout/app-footer/app-footer.component.html
new file mode 100644
index 000000000..f66a91b5e
--- /dev/null
+++ b/src/app/_layout/app-footer/app-footer.component.html
@@ -0,0 +1,33 @@
+
diff --git a/src/app/_layout/app-footer/app-footer.component.scss b/src/app/_layout/app-footer/app-footer.component.scss
new file mode 100644
index 000000000..405a4ad43
--- /dev/null
+++ b/src/app/_layout/app-footer/app-footer.component.scss
@@ -0,0 +1,27 @@
+.footer {
+ // background: white;
+ // width: 100%;
+ // padding: 1rem;
+ // text-align: center;
+
+ background-color: white;
+
+ mat-toolbar {
+ background: white !important;
+ height: 3.5rem;
+
+ .spacer {
+ flex: 1 1 auto;
+ }
+
+ .toplink {
+ padding: 0.5rem 1rem;
+ font: bold;
+ font-size: 11pt;
+
+ mat-icon {
+ vertical-align: middle;
+ }
+ }
+ }
+}
diff --git a/src/app/_layout/app-footer/app-footer.component.spec.ts b/src/app/_layout/app-footer/app-footer.component.spec.ts
new file mode 100644
index 000000000..c5dc558d4
--- /dev/null
+++ b/src/app/_layout/app-footer/app-footer.component.spec.ts
@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AppFooterComponent } from './app-footer.component';
+
+describe('AppFooterComponent', () => {
+ let component: AppFooterComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ declarations: [AppFooterComponent]
+ });
+ fixture = TestBed.createComponent(AppFooterComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/_layout/app-footer/app-footer.component.ts b/src/app/_layout/app-footer/app-footer.component.ts
new file mode 100644
index 000000000..b95f940a0
--- /dev/null
+++ b/src/app/_layout/app-footer/app-footer.component.ts
@@ -0,0 +1,24 @@
+import { Component, OnInit } from "@angular/core";
+import { AppConfigService } from "app-config.service";
+
+@Component({
+ selector: "app-app-footer",
+ templateUrl: "./app-footer.component.html",
+ styleUrls: ["./app-footer.component.scss"],
+ standalone: false,
+})
+export class AppFooterComponent implements OnInit {
+ appConfig = this.appConfigService.getConfig();
+
+ imprintUrl = "";
+ privacyUrl = "";
+
+ constructor(public appConfigService: AppConfigService) { }
+
+ ngOnInit() {
+ this.imprintUrl =
+ this.appConfig.imprintUrl || "https://example.com/imprint";
+ this.privacyUrl =
+ this.appConfig.privacyUrl || "https://example.com/privacy";
+ }
+}
diff --git a/src/app/_layout/app-layout/app-layout.component.html b/src/app/_layout/app-layout/app-layout.component.html
index 22e872007..343229592 100644
--- a/src/app/_layout/app-layout/app-layout.component.html
+++ b/src/app/_layout/app-layout/app-layout.component.html
@@ -3,4 +3,5 @@
+
diff --git a/src/app/_layout/layout.module.ts b/src/app/_layout/layout.module.ts
index d9ed0af58..a3f6a570f 100644
--- a/src/app/_layout/layout.module.ts
+++ b/src/app/_layout/layout.module.ts
@@ -12,12 +12,14 @@ import { AppMainLayoutComponent } from "./app-main-layout/app-main-layout.compon
import { BatchCardModule } from "datasets/batch-card/batch-card.module";
import { BreadcrumbModule } from "shared/modules/breadcrumb/breadcrumb.module";
import { UsersModule } from "../users/users.module";
+import { AppFooterComponent } from './app-footer/app-footer.component';
@NgModule({
declarations: [
AppLayoutComponent,
AppHeaderComponent,
AppMainLayoutComponent,
+ AppFooterComponent,
],
imports: [
CommonModule,
@@ -33,4 +35,4 @@ import { UsersModule } from "../users/users.module";
],
exports: [],
})
-export class LayoutModule {}
+export class LayoutModule { }
diff --git a/src/app/app-config.service.spec.ts b/src/app/app-config.service.spec.ts
index 8ca39f261..5325d16d4 100644
--- a/src/app/app-config.service.spec.ts
+++ b/src/app/app-config.service.spec.ts
@@ -55,6 +55,8 @@ const appConfig: AppConfigInterface = {
multipleDownloadAction: "http://localhost:3012/zip",
multipleDownloadEnabled: true,
multipleDownloadUseAuthToken: false,
+ imprintUrl = "https://example.com/imprint",
+ privacyUrl = "https://example.com/privacy",
oAuth2Endpoints: [],
policiesEnabled: true,
retrieveDestinations: [],
diff --git a/src/app/app-config.service.ts b/src/app/app-config.service.ts
index e20f86898..0eda705d3 100644
--- a/src/app/app-config.service.ts
+++ b/src/app/app-config.service.ts
@@ -143,6 +143,8 @@ export interface AppConfigInterface {
mainMenu?: MainMenuConfiguration;
supportEmail?: string;
checkBoxFilterClickTrigger?: boolean;
+ imprintUrl?: string;
+ privacyUrl?: string;
}
function isMainPageConfiguration(obj: any): obj is MainPageConfiguration {
diff --git a/src/styles.scss b/src/styles.scss
index b21134000..32a5b5cd2 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -4,6 +4,7 @@
@use "@angular/material" as mat;
@use "./app/app-theme" as app;
@use "./app/_layout/app-header/app-header-theme" as app-header;
+@use "./app/_layout/app-footer/app-footer-theme" as app-footer;
@use "./app/datasets/batch-view/batch-view-theme" as batch-view;
@use "./app/datasets/dashboard/dashboard-theme" as dashboard;
@use "./app/datasets/datafiles/datafiles-theme" as datafiles;
@@ -229,6 +230,7 @@ $theme: map.merge(
@include mat.all-component-themes($theme);
@include app.theme($theme);
@include app-header.theme($theme);
+@include app-footer.theme($theme);
@include batch-view.theme($theme);
@include dashboard.theme($theme);
@include datafiles.theme($theme);