page-not-found semble ok

This commit is contained in:
cecilesimplon93 2022-02-02 16:28:52 +01:00
parent 6623310501
commit 3be268bfdb
12 changed files with 110 additions and 23 deletions

View File

@ -36,6 +36,7 @@ import { HttpClientModule } from '@angular/common/http';
import { PageAjoutContactComponent } from './pages/page-ajout-contact/page-ajout-contact.component';
import { PageModifierContactComponent } from './pages/page-modifier-contact/page-modifier-contact.component';
import { PageCreationTeamComponent } from './pages/page-creation-team/page-creation-team.component';
import { EmoticonComponent } from './emoticon/emoticon.component';
@NgModule({
declarations: [
@ -71,6 +72,7 @@ import { PageCreationTeamComponent } from './pages/page-creation-team/page-creat
PageAjoutContactComponent,
PageModifierContactComponent,
PageCreationTeamComponent,
EmoticonComponent,
],
imports: [
BrowserModule,

View File

@ -1 +1,6 @@
<p>humeur works!</p>
<p>Mon humeur est :</p>
<p>Affichage des items du tableau des humeurs</p>
<app-emoticon> *ngFor ="let tabHumeur of tabHumeur"
[tabHumeur]="tabHumeur"></app-emoticon>

View File

@ -7,9 +7,23 @@ import { Component, OnInit } from '@angular/core';
})
export class HumeurComponent implements OnInit {
constructor() { }
constructor() {
}
ngOnInit(): void {
}
}

View File

@ -0,0 +1,6 @@
<p>emoticon des humeurs</p>
<div *ngFor="let humor of tabHumeur">{{humor.title}}</div>
<div *ngFor="let humor of tabHumeur"> <img src="{{humor.lien}}" alt="{{humor.title}}"></div>

View File

View File

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

View File

@ -0,0 +1,26 @@
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-emoticon',
templateUrl: './emoticon.component.html',
styleUrls: ['./emoticon.component.scss']
})
export class EmoticonComponent implements OnInit {
//declaration du tableau
tabHumeur= [
{ title : "Je pleure", lien : "../../../assets/images/emoticon-pleurer.png"},
{ title : "Je suis en colère", lien : "../../../assets/images/emoticon-insulter.png"},
{ title : "Je suis malade", lien : "../../../assets/images/emoticon-vomir.png"}
]
constructor() { }
ngOnInit(): void {
console.log("tab humeurs ==>", this.tabHumeur)
}
}

View File

@ -1,12 +1,23 @@
<app-header></app-header>
<!-- <app-humeur></app-humeur> -->
<div>
<p> Page introuvable</p>
<a routerLink="" routerLinkActive="!active"><br><br>
Je retourne à l'accueil<br><br><br><br><br><br><br><br><br><br><br><br></a>
<div class="ctn-link min-vh-100">
<div class="text-center">
<p> Page introuvable</p>
<a routerLink="" routerLinkActive="!active">Je retourne à l'accueil</a>
</div>
</div>
</div>

View File

@ -1,22 +1,20 @@
a.hover {
color :rgb(219, 200, 28)
}
a {
color: rgb(32, 114, 45);
}
div {
p{
color: black;
text-align: center;
}
.ctn-link > div {
padding-top: 7em;
}
.min-vh-100 {
font-weight: bold;
background-image: linear-gradient(to left top, #051937, #004d7a, #008793, #e2ebe7, #f8faf5);
//max-width: max-content;
// si on préfère une image en fond
// background-image: url("../../../assets/images/404.jpg");
// background-size: cover;
background-image: linear-gradient(to left top, #051937, #004d7a, #008793, #e2ebe7, #f8faf5);
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 164 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 54 KiB