diff options
Diffstat (limited to 'recipeBuddy/src/app/recipe-card/recipe-card.component.css')
-rw-r--r-- | recipeBuddy/src/app/recipe-card/recipe-card.component.css | 66 |
1 files changed, 20 insertions, 46 deletions
diff --git a/recipeBuddy/src/app/recipe-card/recipe-card.component.css b/recipeBuddy/src/app/recipe-card/recipe-card.component.css index 8cf412a..7b0fd3b 100644 --- a/recipeBuddy/src/app/recipe-card/recipe-card.component.css +++ b/recipeBuddy/src/app/recipe-card/recipe-card.component.css @@ -1,21 +1,10 @@ - .example-viewport{ - height: 250px; - width: 80%; - margin-left: 50px; - border: 1px solid saddlebrown; +.example-viewport { + height: 500px; + width: 100%; display: flex; - } - .list{ - height: 50px; - justify-content: center; - align-items: center; - } - h2{ - margin-left: 40px; - } - .container{ - margin-bottom: 40px; - } + margin-left: auto; + margin-right: auto; +} p { font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif; } @@ -46,33 +35,9 @@ button{ margin:0 auto;width:100px; } .example-card { - max-width: 400px; float: left; - width:25%; - padding: 0px 35px; -} -.example-header-image { - background-image: url('https://material.angular.io/assets/img/examples/shiba1.jpg'); - background-size: cover; -} -#like-rating { - height: auto; - width: auto; - max-width: 200px; - max-height: 1000px; - background-size: contain; -} -#like-rating img{ - width:100%; -} -#rating { - height: auto; - width: auto; - max-width: 200px; - max-height: 1000px; -} -#rating img { - width:100%; + width: 100%; + margin: 10px; } #edit { padding: 10px; @@ -86,9 +51,6 @@ button{ #delete { padding: 10px; } -#previous { - float:left; -} .example-card:hover { border: solid; } @@ -96,4 +58,16 @@ button{ font-weight: bold; cursor: pointer; padding: 10px; +} +#imgContainer { + padding:10px; + text-align:center; +} +#ratingContainer { + padding:10px; +} +#cardContainer { + width: 35%; + padding: 5%; + float: left; }
\ No newline at end of file |