diff options
author | Jacob <gatelyjm@clarkson.edu> | 2019-12-10 04:44:33 -0500 |
---|---|---|
committer | Jacob <gatelyjm@clarkson.edu> | 2019-12-10 04:44:33 -0500 |
commit | 7698331e4bb85232535182eeeaa09fdf54b66a76 (patch) | |
tree | 96d6f523a7d428d6b407cf622d322655bfc066ec /recipeBuddy/src/app/recipe-card/recipe-card.component.css | |
parent | 1b23ba09800009f484b9ab6a49a5626b0baaf504 (diff) |
Update main page to put recipes three wide, and to work
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 |