[ADD] styles to cart item

src/App.vue

@@ -32,12 +32,12 @@
         background: #fff
 
         .products-container
-            width: calc(100% - 350px)
+            width: calc(100% - 300px)
             height: 100%
             padding-right: 5px
              
         .cart-container
-            width: 350px
+            width: 300px
             height: 100%
             border-left: 1px solid #d3d3d3
             padding-left: 10px

src/components/CartItem.vue

@@ -1,6 +1,11 @@
 <template lang="pug">
     .cart-item
-        h3 {{ data.name }}
+        h3.item-name {{ data.name }}
+        input.item-quantity(type="text" value="1")
+        span.item-x x
+        span.item-price Gs {{ data.price }}
+        span.item-equals =
+        span.item-subtotal Gs {{ data.price }}
 </template>
 
 <script>
@@ -12,17 +17,58 @@
                     return {}
                 }
             }
-        },
-        mounted() {
-            console.log(this)
         }
     }
 </script>
 
 <style lang="sass">
     .cart-item
-        width: 100%
-        height: 65px
-        margin-bottom: 5px
-        border: 1px solid #d3d3d3
+        width: 98%
+        height: 85px
+        border-bottom: 1px solid #d3d3d3
+
+        .item-name
+            width: 100%
+            height: 15px
+            margin: 5px
+            float: left
+            font:
+                size: 11pt
+
+        .item-quantity
+            width: 50px
+            height: 30px
+            margin-top: 6px
+            text-align: right
+            float: left   
+
+        .item-x
+            width: 20px
+            height: 20px
+            margin-top: 12px
+            text-align: center
+            float: left
+
+        .item-price
+            width: 80px
+            height: 20px
+            margin-top: 12px
+            text-align: right
+            float: left
+
+        .item-equals
+            width: 20px
+            height: 20px
+            margin-top: 12px
+            text-align: center
+            float: left
+
+        .item-subtotal
+            width: 100px
+            height: 20px
+            margin-top: 12px
+            padding-right: 15px
+            text-align: right
+            float: right
+            font-weight: bold
 </style>