bouh

main.css

@@ -22,14 +22,17 @@ html, body{
     display: flex;
     flex-direction: row;
     padding: 3px;
+    padding-left: 2%;
+    padding-bottom: 10px;
     background-color: blanchedalmond;
 }
 
 #logo {
-    flex:1;
     background-color: aqua;
     background-image: url("Logo.jpg");
     /*background:no-repeat;*/
+    height: 103px;
+    width: 141px;
 }
 
 .logo{
@@ -76,7 +79,8 @@ body {
 .sidebar {
     background-color: aquamarine;
     border: 1px solid rgba(0,0,0,.125);
-    border-radius: .25rem;
+    border-radius: 10px;
+    width: 128px;
 }
 
 
@@ -86,6 +90,8 @@ body {
     overflow: auto;
     flex: 1;
     background-clip: border-box;
+    padding-right: 5%;
+    padding-left: 5%;
 }
 
 /* content : le cadre de base du centre de notre site
@@ -116,8 +122,18 @@ body {
 .recette-icone{
     border: 3px solid rgba(0,0,0,.125);
     border-radius: 40px;
-    text-align: center;
+    text-align: left;
+    padding: 15px;
     vertical-align: middle;
+    box-shadow: 3px 5px 5px black;
+    width: 500px;
+}
+
+.recette-preview-image{
+    max-width: calc( 10vh + 10vw );
+    max-height: calc( 10vh + 10vw );
+    border: 1px solid rgb(252, 223, 57);
+    border-radius: 25px;
 }
 
 /*Ici commence le CSS pour la page de chaques recettes */
@@ -136,8 +152,8 @@ body {
 .recette-image {
     background-color: red;
     aspect-ratio: 1/1;
-    max-height: 225px;
-    max-width: 225px;
+    max-height: calc( 30vh + 30vw );
+    max-width: calc( 30vh + 30vw );
     border: 1px solid white;
     border-radius: 30px;
 }

recette.html

@@ -1,5 +1,5 @@
 <div class="recettes">
-    <div class="recette-icone"> <a href="recette-en-dur.php"><img class="recette-image" src="random-recette.jpg"></a></div>
+    <div class="recette-icone"> <a href="recette-en-dur.php"><img class="recette-preview-image" src="random-recette.jpg"></a></div>
     <div class="recette-icone"> 2 </div>
     <div class="recette-icone"> 3 </div>
     <div class="recette-icone"> 4 </div>