Crawler/Dockerfile

@@ -1,10 +1,10 @@
 # Base image
-FROM python:3.9.5-buster
+FROM python
 
 # Create directories and copy files
 RUN echo 'Creating directory and copying files'
 RUN mkdir /crawler
-COPY . /crawler
+ADD . /crawler
 WORKDIR /crawler
 
 # Install dependencies

Frontend/package.json

@@ -7,8 +7,7 @@
         "build": "ng build",
         "test": "ng test",
         "lint": "ng lint",
-        "e2e": "ng e2e",
+        "e2e": "ng e2e"
-        "postinstall": "ngcc"
     },
     "private": true,
     "dependencies": {

Frontend/src/app/app.component.css

@@ -1,9 +1 @@
-.wrapper_app {
+
-    padding-bottom: 2.5rem;    /* Footer height */
-}
-.footer_app {
-    position: relative;
-    bottom: 0;
-    width: 100%;
-    height: 2.5rem;            /* Footer height */
-}

Frontend/src/app/app.component.html

@@ -1,8 +1,13 @@
-<router-outlet></router-outlet>
+<div class="container">
-
+    <div class="header">
-
+        <app-top-bar></app-top-bar>
-
+    </div>
-
+    <div class="page-content">
-
+        <router-outlet></router-outlet>
+    </div>
+    <div class="footer">
+        <app-bottom-bar></app-bottom-bar>
+    </div>
+</div>
 
 

Frontend/src/app/app.module.ts

@@ -13,7 +13,7 @@ import {NgApexchartsModule} from 'ng-apexcharts';
 import {ProductSearchPageComponent} from './pages/product-search-page/product-search-page.component';
 import {HeaderComponent} from './components/header/header.component';
 import {NewestPricesListComponent} from './components/newest-prices-list/newest-prices-list.component';
-import {FormsModule, ReactiveFormsModule} from '@angular/forms';
+import {FormsModule} from '@angular/forms';
 import {PageNotFoundPageComponent} from './pages/page-not-found-page/page-not-found-page.component';
 import {MatMenuModule} from '@angular/material/menu';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
@@ -31,13 +31,7 @@ import {MatListModule} from "@angular/material/list";
 import {BottomBarComponent} from './components/bottom-bar/bottom-bar.component';
 import { HotDealsWidgetComponent } from './components/hot-deals-widget/hot-deals-widget.component';
 import { SliderForProductsComponent } from './components/slider-for-products/slider-for-products.component';
-import { RegistrationComponent } from './components/auth/registration/registration.component';
+
-import { MatCardModule } from "@angular/material/card";
-import {SigninComponent} from "./components/auth/signin/signin.component";
-import { CopyrightComponent } from './components/copyright/copyright.component';
-import { GreetingInfoSliderComponent } from './components/greeting-info-slider/greeting-info-slider.component';
-import { KundenComponent } from './components/kunden/kunden.component';
-import { AboutUsComponent } from './components/about-us/about-us.component';
 
 // For cookie popup
 const cookieConfig: NgcCookieConsentConfig = {
@@ -95,13 +89,7 @@ const cookieConfig: NgcCookieConsentConfig = {
         TopBarComponent,
         BottomBarComponent,
         HotDealsWidgetComponent,
-        SliderForProductsComponent,
+        SliderForProductsComponent
-        RegistrationComponent,
-        SigninComponent,
-        CopyrightComponent,
-        GreetingInfoSliderComponent,
-        KundenComponent,
-        AboutUsComponent,
     ],
     imports: [
         BrowserModule,
@@ -122,8 +110,6 @@ const cookieConfig: NgcCookieConsentConfig = {
         RouterModule.forRoot([
             {path: '', component: LandingpageComponent},
         ]),
-        MatCardModule,
-        ReactiveFormsModule,
     ],
     providers: [],
     bootstrap: [AppComponent]

Frontend/src/app/app.routing.ts

@@ -9,8 +9,6 @@ import {ProductSearchPageComponent} from './pages/product-search-page/product-se
 import {PageNotFoundPageComponent} from './pages/page-not-found-page/page-not-found-page.component';
 import {ImprintComponent} from './pages/imprint/imprint.component';
 import {PrivacyComponent} from './pages/privacy/privacy.component';
-import {SigninComponent} from "./components/auth/signin/signin.component";
-import {RegistrationComponent} from "./components/auth/registration/registration.component";
 
 const routes: Routes = [
     {path: '', component: LandingpageComponent, pathMatch: 'full'},
@@ -18,9 +16,6 @@ const routes: Routes = [
     {path: 'product/:id', component: ProductDetailPageComponent},
     {path: 'impressum', component: ImprintComponent},
     {path: 'datenschutz', component: PrivacyComponent},
-    {path: 'signin', component: SigninComponent},
-    {path: 'registration', component: RegistrationComponent},
-    {path: "product-detail", component: ProductDetailPageComponent},
     {path: '**', component: PageNotFoundPageComponent}
 ];
 

Frontend/src/app/components/about-us/about-us.component.html

@@ -1,17 +0,0 @@
-<section class="page-section bg-primary text-white mb-0" id="about">
-    <div class="container">
-        <!-- About Section Heading-->
-        <h2 class="page-section-heading text-center text-uppercase text-white">About</h2>
-        <!-- Icon Divider-->
-        <div class="divider-custom divider-light">
-            <div class="divider-custom-line"></div>
-            <div class="divider-custom-icon"><i class="fas fa-star"></i></div>
-            <div class="divider-custom-line"></div>
-        </div>
-        <!-- About Section Content-->
-        <div class="row">
-            <div class="col-lg-4 ms-auto"><p class="lead">text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries</p></div>
-            <div class="col-lg-4 me-auto"><p class="lead">text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries</p></div>
-        </div>
-    </div>
-</section>

Frontend/src/app/components/about-us/about-us.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { AboutUsComponent } from './about-us.component';
-
-describe('AboutUsComponent', () => {
-  let component: AboutUsComponent;
-  let fixture: ComponentFixture<AboutUsComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ AboutUsComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(AboutUsComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

Frontend/src/app/components/about-us/about-us.component.ts

@@ -1,15 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-about-us',
-  templateUrl: './about-us.component.html',
-  styleUrls: ['./about-us.component.css']
-})
-export class AboutUsComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit(): void {
-  }
-
-}

Frontend/src/app/components/auth/auth-routing.module.ts

@@ -1,26 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-import {RegistrationComponent} from "./registration/registration.component";
-import {SigninComponent} from "./signin/signin.component";
-import {ResetpasswortComponent} from "./resetpasswort/resetpasswort.component";
-
-const routes: Routes = [
-    {
-        path: 'registration',
-        component: RegistrationComponent
-    },
-    {
-        path: 'signin',
-        component: SigninComponent
-    },
-    {
-        path: 'resetpasswort',
-        component: ResetpasswortComponent
-    },
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class AuthRoutingModule { }

Frontend/src/app/components/auth/auth.module.ts

@@ -1,22 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { AuthRoutingModule } from './auth-routing.module';
-import { SigninComponent } from "./signin/signin.component";
-import { RegistrationComponent } from './registration/registration.component';
-import { ResetpasswortComponent } from './resetpasswort/resetpasswort.component';
-
-
-@NgModule({
-  declarations: [SigninComponent, RegistrationComponent, ResetpasswortComponent],
-  imports: [
-    CommonModule,
-    AuthRoutingModule,
-  ],
-  exports: [
-      SigninComponent,
-      RegistrationComponent,
-      ResetpasswortComponent,
-  ],
-})
-export class AuthModule { }

Frontend/src/app/components/auth/registration/registration.component.css

@@ -1,76 +0,0 @@
-.main-content{
-    width: 50%;
-    border-radius: 20px;
-    box-shadow: 0 5px 5px rgba(0,0,0,.4);
-    margin: 5em auto;
-    display: flex;
-}
-.company__info{
-    background-color: #008080;
-    border-top-left-radius: 20px;
-    border-bottom-left-radius: 20px;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    color: #fff;
-}
-.fa-android{
-    font-size:3em;
-}
-@media screen and (max-width: 640px) {
-    .main-content{width: 90%;}
-    .company__info{
-        display: none;
-    }
-    .login_form{
-        border-top-left-radius:20px;
-        border-bottom-left-radius:20px;
-    }
-}
-@media screen and (min-width: 642px) and (max-width:800px){
-    .main-content{width: 70%;}
-}
-.row > h2{
-    color:#008080;
-}
-.login_form{
-    background-color: #fff;
-    border-top-right-radius:20px;
-    border-bottom-right-radius:20px;
-    border-top:1px solid #ccc;
-    border-right:1px solid #ccc;
-}
-form{
-    padding: 0 2em;
-}
-.form__input{
-    width: 100%;
-    border:0px solid transparent;
-    border-radius: 0;
-    border-bottom: 1px solid #aaa;
-    padding: 1em .5em .5em;
-    padding-left: 2em;
-    outline:none;
-    margin:1.5em auto;
-    transition: all .5s ease;
-}
-.form__input:focus{
-    border-bottom-color: #008080;
-    box-shadow: 0 0 5px rgba(0,80,80,.4);
-    border-radius: 4px;
-}
-.btn_signin{
-    transition: all .5s ease;
-    width: 70%;
-    border-radius: 30px;
-    color:#008080;
-    font-weight: 600;
-    background-color: #fff;
-    border: 1px solid #008080;
-    margin-top: 1.5em;
-    margin-bottom: 1em;
-}
-.btn_signin:hover, .btn:focus{
-    background-color: #008080;
-    color:#fff;
-}

Frontend/src/app/components/auth/registration/registration.component.html

@@ -1,40 +0,0 @@
-<div class="container">
-    <div class="row main-content bg-success text-center">
-        <div class="col-md-4 text-center company__info">
-            <span class="company__logo" routerLink=""><h2><img src="assets/images/Betterzon.svg"></h2></span>
-        </div>
-        <div class="col-md-8 col-xs-12 col-sm-12 login_form ">
-            <div class="container-fluid">
-                <div class="row">
-                    <h2>Konto erstellen</h2>
-                </div>
-                <div class="row">
-                    <form control="" class="form-group">
-                        <div class="row">
-                            <input type="text" name="username" id="username" class="form__input" placeholder="Nickname">
-                        </div>
-                        <div class="row">
-                            <!-- <span class="fa fa-lock"></span> -->
-                            <input type="password" name="password" id="email" class="form__input" placeholder= "E-Mail">
-                        </div>
-                        <div class="row">
-                            <!-- <span class="fa fa-lock"></span> -->
-                            <input type="password" name="password" id="password" class="form__input" placeholder="Kennwort erstellen">
-                        </div>
-                        <div class="row">
-                            <!-- <span class="fa fa-lock"></span> -->
-                            <input type="password" name="password" id="password_repeated" class="form__input" placeholder="Kennwort bestätigen">
-                        </div>
-                        <div class="row">
-                            <input type="submit" value="Erstellen" class="btn_signin">
-                        </div>
-                        <div class="row">
-                            <p>Haben Sie bereits ein Konto?<a href="/signin">Sich anmelden</a></p>
-                        </div>
-                    </form>
-                </div>
-            </div>
-        </div>
-    </div>
-</div>
-

Frontend/src/app/components/auth/registration/registration.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { RegistrationComponent } from './registration.component';
-
-describe('RegistrationComponent', () => {
-  let component: RegistrationComponent;
-  let fixture: ComponentFixture<RegistrationComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ RegistrationComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(RegistrationComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

Frontend/src/app/components/auth/registration/registration.component.ts

@@ -1,15 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-registration',
-  templateUrl: './registration.component.html',
-  styleUrls: ['./registration.component.css']
-})
-export class RegistrationComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit(): void {
-  }
-
-}

Frontend/src/app/components/auth/resetpasswort/resetpasswort.component.html

@@ -1 +0,0 @@
-<p>resetpasswort works!</p>

Frontend/src/app/components/auth/resetpasswort/resetpasswort.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { ResetpasswortComponent } from './resetpasswort.component';
-
-describe('ResetpasswortComponent', () => {
-  let component: ResetpasswortComponent;
-  let fixture: ComponentFixture<ResetpasswortComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ ResetpasswortComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(ResetpasswortComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

Frontend/src/app/components/auth/resetpasswort/resetpasswort.component.ts

@@ -1,15 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-resetpasswort',
-  templateUrl: './resetpasswort.component.html',
-  styleUrls: ['./resetpasswort.component.css']
-})
-export class ResetpasswortComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit(): void {
-  }
-
-}

Frontend/src/app/components/auth/signin/signin.component.css

@@ -1,76 +0,0 @@
-.main-content{
-    width: 50%;
-    border-radius: 20px;
-    box-shadow: 0 5px 5px rgba(0,0,0,.4);
-    margin: 5em auto;
-    display: flex;
-}
-.company__info{
-    background-color: #008080;
-    border-top-left-radius: 20px;
-    border-bottom-left-radius: 20px;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    color: #fff;
-}
-.fa-android{
-    font-size:3em;
-}
-@media screen and (max-width: 640px) {
-    .main-content{width: 90%;}
-    .company__info{
-        display: none;
-    }
-    .login_form{
-        border-top-left-radius:20px;
-        border-bottom-left-radius:20px;
-    }
-}
-@media screen and (min-width: 642px) and (max-width:800px){
-    .main-content{width: 70%;}
-}
-.row > h2{
-    color:#008080;
-}
-.login_form{
-    background-color: #fff;
-    border-top-right-radius:20px;
-    border-bottom-right-radius:20px;
-    border-top:1px solid #ccc;
-    border-right:1px solid #ccc;
-}
-form{
-    padding: 0 2em;
-}
-.form__input{
-    width: 100%;
-    border:0px solid transparent;
-    border-radius: 0;
-    border-bottom: 1px solid #aaa;
-    padding: 1em .5em .5em;
-    padding-left: 2em;
-    outline:none;
-    margin:1.5em auto;
-    transition: all .5s ease;
-}
-.form__input:focus{
-    border-bottom-color: #008080;
-    box-shadow: 0 0 5px rgba(0,80,80,.4);
-    border-radius: 4px;
-}
-.btn_signin{
-    transition: all .5s ease;
-    width: 70%;
-    border-radius: 30px;
-    color:#008080;
-    font-weight: 600;
-    background-color: #fff;
-    border: 1px solid #008080;
-    margin-top: 1.5em;
-    margin-bottom: 1em;
-}
-.btn_signin:hover, .btn:focus{
-    background-color: #008080;
-    color:#fff;
-}

Frontend/src/app/components/auth/signin/signin.component.html

@@ -1,34 +0,0 @@
-<div class="container">
-    <div class="row main-content bg-success text-center">
-        <div class="col-md-4 text-center company__info">
-            <span class="company__logo" routerLink=""><h2><img src="assets/images/Betterzon.svg"></h2></span>
-        </div>
-        <div class="col-md-8 col-xs-12 col-sm-12 login_form ">
-            <div class="container-fluid">
-                <div class="row">
-                    <h2>Anmelden</h2>
-                </div>
-                <div class="row">
-                    <form control="" class="form-group">
-                        <div class="row">
-                            <input type="text" name="username" id="username" class="form__input" placeholder="Username">
-                        </div>
-                        <div class="row">
-                            <!-- <span class="fa fa-lock"></span> -->
-                            <input type="password" name="password" id="password" class="form__input" placeholder="Password">
-                        </div>
-                        <div class="row">
-                            <input type="submit" value="Anmelden" class="btn_signin">
-                        </div>
-                    </form>
-                </div>
-                <div class="row">
-                    <p>Noch kein Konto?<a href="/registration">Konto erstellen</a></p>
-                </div>
-            </div>
-        </div>
-    </div>
-</div>
-
-
-

Frontend/src/app/components/auth/signin/signin.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { SigninComponent } from './signin.component';
-
-describe('SigninComponent', () => {
-  let component: SigninComponent;
-  let fixture: ComponentFixture<SigninComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ SigninComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(SigninComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

Frontend/src/app/components/auth/signin/signin.component.ts

@@ -1,19 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-    selector: 'app-signin',
-    templateUrl: './signin.component.html',
-    styleUrls: ['./signin.component.css']
-})
-
-export class SigninComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit(): void {
-  }
-
-    onSubmit() {
-
-    }
-}

Frontend/src/app/components/bottom-bar/bottom-bar.component.html

@@ -1,31 +1,26 @@
-<footer class="footer text-center">
+<div class="bottom-bar-wrapper">
-    <div class="container">
+    <div class="folge-uns-item">
-        <div class="row">
+        <p><span id="folge">FOLGE</span><span id="uns">UNS</span></p>
-            <!-- Footer Location-->
-            <div class="col-lg-4 mb-5 mb-lg-0">
-                <h4 class="text-uppercase mb-4">Location</h4>
-                <p class="lead mb-0">
-                    70376 Stuttgart
-                    <br />
-
-                </p>
-            </div>
-            <!-- Footer Social Icons-->
-            <div class="col-lg-4 mb-5 mb-lg-0">
-                <h4 class="text-uppercase mb-4">FOLGE UNS</h4>
-                <a class="btn btn-outline-light btn-social mx-1" href="#!"><i class="fab fa-fw fa-github"></i></a>
-                <a class="btn btn-outline-light btn-social mx-1" href="#!"><i class="fab fa-fw fa-twitter"></i></a>
-                <a class="btn btn-outline-light btn-social mx-1" href="#!"><i class="fab fa-fw fa-linkedin-in"></i></a>
-                <a class="btn btn-outline-light btn-social mx-1" href="#!"><i class="fab fa-fw fa-dribbble"></i></a>
-            </div>
-            <!-- Footer About Text-->
-            <div class="col-lg-4">
-                <h4 class="text-uppercase mb-4">SOME INFO</h4>
-                <p class="lead mb-0">
-                    text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
-                </p>
-            </div>
-        </div>
     </div>
-</footer>
+    <div class="link-items">
+        <ul style="list-style-type:none" class="footer-links">
+            <li><a href="https://github.com/Mueller-Patrick/Betterzon">GiT</a></li>
+            <li><a href="https://blog.betterzon.xyz/">BLOG</a></li>
+            <li><a href="https://github.com/Mueller-Patrick/Betterzon/wiki">Wiki</a></li>
+        </ul>
+    </div>
+    <div id="footer-line">
+
+    </div>
+    <div class="bottom-logo">
+        <p><span id="better">BETTER</span><span id="zon">ZON</span></p>
+    </div>
+    <div class="bottom-info">
+        <ul style="list-style-type:none" class="footer-links">
+            <li><a>DATENSCHUTZERKLÄRUNG</a></li>
+            <li><a>IMPRESSUM</a></li>
+        </ul>
+    </div>
+</div>
+
 

Frontend/src/app/components/copyright/copyright.component.html

@@ -1,3 +0,0 @@
-<div class="copyright py-4 text-center text-white">
-    <div class="container"><small>Copyright &copy; Your Website 2021</small></div>
-</div>

Frontend/src/app/components/copyright/copyright.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { CopyrightComponent } from './copyright.component';
-
-describe('CopyrightComponent', () => {
-  let component: CopyrightComponent;
-  let fixture: ComponentFixture<CopyrightComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ CopyrightComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(CopyrightComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

Frontend/src/app/components/copyright/copyright.component.ts

@@ -1,15 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-copyright',
-  templateUrl: './copyright.component.html',
-  styleUrls: ['./copyright.component.css']
-})
-export class CopyrightComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit(): void {
-  }
-
-}

Frontend/src/app/components/greeting-info-slider/greeting-info-slider.component.html

@@ -1,16 +0,0 @@
-<header class="masthead bg-primary text-white text-center">
-    <div class="container d-flex align-items-center flex-column">
-        <!-- Masthead Avatar Image-->
-        <img class="masthead-avatar mb-5" src="assets/images/Betterzon.svg" alt="..." />
-        <!-- Masthead Heading-->
-        <h1 class="masthead-heading text-uppercase mb-0"></h1>
-        <!-- Icon Divider-->
-        <div class="divider-custom divider-light">
-            <div class="divider-custom-line"></div>
-            <div class="divider-custom-icon"><i class="fas fa-star"></i></div>
-            <div class="divider-custom-line"></div>
-        </div>
-        <!-- Masthead Subheading-->
-        <p class="masthead-subheading font-weight-light mb-0"></p>
-    </div>
-</header>

Frontend/src/app/components/greeting-info-slider/greeting-info-slider.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { GreetingInfoSliderComponent } from './greeting-info-slider.component';
-
-describe('GreetingInfoSliderComponent', () => {
-  let component: GreetingInfoSliderComponent;
-  let fixture: ComponentFixture<GreetingInfoSliderComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ GreetingInfoSliderComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(GreetingInfoSliderComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

Frontend/src/app/components/greeting-info-slider/greeting-info-slider.component.ts

@@ -1,15 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-greeting-info-slider',
-  templateUrl: './greeting-info-slider.component.html',
-  styleUrls: ['./greeting-info-slider.component.css']
-})
-export class GreetingInfoSliderComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit(): void {
-  }
-
-}

Frontend/src/app/components/hot-deals-widget/hot-deals-widget.component.css

@@ -1,97 +1,72 @@
-.bbb_deals_wrapper {
+.hot-deal-widget-wrapper{
-    overflow: hidden;
+    width: 1640px;
+    height: 820px;
+    background-color: #f8f9fa;
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    grid-column-gap: 0px;
+    grid-row-gap: 0px;
+    align-items: center;
 }
 
-.bbb_deals_wrapper:hover {
+.product-description {
-    transform: scale(1.2);
+    /*background-color: #3480E3;*/
+    height: 100%;
+    display: grid;
+    grid-template-columns: 15% 16px 15% 16px 15% 16px 15% 16px 15% 16px 15% 8px;
+    grid-template-rows: repeat(5, 1fr);
 }
 
-.bbb_deals_featured {
+.product-image {
-    width: 100%;
+
 }
 
-.bbb_deals {
+#hot-deals{
-    width: 100%;
+    /*background-color: #E53167;*/
-    margin-right: 7%;
+    justify-self: center;
-    padding-top: 80px;
+    align-self: center;
-    padding-left: 25px;
+    grid-column: 3/10;
-    padding-right: 25px;
+    grid-row: 1/2;
-    padding-bottom: 34px;
-    box-shadow: 1px 1px 5px 1px rgba(0, 0, 0, 0.1);
-    border-radius: 5px;
-    margin-top: 0px
 }
 
-.bbb_deals_title {
+#product-name {
-    position: absolute;
+    justify-self: center;
-    top: 10px;
+    align-self: center;
-    left: 22px;
+    grid-column: 3/10;
-    font-size: 18px;
+    grid-row: 2/3;
-    font-weight: 500;
+    /*background-color: #E53167;*/
-    color: #000000
 }
 
-.bbb_deals_slider_container {
+#product-name > p {
-    width: 100%
+    font-size: 65px;
 }
 
-.bbb_deals_item {
+#sales {
-    width: 100% !important
+    justify-self: center;
+    align-self: center;
+    grid-column: 3/10;
+    grid-row: 3/4;
+    /*background-color: #E53167;*/
 }
 
-.bbb_deals_image {
+#futher-informations {
-    width: 40%;
+    justify-self: center;
-    height: 40%;
+    align-self: center;
+    grid-column: 3/10;
+    grid-row: 4/5;
+    /*background-color: #E53167;*/
 }
 
-.bbb_deals_image img {
+#points {
-    width: 100%
+    justify-self: center;
+    align-self: start;
+    grid-column: 3/10;
+    grid-row: 5/6;
+    /*background-color: #E53167;*/
 }
 
-.bbb_deals_content {
+.product-image {
-    margin-top: 33px
+    display: grid;
+    justify-content: center;
 }
 
-.bbb_deals_item_category a {
-    font-size: 14px;
-    font-weight: 400;
-    color: rgba(0, 0, 0, 0.5)
-}
-
-#bbb_deals_item_price_a {
-    font-size: 14px;
-    font-weight: 400;
-    color: rgba(0, 0, 0, 0.6);
-    color: red;
-}
-
-#bbb_deals_item_price_b {
-    font-size: 14px;
-    font-weight: 400;
-    color: rgba(0, 0, 0, 0.6);
-    color: green;
-}
-
-.bbb_deals_item_name {
-    max-width: 300px;
-    word-wrap: break-word;
-    font-size: 16px;
-    font-weight: 400;
-    color: #000000;
-}
-
-.bbb_deals_item_price {
-    font-size: 24px;
-    font-weight: 500;
-    color: #228B22;
-}
-
-.available {
-    margin-top: 19px
-}
-
-.available_title {
-    font-size: 16px;
-    color: rgba(0, 0, 0, 0.5);
-    font-weight: 400
-}

Frontend/src/app/components/hot-deals-widget/hot-deals-widget.component.html

@@ -1,34 +1,23 @@
-<section class="page-section portfolio" id="top-gesuchte">
+<div class="hot-deal-widget-wrapper">
-    <div class="container">
+    <div class="product-description">
-        <!-- Portfolio Section Heading-->
+        <div id="hot-deals">
-        <h2 class="page-section-heading text-center text-uppercase text-secondary mb-0">TOP-ANGEBOTE</h2>
+            <h1>HOT DEALS</h1>
-        <!-- Icon Divider-->
-        <div class="divider-custom">
-            <div class="divider-custom-line"></div>
         </div>
-        <!-- Portfolio Grid Items-->
+        <div id="product-name">
-        <div class="row justify-content-center">
+            <h1>Neues Apple iPhone 12 Pro <br> (512 GB) - Graphit</h1>
-            <!-- Portfolio Item 1-->
-            <div class="col-md-4 mx-auto my-5" *ngFor="let product of products">
-                <div class="bbb_deals_wrapper">
-                    <div class="bbb_deals_image"><img src="https://www.mueller-patrick.tech/betterzon/images/{{product.image_guid}}.jpg" alt=""></div>
-                    <div class="bbb_deals_content">
-                        <div class="bbb_deals_info_line d-flex flex-row justify-content-start">
-                            <div class="bbb_deals_item_name">{{product.name}}</div>
-                        </div>
-                        <div class="bbb_deals_info_line d-flex flex-row justify-content-start">
-                            <div class="bbb_deals_item_category">Amazon: <span id="bbb_deals_item_price_a"><strike>699.00$</strike></span></div>
-                        </div>
-                        <div class="bbb_deals_info_line d-flex flex-row justify-content-start">
-                            <div class="bbb_deals_item_category">Plantshub: <span id="bbb_deals_item_price_b">599,00$</span></div>
-                        </div>
-                        <div class="available_bar">
-                            <span style="width:17%"></span>
-                        </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
         </div>
-</section>
+        <div id="sales">
+            SPARE BIS ZU 7%!
+        </div>
+        <div id="futher-informations">
+            Weitere Informationen
+        </div>
+        <div id="points">
+            points
+        </div>
+    </div>
+    <div class="product-image">
+        <img src="assets/images/iphone-12-pro-silver-hero.png" height="771">
+    </div>
+</div>
 

Frontend/src/app/components/hot-deals-widget/hot-deals-widget.component.ts

@@ -1,7 +1,4 @@
-import {Component, Input, OnInit} from '@angular/core';
+import { Component, OnInit } from '@angular/core';
-import {ApiService} from '../../services/api.service';
-import {Product} from '../../models/product';
-import {ActivatedRoute, Router} from '@angular/router';
 
 @Component({
   selector: 'app-hot-deals-widget',
@@ -10,60 +7,9 @@ import {ActivatedRoute, Router} from '@angular/router';
 })
 export class HotDealsWidgetComponent implements OnInit {
 
-    products: Product[] = [];
+  constructor() { }
-    @Input() numberOfProducts: number;
-    @Input() showProductPicture: boolean;
-    @Input() searchQuery: string;
-    @Input() type: string;
-
-    constructor(
-        private apiService: ApiService,
-        private router: Router,
-        private route: ActivatedRoute
-    ) {
-    }
-
-    ngOnInit(): void {
-        this.loadParams();
-    }
-
-    loadParams(): void {
-        if (!this.numberOfProducts) {
-            this.numberOfProducts = 10;
-        }
-        if (!this.showProductPicture) {
-            this.showProductPicture = false;
-        }
-        if (!this.searchQuery) {
-            this.searchQuery = '';
-        }
-        if (!this.type) {
-            this.type = '';
-        }
-
-        switch (this.type) {
-            case 'search': {
-                this.getSearchedProducts();
-                break;
-            }
-            default: {
-                this.getProducts();
-                break;
-            }
-        }
-    }
-
-    getProducts(): void {
-        this.apiService.getProducts().subscribe(products => this.products = products);
-    }
-
-    getSearchedProducts(): void {
-        this.apiService.getProductsByQuery(this.searchQuery).subscribe(products => this.products = products);
-    }
-
-    clickedProduct(product: Product): void {
-        this.router.navigate([('/product/' + product.product_id)]);
-    }
 
+  ngOnInit(): void {
+  }
 
 }

Frontend/src/app/components/kunden/kunden.component.html

@@ -1,38 +0,0 @@
-<section class="page-section portfolio" id="unsere-kunden">
-    <div class="container">
-        <!-- Portfolio Section Heading-->
-        <h2 class="page-section-heading text-center text-uppercase text-secondary mb-0">SIE VERTRAUEN UNS</h2>
-        <!-- Icon Divider-->
-        <div class="divider-custom">
-            <div class="divider-custom-line"></div>
-        </div>
-        <!-- Portfolio Grid Items-->
-        <div class="row justify-content-center">
-            <!-- Portfolio Item 1-->
-            <div class="col-md-6 col-lg-4 mb-5">
-                <div class="portfolio-item mx-auto" data-bs-toggle="modal" data-bs-target="#portfolioModal1">
-                    <div class="portfolio-item-caption d-flex align-items-center justify-content-center h-100 w-100">
-                        <div class="portfolio-item-caption-content text-center text-white"><i class="fas fa-plus fa-3x"></i></div>
-                    </div>
-                    <img class="productImage" src="assets/images/Betterzon.svg"/>
-                </div>
-            </div>
-            <div class="col-md-6 col-lg-4 mb-5">
-                <div class="portfolio-item mx-auto" data-bs-toggle="modal" data-bs-target="#portfolioModal1">
-                    <div class="portfolio-item-caption d-flex align-items-center justify-content-center h-100 w-100">
-                        <div class="portfolio-item-caption-content text-center text-white"><i class="fas fa-plus fa-3x"></i></div>
-                    </div>
-                    <img class="productImage" src="assets/images/Betterzon.svg"/>
-                </div>
-            </div>
-            <div class="col-md-6 col-lg-4 mb-5">
-                <div class="portfolio-item mx-auto" data-bs-toggle="modal" data-bs-target="#portfolioModal1">
-                    <div class="portfolio-item-caption d-flex align-items-center justify-content-center h-100 w-100">
-                        <div class="portfolio-item-caption-content text-center text-white"><i class="fas fa-plus fa-3x"></i></div>
-                    </div>
-                    <img class="productImage" src="assets/images/Betterzon.svg"/>
-                </div>
-            </div>
-        </div>
-    </div>
-</section>

Frontend/src/app/components/kunden/kunden.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { KundenComponent } from './kunden.component';
-
-describe('KundenComponent', () => {
-  let component: KundenComponent;
-  let fixture: ComponentFixture<KundenComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ KundenComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(KundenComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

Frontend/src/app/components/kunden/kunden.component.ts

@@ -1,67 +0,0 @@
-import {Component, Input, OnInit} from '@angular/core';
-import {ApiService} from '../../services/api.service';
-import {Product} from '../../models/product';
-import {ActivatedRoute, Router} from '@angular/router';
-
-@Component({
-  selector: 'app-kunden',
-  templateUrl: './kunden.component.html',
-  styleUrls: ['./kunden.component.css']
-})
-export class KundenComponent implements OnInit {
-    products: Product[] = [];
-    @Input() numberOfProducts: number;
-    @Input() showProductPicture: boolean;
-    @Input() searchQuery: string;
-    @Input() type: string;
-
-    constructor(
-        private apiService: ApiService,
-        private router: Router,
-        private route: ActivatedRoute
-    ) {
-    }
-
-    ngOnInit(): void {
-        this.loadParams();
-    }
-
-    loadParams(): void {
-        if (!this.numberOfProducts) {
-            this.numberOfProducts = 10;
-        }
-        if (!this.showProductPicture) {
-            this.showProductPicture = false;
-        }
-        if (!this.searchQuery) {
-            this.searchQuery = '';
-        }
-        if (!this.type) {
-            this.type = '';
-        }
-
-        switch (this.type) {
-            case 'search': {
-                this.getSearchedProducts();
-                break;
-            }
-            default: {
-                this.getProducts();
-                break;
-            }
-        }
-    }
-
-    getProducts(): void {
-        this.apiService.getProducts().subscribe(products => this.products = products);
-    }
-
-    getSearchedProducts(): void {
-        this.apiService.getProductsByQuery(this.searchQuery).subscribe(products => this.products = products);
-    }
-
-    clickedProduct(product: Product): void {
-        this.router.navigate([('/product/' + product.product_id)]);
-    }
-
-}

Frontend/src/app/components/top-bar/top-bar.component.css

@@ -0,0 +1,54 @@
+.top-bar-wrapper {
+    display: grid;
+    grid-template-columns: 200px 360px 820px 20px 250px;
+    grid-template-rows: 40px;
+    grid-column-gap: 0px;
+    grid-row-gap: 0px;
+    align-items: center;
+}
+
+.top-logo {
+    grid-area: 1/1;
+}
+
+#better {
+    font-size: 28px;
+    font-weight: bold;
+    color: #3480E3;
+}
+
+#zon {
+    font-size: 28px;
+    font-weight: bold;
+    color: #E53167;
+}
+
+.search-button {
+    /*background-color: #E53167;*/
+}
+
+.sign-up {
+    /*background-color: #E53167;*/
+    margin-left: 50px;
+    margin-right: 25px;
+}
+
+.login {
+    margin-right: 25px;
+}
+
+#signin {
+    border-radius: 25px;
+    background-color: #E53167;
+}
+
+._links > a {
+    /*background-color: #E53167;*/
+    margin-left: 10px;
+    margin-right: 10px;
+}
+
+._signing_links > a {
+    /*background-color: #E53167;*/
+    margin-left: 50px;
+}

Frontend/src/app/components/top-bar/top-bar.component.html

@@ -1,22 +1,26 @@
-<nav class="navbar navbar-expand-lg bg-secondary text-uppercase fixed-top" id="mainNav">
+<div class="top-bar-wrapper">
-    <div class="container">
+    <div class="<top-logo>">
-        <a class="navbar-brand" routerLink=""> Betterzon</a>
+        <a><span id="better">BETTER</span><span id="zon">ZON</span></a>
-        <form class="form-inline my-2 my-lg-0">
-            <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
-        </form>
-        <button class="navbar-toggler text-uppercase font-weight-bold bg-primary text-white rounded" type="button" data-bs-toggle="collapse" data-bs-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
-            Menu
-            <i class="fas fa-bars"></i>
-        </button>
-        <div class="collapse navbar-collapse" id="navbarResponsive">
-            <ul class="navbar-nav ms-auto">
-                <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" href="#top-gesuchte">Top-Gesuchte</a></li>
-                <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" href="#about">über uns</a></li>
-                <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" href="#unsere-kunden">Unsere Kunden</a></li>
-                <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" routerLink="/signin">Anmelden</a></li>
-                <li class="nav-item mx-0 mx-lg-1"><a class="nav-link py-3 px-0 px-lg-3 rounded" routerLink="/registration">Konto Erstellen</a></li>
-            </ul>
-        </div>
     </div>
-</nav>
+    <div class="links">
+        <nav class="_links">
+            <a>KONTAKTIERE UNS</a>
+            <a>KUNDEN</a>
+            <a>FAQ</a>
+        </nav>
+    </div>
+    <div class="footer_space">
 
+    </div>
+    <div class="search-button">
+        <a>
+            <img src="assets/images/search_black_24dp.svg" alt="Sarch button">
+        </a>
+    </div>
+    <div class="links">
+        <nav class="_signing_links">
+            <a>SIGN UP</a>
+            <a><span id="signin">SIGN IN</span></a>
+        </nav>
+    </div>
+</div>

Frontend/src/app/components/top-bar/top-bar.component.ts

@@ -11,7 +11,7 @@ export class TopBarComponent implements OnInit {
 
   constructor() { }
 
-    ngOnInit() {
+  ngOnInit(): void {
-    }
+  }
 
 }

Frontend/src/app/pages/landingpage/landingpage.component.html

@@ -1,12 +1,5 @@
-<app-top-bar></app-top-bar>
-
-<app-greeting-info-slider></app-greeting-info-slider>
 <app-hot-deals-widget></app-hot-deals-widget>
-<app-about-us></app-about-us>
-<app-kunden></app-kunden>
 
-<app-bottom-bar></app-bottom-bar>
-<app-copyright></app-copyright>
 <!--<div id="mainComponents">
     <div id="searchContainer">
         <input type="text" [(ngModel)]="searchInput" placeholder="Search" (keyup.enter)="startedSearch()">

Frontend/src/app/pages/page-not-found-page/page-not-found-page.component.html

@@ -1,3 +1,2 @@
 <h1>404</h1>
 <p>Page not found!</p>
-<p routerLink="">Zurück</p>

Frontend/src/app/pages/product-detail-page/product-detail-page.component.html

@@ -1,7 +1,5 @@
-<app-top-bar></app-top-bar>
-
 <div id="mainComponents">
     <app-product-details [productId]="productId"></app-product-details>
     <app-newest-prices-list [productId]="productId"></app-newest-prices-list>
 </div>
-
+<app-footer></app-footer>

Frontend/src/index.html

@@ -6,16 +6,11 @@
         <base href="/">
         <meta name="viewport" content="width=device-width, initial-scale=1">
         <link rel="icon" type="image/x-icon" href="favicon.ico">
-        <!-- Favicon-->
+        <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap" rel="stylesheet">
-        <link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
+        <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
-        <!-- Font Awesome icons (free version)-->
-        <script src="https://use.fontawesome.com/releases/v5.15.3/js/all.js" crossorigin="anonymous"></script>
-        <!-- Google fonts-->
-        <link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css" />
-        <link href="https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic" rel="stylesheet" type="text/css" />
         <script src="node_modules/cookieconsent/build/cookieconsent.min.js"></script>
     </head>
     <body>
-        <app-root>LOADING</app-root>
+        <app-root></app-root>
     </body>
 </html>

README.md

@@ -5,7 +5,6 @@ Wiki: https://github.com/Mueller-Patrick/Betterzon/wiki
 
 # Code Quality
 [![Codacy Badge](https://app.codacy.com/project/badge/Grade/88e47ebf837b43af9d12147c22f77f7f)](https://www.codacy.com/gh/Mueller-Patrick/Betterzon/dashboard?utm_source=github.com&utm_medium=referral&utm_content=Mueller-Patrick/Betterzon&utm_campaign=Badge_Grade)
-[![Code Coverage](https://img.shields.io/badge/coverage-82%25-green)](https://ci.betterzon.xyz)
 
 # Project Status
 [![Website Status](https://img.shields.io/website?label=www.betterzon.xyz&style=for-the-badge&url=https%3A%2F%2Fwww.betterzon.xyz)](https://www.betterzon.xyz)