Merge pull request #71 from Homie-s-Project/create-companion-page

Create companion page

kairos-web/src/app/app-routing.module.ts

@@ -9,6 +9,7 @@ import { ErrorComponent } from './components/error/error.component';
 import { EventEditComponent } from './components/event-edit/event-edit.component';
 import {ProfileComponent} from "./components/profile/profile.component";
 import {EventCalendarComponent} from "./components/event-calendar/event-calendar.component";
+import { CompanionComponent } from './components/companion/companion.component';
 
 const routes: Routes = [
   {
@@ -44,9 +45,13 @@ const routes: Routes = [
         ]
       },
       {
-        path:'profile',
+        path: 'profile',
         component: ProfileComponent
       },
+      {
+        path: 'companion',
+        component: CompanionComponent
+      }
     ]
   },
   {

kairos-web/src/app/app.module.ts

@@ -25,6 +25,7 @@ import {ErrorComponent} from "./components/error/error.component";
 import {EventCalendarComponent} from './components/event-calendar/event-calendar.component';
 import {ModalDialogComponent} from './components/dialog/modal-dialog/modal-dialog.component';
 import { AlertDialogComponent } from './components/dialog/alert-dialog/alert-dialog.component';
+import { CompanionComponent } from './components/companion/companion.component';
 
 @NgModule({
   declarations: [
@@ -45,6 +46,7 @@ import { AlertDialogComponent } from './components/dialog/alert-dialog/alert-dia
     EventCalendarComponent,
     ModalDialogComponent,
     AlertDialogComponent,
+    CompanionComponent,
   ],
   imports: [
     BrowserModule,

kairos-web/src/app/components/companion/companion.component.html

@@ -0,0 +1,6 @@
+<fa-icon class="smiley-icon" [icon]="faPersonDigging"></fa-icon>
+<div class="text-container">
+    <h1>Page du compagnon</h1>
+    <h2>Actuellement en construction ! Il vous rejoindra bientôt</h2>
+</div>
+<div class="companion-background"></div>

kairos-web/src/app/components/companion/companion.component.scss

@@ -0,0 +1,29 @@
+@use '/src/styles/variables.scss' as vars;
+
+:host {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 100%;
+    height: 100%;
+    gap: 15px;
+    color: vars.$first-color;
+    .smiley-icon {
+        font-size: 120px;
+    }
+    .text-container {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+        text-align: left;
+    }
+    .companion-background {
+        width: 100%;
+        height: 100%;
+        background-color: darken(vars.$fourth-color, 7%);
+        opacity: 75%;
+        position: fixed;
+        z-index: -1;
+    }
+}

kairos-web/src/app/components/companion/companion.component.spec.ts

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

kairos-web/src/app/components/companion/companion.component.ts

@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+import { faPersonDigging } from '@fortawesome/free-solid-svg-icons';
+
+@Component({
+  selector: 'app-companion',
+  templateUrl: './companion.component.html',
+  styleUrls: ['./companion.component.scss']
+})
+export class CompanionComponent {
+  faPersonDigging = faPersonDigging;
+}

kairos-web/src/app/components/error/error.component.scss

@@ -1,4 +1,5 @@
 @use '/src/styles/variables.scss' as vars;
+
 .error-container {
     display: flex;
     justify-content: center;