style: Align Landingpage To Designguide (#462)

* split two footers * use the dark red * add solution footer to ahb-landing page * add solution footer back to the ahb-page * Improve user hint * remove shadow and border and set right color * apply prettier * upgrade style submodule * Update src/app/features/ahbs/views/ahb-landing-page/ahb-landing-page.component.html Co-authored-by: konstantin <[email protected]> --------- Co-authored-by: konstantin <[email protected]>
Hochfrequenz · Feb 18, 2025 · e66c942 · e66c942
1 parent 974414e
commit e66c942
Show file tree

Hide file tree

Showing 11 changed files with 47 additions and 11 deletions.
diff --git a/src/app/features/ahbs/views/ahb-landing-page/ahb-landing-page.component.html b/src/app/features/ahbs/views/ahb-landing-page/ahb-landing-page.component.html
@@ -45,14 +45,15 @@
             <div>
               <p class="text-sm text-hf-weiches-schwarz font-medium">Prüfidentifikator angeben</p>
               <p class="text-sm text-hf-weiches-schwarz mt-1 opacity-75">
-                Sie können einen Prüfidentifikator oder den Namen eines Prüfidentifikators eingeben.
+                Prüfidentifikator oder den Namen eines Prüfidentifikators eingeben
               </p>
             </div>
           </div>
         </div>
       </div>
     </div>
   </div>
+  <app-solutions-footer></app-solutions-footer>
   <app-footer>
     <span class="block p-3">&nbsp;</span>
   </app-footer>

diff --git a/src/app/features/ahbs/views/ahb-landing-page/ahb-landing-page.component.ts b/src/app/features/ahbs/views/ahb-landing-page/ahb-landing-page.component.ts
@@ -1,6 +1,7 @@
 import { Component } from '@angular/core';
 import { HeaderComponent } from '../../../../shared/components/header/header.component';
 import { FooterComponent } from '../../../../shared/components/footer/footer.component';
+import { SolutionsFooterComponent } from '../../../../shared/components/solutions-footer/solutions-footer.component';
 import {
   FormControl,
   FormGroup,
@@ -22,6 +23,7 @@ import { InputSearchEnhancedComponent } from '../../../../shared/components/inpu
     ReactiveFormsModule,
     AhbSearchFormHeaderComponent,
     InputSearchEnhancedComponent,
+    SolutionsFooterComponent,
   ],
   templateUrl: './ahb-landing-page.component.html',
 })

diff --git a/src/app/features/ahbs/views/ahb-page/ahb-page.component.html b/src/app/features/ahbs/views/ahb-page/ahb-page.component.html
@@ -73,5 +73,6 @@ <h3 class="font-bold text-[20px]">
   </div>
 
   <!-- Fixed Footer -->
+  <app-solutions-footer class="flex-none"></app-solutions-footer>
   <app-footer class="flex-none" />
 </div>
diff --git a/src/app/features/ahbs/views/ahb-page/ahb-page.component.ts b/src/app/features/ahbs/views/ahb-page/ahb-page.component.ts
@@ -10,6 +10,7 @@ import {
 } from '@angular/core';
 import { HeaderComponent } from '../../../../shared/components/header/header.component';
 import { FooterComponent } from '../../../../shared/components/footer/footer.component';
+import { SolutionsFooterComponent } from '../../../../shared/components/solutions-footer/solutions-footer.component';
 import { ActivatedRoute, Router } from '@angular/router';
 import { AhbTableComponent } from '../../components/ahb-table/ahb-table.component';
 import { Ahb, AhbService } from '../../../../core/api';
@@ -30,6 +31,7 @@ import { FallbackPageComponent } from '../../../../shared/components/fallback-pa
     ReactiveFormsModule,
     HeaderComponent,
     FooterComponent,
+    SolutionsFooterComponent,
     AhbTableComponent,
     CommonModule,
     AhbSearchFormHeaderComponent,

diff --git a/src/app/features/landingpage/views/landing-page/landing-page.component.html b/src/app/features/landingpage/views/landing-page/landing-page.component.html
@@ -1,7 +1,6 @@
 <div class="min-h-screen flex flex-col">
   <section class="bg-hf-grell-rot flex-grow flex items-center justify-center">
-    <div
-      class="rounded-3xl w-1/3 bg-tint p-12 shadow-lg transition-all duration-300 ring-1 ring-black/5 hover:ring-black/10 relative before:absolute before:inset-0 before:rounded-3xl before:shadow-[inset_0_1px_2px_rgba(255,255,255,0.4)] before:pointer-events-none after:absolute after:inset-0 after:rounded-3xl after:shadow-[inset_0_-2px_4px_rgba(0,0,0,0.1)] after:pointer-events-none">
+    <div class="rounded-3xl w-1/3 bg-hf-pastell-rot p-12 transition-all duration-300">
       <h1 class="text-3xl text-hf-weiches-schwarz pb-5">AHB Tabellen</h1>
       <h2
         class="text-lg border-b border-hf-weiches-schwarz text-hf-weiches-schwarz pb-3 mb-5 uppercase">

diff --git a/src/app/shared/components/footer/footer.component.html b/src/app/shared/components/footer/footer.component.html
@@ -1,11 +1,5 @@
 <div class="w-full">
-  <footer id="solutions" class="flex bg-white justify-center flex-wrap py-2">
-    <a class="ahbesser" href="https://ahb-tabellen.hochfrequenz.de">AHB-Tabellen</a>
-    <a class="fristenkalender" href="https://fristenkalender.hochfrequenz.de">Fristenkalender</a>
-    <a class="ahahnb" href="https://bedingungsbaum.hochfrequenz.de">Bedingungsbaum</a>
-    <a class="entscheidungsbaum" href="https://ebd.hochfrequenz.de">Entscheidungsbaumdiagramm</a>
-  </footer>
-  <footer class="flex items-center bg-hf-grell-rot px-3 py-2">
+  <footer class="flex items-center bg-hf-dunkel-rot px-3 py-2">
     <div class="flex-none">
       <a href="https://www.hochfrequenz.de/" target="_blank" rel="noopener noreferrer">
         <img

diff --git a/src/app/shared/components/solutions-footer/solutions-footer.component.html b/src/app/shared/components/solutions-footer/solutions-footer.component.html
@@ -0,0 +1,6 @@
+<footer id="solutions" class="flex bg-white justify-center flex-wrap py-2">
+  <a class="ahbesser" href="https://ahb-tabellen.hochfrequenz.de">AHB-Tabellen</a>
+  <a class="fristenkalender" href="https://fristenkalender.hochfrequenz.de">Fristenkalender</a>
+  <a class="ahahnb" href="https://bedingungsbaum.hochfrequenz.de">Bedingungsbaum</a>
+  <a class="entscheidungsbaum" href="https://ebd.hochfrequenz.de">Entscheidungsbaumdiagramm</a>
+</footer>
diff --git a/src/app/shared/components/solutions-footer/solutions-footer.component.scss b/src/app/shared/components/solutions-footer/solutions-footer.component.scss
diff --git a/src/app/shared/components/solutions-footer/solutions-footer.component.spec.ts b/src/app/shared/components/solutions-footer/solutions-footer.component.spec.ts
@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SolutionsFooterComponent } from './solutions-footer.component';
+
+describe('SolutionsFooterComponent', () => {
+  let component: SolutionsFooterComponent;
+  let fixture: ComponentFixture<SolutionsFooterComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [SolutionsFooterComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(SolutionsFooterComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/shared/components/solutions-footer/solutions-footer.component.ts b/src/app/shared/components/solutions-footer/solutions-footer.component.ts
@@ -0,0 +1,9 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-solutions-footer',
+  imports: [],
+  templateUrl: './solutions-footer.component.html',
+  styleUrl: './solutions-footer.component.scss',
+})
+export class SolutionsFooterComponent {}
diff --git a/src/assets/companystylesheet b/src/assets/companystylesheet