final fixes

Author: amolskh

components/Prize/PrizeExamples.jsx

@@ -3,6 +3,8 @@ import PrizeItems from './PrizeItems'
 
 require('./PrizeExamples.scss')
 
+
+
 const prizeItems = {
   type : 'prize',
   title : 'Prizes',
@@ -48,7 +50,8 @@ const bonusItems = {
     },
     {
       title : 'Checkin',
-      subText : '$50 x 5'
+      subText : '$50',
+      count: '6'
     }
   ]
 }

components/Prize/PrizeExamples.scss

@@ -2,4 +2,5 @@
    background-color: #47474F;
    padding: 15px;
    width: 400px;
+   height: 200px !important;
 }

components/Prize/PrizeItem.scss

@@ -13,14 +13,14 @@ $accent: #59A7FF;
   height: 20px;
   margin-right: 15px;
 
-  span {
+  .subText {
     font-family: "Roboto", Arial, Helvetica, sans-serif;
     font-size: 13px;
     line-height: 15px;
     color: $white;
     font-weight: 500;
   }
-  .prize-circle{
+  .tagged-value-bg{
     display: inline;
     padding: 1px 4px 1px 4px;
     min-width: 15px;
@@ -39,37 +39,37 @@ $accent: #59A7FF;
 
 .prize {
   .PrizeItem:nth-child(1) {
-    .prize-circle{
+    .tagged-value-bg {
       background: $gold;
     }
   }
   .PrizeItem:nth-child(2) {
-    .prize-circle{
+    .tagged-value-bg {
         background: $silver;
     }
   }
 
   .PrizeItem:nth-child(3) {
-    .prize-circle{
+    .tagged-value-bg {
         background: $bronze;
     }
   }
 }
 
 .bonus {
   .PrizeItem:nth-child(1) {
-    .prize-circle {
+    .tagged-value-bg {
       background: $purple;
     }
   }
   .PrizeItem:nth-child(2) {
-    .prize-circle {
+    .tagged-value-bg {
         background: $purple;
     }
   }
 
   .PrizeItem:nth-child(3) {
-    .prize-circle {
+    .tagged-value-bg {
         background: $accent;
     }
   }

components/Prize/PrizeItems.jsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import classNames from 'classnames'
-import PrizeItem from './PrizeItem'
+import TaggedValue from '../TaggedValue/TaggedValue'
 
 require('./PrizeItem.scss')
 
@@ -15,14 +15,14 @@ const PrizeItems = ({type, title, items}) => {
         <div className="title">{title}</div>
         <div className={itemsClass}>
           {items.map((item, index) => {
-            return <PrizeItem title={item.title} subText={item.subText} key={index}/>
+            return <TaggedValue title={item.title} subText={item.subText} count={item.count} style="PrizeItem" key={index}/>
           })}
         </div>
     </div>
   )
 }
 
-PrizeItem.propTypes = {
+PrizeItems.propTypes = {
   type :  React.PropTypes.string,
   items :  React.PropTypes.array
 }