From fc9f7496d2361b537fd6706dfc8043c5fdd90610 Mon Sep 17 00:00:00 2001
From: Senad Uka <senad.uka@gmail.com>
Date: Thu, 16 Apr 2015 06:45:38 +0200
Subject: [PATCH] number of items in cart is now properly aligned

---
 front-ui/app/components/cart/cartIcon.js    | 16 ++++++++++++----
 front-ui/app/components/items/singleItem.js |  6 ++----
 front-ui/app/css/main.css                   |  5 +++++
 3 files changed, 19 insertions(+), 8 deletions(-)

diff --git a/front-ui/app/components/cart/cartIcon.js b/front-ui/app/components/cart/cartIcon.js
index e61fc5f..77a8be8 100644
--- a/front-ui/app/components/cart/cartIcon.js
+++ b/front-ui/app/components/cart/cartIcon.js
@@ -3,24 +3,32 @@ var CartStore = require('../../stores/cartStore.js');
 var CartActions = require('../../actions/cartActions.js');
 var NavigationActions = require('../../actions/navigationActions.js');
 var LoginStatus = require('../shared/loginStatus');
-
-
+  
+ 
 
 var cartStyle = { 
   fontSize: '50px'
 };
 
+var normalizeCount = function(count) {
+  if (count >= 0 && count < 10) {
+    return "\u00a0" + count; 
+  }  else {
+    return count;
+  }
+}
+
 var CartIcon = React.createClass({
 
   render: function() {  
 
   	  var textNotificationStyle = (this.state.count > 0)  ? { display: 'inline-block'} : { display: 'none'} ;
 
-      return (
+      return ( 
 
          <ul className="nav navbar-nav navbar-right">
                             <li><LoginStatus /></li>
-                            <li onClick={this._onClick} style={{borderTop: 'solid lightgray 1px', borderBottom: 'solid lightgray 1px', borderLeft: 'solid lightgray 1px', paddingBottom: 22}}><a ><div className="mycart"><span>{this.state.count}</span></div></a></li>
+                            <li onClick={this._onClick} style={{borderTop: 'solid lightgray 1px', borderBottom: 'solid lightgray 1px', borderLeft: 'solid lightgray 1px', paddingBottom: 22}}><a ><div className="mycart"><span>{normalizeCount(this.state.count)}</span></div></a></li>
                             <li onClick={this._onClick} style={{borderTop: 'solid lightgray 1px', borderBottom: 'solid lightgray 1px', paddingBottom: 2}}><a href="#">0,00 KM</a></li>
                             <li onClick={this._onClick} style={{borderTop: 'solid lightgray 1px', borderBottom: 'solid lightgray 1px', borderRight: 'solid lightgray 1px'}}><a style={{marginLeft: 20, marginBottom: 10, marginRight: 15}} className="mybutton" href="#">Završi narudžbu</a></li>                            
           </ul>
diff --git a/front-ui/app/components/items/singleItem.js b/front-ui/app/components/items/singleItem.js
index d7b3811..609da0d 100644
--- a/front-ui/app/components/items/singleItem.js
+++ b/front-ui/app/components/items/singleItem.js
@@ -34,10 +34,8 @@ var SingleItem = React.createClass({
             <img className="img-responsive" src={firstImage.resized_url} alt="product image" />
             <div>
               <div>
-               
-                <p>{ this.props.item.get('brand') ? this.props.item.get('brand').name : '' }{ this.props.item.get('name') }</p>
-                <h4> { this.props.item.get('list_price') } KM </h4>
-               
+              <p>{ this.props.item.get('brand') ? this.props.item.get('brand').name : '' }{ this.props.item.get('name') }</p>
+              <h4>{ this.props.item.get('list_price') } KM </h4>
               </div>
             </div>
           </div>
diff --git a/front-ui/app/css/main.css b/front-ui/app/css/main.css
index 0778003..91cf455 100644
--- a/front-ui/app/css/main.css
+++ b/front-ui/app/css/main.css
@@ -339,13 +339,18 @@ background-size: cover;
     padding-bottom: 0px;
     right:-14px;
     bottom: -15px;
+    text-align: right;
         
 }
+.mycart div {
+    text-align: right;
+}
 .mycart span{
 position: absolute;
 left: 13.4px;
 top: 4px;
 color: black;
+
 }
 .mycart span:hover{