From 0d006de09fda65758608892781301f965daed2f5 Mon Sep 17 00:00:00 2001
From: PolyTinder <146553756+PolyTinder@users.noreply.github.com>
Date: Fri, 27 Oct 2023 00:49:30 +0200
Subject: [PATCH] Fix/bugfix (#50)

* remove unused fetch

* remove style

* optimize image loading
---
 packages/client/src/index.html                              | 4 ++--
 .../matching/pages/matches-page/matches-page.component.ts   | 6 ------
 .../user-profile-card/user-profile-card.component.html      | 5 ++++-
 .../user-profile-card/user-profile-card.component.scss      | 4 ++--
 packages/client/src/styles.scss                             | 2 +-
 5 files changed, 9 insertions(+), 12 deletions(-)
diff --git a/packages/client/src/index.html b/packages/client/src/index.html
index eadca6b..d72b570 100644
--- a/packages/client/src/index.html
+++ b/packages/client/src/index.html
@@ -1,5 +1,5 @@
 <!doctype html>
-<html lang="en" class="app-html">
+<html lang="en">
 <head>
   <meta charset="utf-8">
   <title>PolyTinder</title>
@@ -59,7 +59,7 @@
   <link rel="apple-touch-startup-image" media="screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" href="assets/splash_screens/4__iPhone_SE__iPod_touch_5th_generation_and_later_landscape.png">
   <link rel="apple-touch-startup-image" media="screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="assets/splash_screens/4__iPhone_SE__iPod_touch_5th_generation_and_later_portrait.png">
 </head>
-<body class="app-body mat-typography">
+<body class="mat-typography">
   <app-root></app-root>
   <noscript>Please enable JavaScript to continue using this application.</noscript>
 </body>
diff --git a/packages/client/src/modules/matching/pages/matches-page/matches-page.component.ts b/packages/client/src/modules/matching/pages/matches-page/matches-page.component.ts
index 9122f50..90a7776 100644
--- a/packages/client/src/modules/matching/pages/matches-page/matches-page.component.ts
+++ b/packages/client/src/modules/matching/pages/matches-page/matches-page.component.ts
@@ -42,12 +42,6 @@ export class MatchesPageComponent {
         this.hasConversations = this.conversations.pipe(
             map((conversations) => conversations.length > 0),
         );
-
-        this.validationService.userValid.subscribe((userValid) => {
-            if (userValid) {
-                this.publicProfileService.fetchMatches().subscribe();
-            }
-        });
     }
 
     get userValid() {
diff --git a/packages/client/src/modules/user-profile/components/user-profile-card/user-profile-card.component.html b/packages/client/src/modules/user-profile/components/user-profile-card/user-profile-card.component.html
index ecd9156..e963f20 100644
--- a/packages/client/src/modules/user-profile/components/user-profile-card/user-profile-card.component.html
+++ b/packages/client/src/modules/user-profile/components/user-profile-card/user-profile-card.component.html
@@ -3,10 +3,13 @@
     <div class="user-profile">
         <div class="user-profile__main">
             <img
-                [src]="userProfile.pictures?.[0] + '-/scale_crop/700x1020/center/'"
+                [src]="(userProfile.pictures?.[0] + '-/scale_crop/363x486/center/-/progressive/yes/')"
+                [srcset]="(userProfile.pictures?.[0] + '-/scale_crop/363x486/center/-/progressive/yes/ 1x, ' + userProfile.pictures?.[0] + '-/scale_crop/726x972/center/-/progressive/yes/ 2x')"
                 [alt]="'Photo de ' + userProfile.name"
                 class="user-profile__main__picture"
+                *ngIf="userProfile.pictures?.[0]"
             >
+            <div class="user-profile__main__picture" *ngIf="!userProfile.pictures?.[0]"></div>
             <div class="user-profile__main__info">
                 <p class="user-profile__main__info__name">{{userProfile.name}}</p>
                 <p class="user-profile__main__info__subtitle">
diff --git a/packages/client/src/modules/user-profile/components/user-profile-card/user-profile-card.component.scss b/packages/client/src/modules/user-profile/components/user-profile-card/user-profile-card.component.scss
index 9130f36..ce80399 100644
--- a/packages/client/src/modules/user-profile/components/user-profile-card/user-profile-card.component.scss
+++ b/packages/client/src/modules/user-profile/components/user-profile-card/user-profile-card.component.scss
@@ -61,7 +61,7 @@
     &__picture {
         width: 100%;
         aspect-ratio: 3/4;
-        background-color: rgb(240, 240, 240);
+        background: linear-gradient(180deg, var(--theme-background-secondary) 0%, rgba(var(--theme-main-rgb), 0.075) 100%);
         border-radius: $inner-radius;
         object-fit: cover;
         object-position: center;
@@ -147,7 +147,7 @@
             object-fit: cover;
             object-position: center;
             border-radius: $inner-radius;
-            background-color: rgb(240, 240, 240);
+            background: linear-gradient(180deg, var(--theme-background-secondary) 0%, rgba(var(--theme-main-rgb), 0.075) 100%);
         }
 
         &__info {
diff --git a/packages/client/src/styles.scss b/packages/client/src/styles.scss
index 08e0a32..8da1b63 100644
--- a/packages/client/src/styles.scss
+++ b/packages/client/src/styles.scss
@@ -14,7 +14,7 @@
     --theme-background-secondary: rgb(var(--theme-background-secondary-rgb));
 }
 
-html.app-html, body.app-body {
+html, body {
     margin: 0;
     width: 100%;
     height: 100%;
