diff --git a/src/app/card-resto/card-resto.component.html b/src/app/card-resto/card-resto.component.html index daadf18..7226f7c 100644 --- a/src/app/card-resto/card-resto.component.html +++ b/src/app/card-resto/card-resto.component.html @@ -1,7 +1,11 @@
+ style="width: 21rem;"> Card image cap -
+
+

{{restaurant.nom }}

@@ -12,8 +16,8 @@ [attr.data-bs-target]="'#restaurant'+ restaurant.id" aria-expanded="true" aria-controls="collapseOne"> PLUS D'INFOS -
+
This is the first item's accordion body.
@@ -26,6 +30,7 @@ 5/5
+
{{ categorie.libelle }} @@ -57,14 +62,14 @@
- Sur place : + Sur place : - A emporter : + A emporter :
@@ -72,7 +77,7 @@
Accès PMR :
diff --git a/src/app/card-resto/card-resto.component.scss b/src/app/card-resto/card-resto.component.scss index 3e6c0ea..90f92f8 100644 --- a/src/app/card-resto/card-resto.component.scss +++ b/src/app/card-resto/card-resto.component.scss @@ -1,17 +1,22 @@ .rond{ - padding: 0.7em; + padding: 1em; background-color: rgb(255, 255, 255); top: 1em; right: 1em; border-radius: 50%; + width: 50px; + height: 50px; + } - .heart{ - display: flex; - font-size: 1.6em; - padding: 0; - margin:0; - color: #FF2048; + position: absolute; + top: 7px; + left: 13px; + font-size: 1.5em; + transform: rotate(5deg); + + + } .titre-resto{ @@ -37,10 +42,10 @@ } .ps-5 { - padding-left: 5.4rem !important; + padding-left: 6.4rem !important; } .pe-5 { - padding-right: 5rem !important; + padding-right: 6rem !important; } diff --git a/src/app/card-resto/card-resto.component.ts b/src/app/card-resto/card-resto.component.ts index 106a240..a90999f 100644 --- a/src/app/card-resto/card-resto.component.ts +++ b/src/app/card-resto/card-resto.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, OnInit } from '@angular/core'; +import { Component,EventEmitter, Input, Output, OnInit } from '@angular/core'; @Component({ selector: 'app-card-resto', @@ -9,6 +9,9 @@ export class CardRestoComponent implements OnInit { @Input() restaurant : any ; distance : number; + @Input() likeResto: any; + @Output() clickLike = new EventEmitter(); + isLiked : boolean = false; constructor() { this.distance = 0 ; @@ -30,6 +33,11 @@ export class CardRestoComponent implements OnInit { } + onClickLike() { + console.log('click'); + this.isLiked = !this.isLiked; + this.clickLike.emit(this.isLiked); + } getDistanceFromLatLonInKm(lat1 : number , lon1 : number, lat2 : number, lon2 : number) { let R = 6371; // Radius of the earth in km diff --git a/src/app/filters/icon/icon.component.html b/src/app/filters/icon/icon.component.html index 789856c..322c471 100644 --- a/src/app/filters/icon/icon.component.html +++ b/src/app/filters/icon/icon.component.html @@ -1,3 +1,4 @@ - + diff --git a/src/app/pages/home-page/home-page.component.ts b/src/app/pages/home-page/home-page.component.ts index ffc4d14..128cd6d 100644 --- a/src/app/pages/home-page/home-page.component.ts +++ b/src/app/pages/home-page/home-page.component.ts @@ -16,12 +16,15 @@ export class HomePageComponent implements OnInit { ngOnInit(): void { this.apiBackService.getCategories().subscribe((listCategories: any[]) => { - console.log(listCategories); + // console.log(listCategories); this.listCategories = listCategories; }); } + onEventLike(isLiked : boolean) { + this.apiBackService.restoLiked$.next(isLiked); + } } diff --git a/src/app/services/api-back.service.ts b/src/app/services/api-back.service.ts index e38b7fb..52a6298 100644 --- a/src/app/services/api-back.service.ts +++ b/src/app/services/api-back.service.ts @@ -9,6 +9,7 @@ import { environment } from 'src/environments/environment'; export class ApiBackService { public restoByCat : Observable = of([]); + restoLiked$ = new Subject(); public restoFilter : any[]; public routeParam ?: string;