UI Mechanics / New Look (orange - gray)

src/styles/DishList.scss

@@ -3,16 +3,30 @@
 
 h4 {
   font-weight: 400;
+  margin-left: 1rem;
 }
 
 .carddish-container {
-  margin-top: 20px;
-  margin-bottom: 20px;
+  background-color: #303030;
+  border-radius: 10px;
+  margin-right: auto;
+  margin-left: auto;
+  margin-top: 10px;
+  margin-bottom: 10px;
+  padding: 20px;
   display: flex;
-  width: 100%;
+  justify-content: space-between;
+  width: 95%;
+  cursor: pointer;
+  transition: all 0.25s;
 
   h2 {
     font-weight: 300;
+    color: $main-color;
+    margin-top: 1rem;
+  }
+  &:hover {
+    background-color: #3a3a3a;
   }
 }
 
@@ -20,10 +34,18 @@ h4 {
   background-color: $secondary-color;
   width: 150px;
   height: 150px;
-  border-radius: 75px;
+  border-radius: 10px;
   margin: 0px 20px 0px 0px;
 }
 
 .carddish-left {
   display: flex;
 }
+
+.carddish-right {
+  h5 {
+    font-weight: 500;
+    font-size: 1.2rem;
+    margin-top: 1rem;
+  }
+}