Create index.css

Existing_API_Collection/Food_Receipe/src/index.css

@@ -0,0 +1,77 @@
+body {
+  display: flex;
+  min-height: 100vh;
+  flex-direction: column;
+}
+
+main {
+  flex: 1 0 auto;
+}
+
+.card-image:hover,
+.card-content:hover {
+  cursor: pointer;
+}
+
+a.view-recipe:hover {
+  color: brown;
+}
+
+.margin-tb {
+  margin: 2rem auto 2rem;
+}
+
+.mb-3 {
+  margin-bottom: 3rem;
+}
+
+.ingredients-section {
+  margin: 5em auto 3em;
+  padding-top: 1em;
+  padding-bottom: 1em;
+}
+
+.card-action:hover {
+  background-color: rgb(218, 218, 202);
+}
+
+p span {
+  font-size: medium;
+}
+
+.input-field:focus {
+  border-bottom: 1px solid #ffff00 !important;
+  box-shadow: 0 1px 0 0 #ffd600 !important;
+}
+
+.input-field {
+  color: white;
+}
+
+.player-wrapper {
+  position: relative;
+  padding-top: 56.25%; /* Player ratio: 100 / (1280 / 720) */
+}
+
+.react-player {
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+
+.meal-info {
+  max-height: 90vh;
+}
+
+.mobile-input {
+  color: brown;
+}
+
+.border-btm {
+  border-bottom: 1px solid #ffff00 !important;
+  box-shadow: 0 1px 0 0 #ffd600 !important;
+}
+
+.disabled {
+  visibility: hidden;
+}