diff --git a/main.css b/main.css index 2665d40..319b36c 100644 --- a/main.css +++ b/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; } diff --git a/recette.html b/recette.html index d0748b6..f75ee34 100644 --- a/recette.html +++ b/recette.html @@ -1,5 +1,5 @@