From cb4476f99280715021b8698f9bdaa62ecd9a43cc Mon Sep 17 00:00:00 2001
From: Capelier-Marla <marla.capelier@etu.univ-amu.fr>
Date: Thu, 26 Jan 2023 17:10:47 +0100
Subject: [PATCH 1/7] added recipeView class to main in view of recipes

---
 Views/recipe/view.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Views/recipe/view.php b/Views/recipe/view.php
index 393c196..d95c2b4 100644
--- a/Views/recipe/view.php
+++ b/Views/recipe/view.php
@@ -1,7 +1,7 @@
 <?php
 $O_recipe = $A_view["RECIPE"];
 ?>
-<main class="hasAside">
+<main class="hasAside recipeView">
     <?php View::show("common/category_list") ?>
     <article>
         <img src="<?= $O_recipe->getImgLink() ?>" alt="Image d'illustration de la recette">

From 5f739ecf775be068218bbc9d36dd6d77e1fe66ec Mon Sep 17 00:00:00 2001
From: Capelier-Marla <marla.capelier@etu.univ-amu.fr>
Date: Thu, 26 Jan 2023 17:23:34 +0100
Subject: [PATCH 2/7] style top image

---
 static/style.css | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/static/style.css b/static/style.css
index 24667ae..3d09b6c 100644
--- a/static/style.css
+++ b/static/style.css
@@ -351,6 +351,19 @@ main.search > article > section {
     gap: var(--size-xl);
 }
 
+main.recipeView > article {
+    max-width: 600px;
+}
+main.recipeView > article > img {
+    min-width: 100%;
+    max-width: 100%;
+    max-height: 150px;
+    object-fit: none;
+    object-position: center;
+    border-radius: var(--border-radius);
+    box-shadow: var(--shadow);
+}
+
 main.editRecipe {
     min-width: 300px;
     width: 600px;

From 38eb7edf9b58a0fbc70119a3fe1891c36ed943f1 Mon Sep 17 00:00:00 2001
From: Capelier-Marla <marla.capelier@etu.univ-amu.fr>
Date: Thu, 26 Jan 2023 17:47:00 +0100
Subject: [PATCH 3/7] style first part of recipe view

---
 static/style.css | 34 ++++++++++++++++++++++++++++++++++
 1 file changed, 34 insertions(+)

diff --git a/static/style.css b/static/style.css
index 3d09b6c..12158e6 100644
--- a/static/style.css
+++ b/static/style.css
@@ -353,6 +353,9 @@ main.search > article > section {
 
 main.recipeView > article {
     max-width: 600px;
+    display: flex;
+    flex-direction: column;
+    gap: var(--size-xl);
 }
 main.recipeView > article > img {
     min-width: 100%;
@@ -363,6 +366,37 @@ main.recipeView > article > img {
     border-radius: var(--border-radius);
     box-shadow: var(--shadow);
 }
+main.recipeView > article > section.infosRecette > header {
+    display: flex;
+    flex-direction: row;
+    border: none;
+    border-bottom: var(--border) var(--principal-neutral);
+    justify-content: space-between;
+    margin-bottom: var(--size-l);
+    align-items: baseline;
+}
+main.recipeView > article > section.infosRecette > header > h1 {
+    font-size: var(--size-max);
+}
+main.recipeView > article > section.infosRecette > header > p {
+    font-size: var(--size-l);
+}
+main.recipeView > article > section > h2 {
+    font-size: var(--size-xl);
+    border-bottom: var(--border) var(--principal-neutral);
+    margin-bottom: var(--size-l);
+}
+main.recipeView > article > section > :is(ul, ol) {
+    display: flex;
+    flex-direction: column;
+    gap: var(--size-s);
+}
+main.recipeView > article > section > :is(ul, ol) > li {
+    margin-left: var(--size-l);
+}
+main.recipeView > article > section > ul > li::marker {
+    content: "- ";
+}
 
 main.editRecipe {
     min-width: 300px;

From 3a8ae0cdf9df7ae686ef071c540d1849f2a126cb Mon Sep 17 00:00:00 2001
From: Capelier-Marla <marla.capelier@etu.univ-amu.fr>
Date: Thu, 26 Jan 2023 17:57:17 +0100
Subject: [PATCH 4/7] syled buttons

---
 static/style.css | 22 ++++++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/static/style.css b/static/style.css
index 12158e6..af0faec 100644
--- a/static/style.css
+++ b/static/style.css
@@ -397,6 +397,28 @@ main.recipeView > article > section > :is(ul, ol) > li {
 main.recipeView > article > section > ul > li::marker {
     content: "- ";
 }
+main.recipeView > article > p {
+    color: var(--grey-dark);
+}
+main.recipeView > article > section.buttonsEditRecipe {
+    display: flex;
+    flex-direction: row;
+    gap: var(--size-xl);
+}
+main.recipeView > article > section.buttonsEditRecipe > a {
+    display: flex;
+    align-items: center;
+    font-size: var(--size-l);
+    color: var(--secondary-pastel);
+    background: var(--principal-neutral);
+    height: calc(1.5 * var(--size-xl));
+    text-decoration: none;
+    border-radius: var(--border-radius);
+    padding-left: var(--size-m);
+    padding-right: var(--size-m);
+    box-shadow: var(--shadow);
+
+}
 
 main.editRecipe {
     min-width: 300px;

From 3f1ff982514b6301815dc89879591bd99e46de57 Mon Sep 17 00:00:00 2001
From: Capelier-Marla <marla.capelier@etu.univ-amu.fr>
Date: Thu, 26 Jan 2023 18:10:51 +0100
Subject: [PATCH 5/7] style form for appreciation

---
 Views/appreciations/view_all.php | 23 +++++++++++-----------
 static/style.css                 | 33 +++++++++++++++++++++++++++++++-
 2 files changed, 44 insertions(+), 12 deletions(-)

diff --git a/Views/appreciations/view_all.php b/Views/appreciations/view_all.php
index d729c9d..e0211e4 100644
--- a/Views/appreciations/view_all.php
+++ b/Views/appreciations/view_all.php
@@ -2,19 +2,20 @@
 $O_recipe = $A_view["RECIPE"];
 ?>
 <section>
-    <h1> Appréciations: </h1>
+    <h2> Appréciations: </h2>
     <form method="POST" action="/appr/create">
-        <label for="comment">Entrez votre commentaire :</label>
-        <input type="text" name="comment" id="comment" placeholder="Commentaire">
-
-        <label for="note">Laissez une note :</label>
-        <input type="radio" name="note" id="note" value="0"> 0
-        <input type="radio" name="note" id="note" value="1" title="1"> 1
-        <input type="radio" name="note" id="note" value="2" title="2"> 2
-        <input type="radio" name="note" id="note" value="3" title="3" required> 3
-        <input type="radio" name="note" id="note" value="4" title="4"> 4
-        <input type="radio" name="note" id="note" value="5" title="5"> 5
+        <label for="comment">Ajoutez un commentaire :</label>
+        <textarea type="text" name="comment" id="comment" placeholder="Votre commentaire"></textarea>
 
+        <section class="appreciationNoteValue">
+            <label for="note">Laissez une note :</label>
+            <input type="radio" name="note" id="note" value="0"> 0
+            <input type="radio" name="note" id="note" value="1" title="1"> 1
+            <input type="radio" name="note" id="note" value="2" title="2"> 2
+            <input type="radio" name="note" id="note" value="3" title="3" required> 3
+            <input type="radio" name="note" id="note" value="4" title="4"> 4
+            <input type="radio" name="note" id="note" value="5" title="5"> 5
+        </section>
         <input type="hidden" name="recipe_id" value="<?= $O_recipe->I_ID ?>">
 
         <input type="submit" value="Envoyer">
diff --git a/static/style.css b/static/style.css
index af0faec..0c6013d 100644
--- a/static/style.css
+++ b/static/style.css
@@ -316,7 +316,8 @@ main.userView > form > label {
 }
 
 :is(main.userView > form,
-    main.search > article > form)
+    main.search > article > form,
+    main.recipeView > article > section > form)
 > input[type=submit] {
     background: var(--principal-neutral);
     border: none;
@@ -417,6 +418,36 @@ main.recipeView > article > section.buttonsEditRecipe > a {
     padding-left: var(--size-m);
     padding-right: var(--size-m);
     box-shadow: var(--shadow);
+}
+main.recipeView > article > section > form {
+    display: flex;
+    flex-direction: column;
+    gap: var(--size-m);
+}
+main.recipeView > article > section > form > label {
+    display: none;
+}
+main.recipeView > article > section > form > label:first-child {
+    display: block;
+    font-size: var(--size-xl);
+}
+main.recipeView > article > section > form > textarea {
+    font-family: 'Nunito', 'Arial';
+    background: var(--grey-light);
+    border: none;
+    border-radius: var(--border-radius);
+    padding: var(--size-m);
+    font-size: var(--size-l);
+}
+main.recipeView > article > section > form > textarea:focus-visible {
+    outline: none;
+}
+main.recipeView > article > section > form > section.appreciationNoteValue {
+    display: flex;
+    flex-direction: row;
+    gap: var(--size-s);
+}
+main.recipeView > article > section > form > input[type=submit] {
 
 }
 

From ae96aae53227ffc46f9ee6271b5ab0b0dc4e832d Mon Sep 17 00:00:00 2001
From: Capelier-Marla <marla.capelier@etu.univ-amu.fr>
Date: Thu, 26 Jan 2023 18:11:14 +0100
Subject: [PATCH 6/7] style form for appreciation

---
 static/style.css | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/static/style.css b/static/style.css
index 0c6013d..afcf60f 100644
--- a/static/style.css
+++ b/static/style.css
@@ -447,9 +447,6 @@ main.recipeView > article > section > form > section.appreciationNoteValue {
     flex-direction: row;
     gap: var(--size-s);
 }
-main.recipeView > article > section > form > input[type=submit] {
-
-}
 
 main.editRecipe {
     min-width: 300px;

From 47dd94667ac612ff86efceb193258466001a837d Mon Sep 17 00:00:00 2001
From: Capelier-Marla <marla.capelier@etu.univ-amu.fr>
Date: Thu, 26 Jan 2023 18:28:57 +0100
Subject: [PATCH 7/7] styled apprectation

---
 Views/appreciations/view_all.php    |  2 +-
 Views/appreciations/view_single.php |  4 +--
 static/style.css                    | 43 ++++++++++++++++++++++++++++-
 3 files changed, 45 insertions(+), 4 deletions(-)

diff --git a/Views/appreciations/view_all.php b/Views/appreciations/view_all.php
index e0211e4..0e75b83 100644
--- a/Views/appreciations/view_all.php
+++ b/Views/appreciations/view_all.php
@@ -1,7 +1,7 @@
 <?php
 $O_recipe = $A_view["RECIPE"];
 ?>
-<section>
+<section class="apprecitations">
     <h2> Appréciations: </h2>
     <form method="POST" action="/appr/create">
         <label for="comment">Ajoutez un commentaire :</label>
diff --git a/Views/appreciations/view_single.php b/Views/appreciations/view_single.php
index e90d13f..a9ae97d 100644
--- a/Views/appreciations/view_single.php
+++ b/Views/appreciations/view_single.php
@@ -6,8 +6,8 @@
     <header>
         <img src="<?= $O_appr->getAuthor()->getProfilePicLink() ?>" alt="profile picture">
         <h3> <?= $O_appr->getAuthor()->S_USERNAME ?> </h3>
-        <p> <?= $O_appr->I_NOTE ?> </p>
-        <p> <?= $O_appr->S_DATE ?> </p>
+        <p>Le <?= $O_appr->S_DATE ?> </p>
+        <p> <?= $O_appr->I_NOTE ?>/5 </p>
         <?php if ($A_view["ADMIN"] || $A_view["USER_ID"] === $O_appr->I_AUTHOR_ID) { ?>
             <a href="/appr/delete/<?= $O_appr->I_ID ?>">Supprimer l'appréciation</a>
         <?php } ?>
diff --git a/static/style.css b/static/style.css
index afcf60f..ab47e34 100644
--- a/static/style.css
+++ b/static/style.css
@@ -419,10 +419,15 @@ main.recipeView > article > section.buttonsEditRecipe > a {
     padding-right: var(--size-m);
     box-shadow: var(--shadow);
 }
+main.recipeView > article > section {
+    display: flex;
+    flex-direction: column;
+    gap: var(--size-l);
+}
 main.recipeView > article > section > form {
     display: flex;
     flex-direction: column;
-    gap: var(--size-m);
+    gap: var(--size-s);
 }
 main.recipeView > article > section > form > label {
     display: none;
@@ -447,6 +452,42 @@ main.recipeView > article > section > form > section.appreciationNoteValue {
     flex-direction: row;
     gap: var(--size-s);
 }
+main.recipeView > article > section.apprecitations > section {
+    background: var(--secondary-pastel);
+    border-radius: var(--border-radius);
+    box-shadow: var(--shadow);
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+}
+main.recipeView > article > section.apprecitations > section > header {
+    display: flex;
+    flex-direction: row;
+    gap: var(--size-m);
+    background: var(--grey-light);
+    padding: var(--size-m);
+    border-radius: var(--border-radius);
+    box-shadow: var(--shadow);
+    align-items: baseline;
+    justify-content: space-between;
+}
+main.recipeView > article > section.apprecitations > section > :not(header) {
+    padding: var(--size-m);
+}
+main.recipeView > article > section.apprecitations > section > header > img {
+    width: var(--size-max);
+    height: var(--size-max);
+    border-radius: var(--size-m);
+}
+main.recipeView > article > section.apprecitations > section > header > a {
+    background: var(--principal-neutral);
+    border-radius: var(--border-radius);
+    color: var(--secondary-pastel);
+    text-decoration: none;
+    padding: var(--size-m);
+}
+
+
 
 main.editRecipe {
     min-width: 300px;