sass/css/_shop.scss

@@ -160,7 +160,7 @@ button {
                 font-size: .8rem;
 
                 table {
-                    max-width: 450px;
+                    max-width: 350px;
                 }
 
                 .summary-remove-all {
@@ -176,7 +176,7 @@ button {
                 }
 
                 .price {
-                    text-align: right;
+                    text-align: left;
                 }
 
                 .item-card-name > div,

static/js/shop.jsx

@@ -108,24 +108,6 @@ const nbrOccupiedSlotsInCrate = (items) => {
   }, 0);
 };
 
-function formatMoney(amount, decimalCount = 2, decimal = ".", thousands = ",") {
-  // https://stackoverflow.com/questions/149055/how-can-i-format-numbers-as-currency-string-in-javascript
-  // changes: return amount if error in order to avoid empty value
-  try {
-    decimalCount = Math.abs(decimalCount);
-    decimalCount = isNaN(decimalCount) ? 2 : decimalCount;
-
-    const negativeSign = amount < 0 ? "-" : "";
-
-    let i = parseInt(amount = Math.abs(Number(amount) || 0).toFixed(decimalCount)).toString();
-    let j = (i.length > 3) ? i.length % 3 : 0;
-
-    return negativeSign + (j ? i.substr(0, j) + thousands : '') + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + thousands) + (decimalCount ? decimal + Math.abs(amount - i).toFixed(decimalCount).slice(2) : "");
-  } catch (e) {
-    return amount;
-  }
-};
-
 
 /**
  * Component that provides a base layout (aside/main) for the page.
@@ -214,7 +196,7 @@ class ProductItem extends React.PureComponent {
         <div className="content">
           <h3>{name}</h3>
 
-          <div className="price">{`${currency} ${formatMoney(price)}`}</div>
+          <div className="price">{`${currency} ${price}`}</div>
 
           {render_specs}
         </div>
@@ -456,7 +438,7 @@ class ProductCartItem extends React.PureComponent {
 
               <img src="/images/shop/icon-remove.svg" alt="rm"/>
 
-              <p>Remove</p>
+              <p>remove</p>
             </div>
 
             {/* progression container */}
@@ -909,18 +891,11 @@ class OrderSumary extends React.PureComponent {
               <tr>
                 <td className="item-card-name">{mode.name}</td>
                 <td className="price">
-                  <div>
+                  {`${currency} ${mode.price}`}
-                    {`${currency} ${formatMoney(mode.price)}`}
 
-                    <button style={{'opacity': '0', 'cursor': 'initial'}}>
+                  <button style={{'opacity': '0', 'cursor': 'initial'}}>
-                      <img src="/images/shop/icon-remove.svg" />
+                    <img src="/images/shop/icon-remove.svg" />
-                    </button>
+                  </button>
-                  </div>
-
-                  <span style={{
-                    'display': 'inline-block',
-                    'width': '30px',
-                  }}>&nbsp;</span>
                 </td>
               </tr>
             )}
@@ -952,7 +927,7 @@ class OrderSumary extends React.PureComponent {
 
                   <td className="price">
                     <div>
-                      {`${currency} ${formatMoney(item.price)}`}
+                      {`${currency} ${item.price}`}
 
                       <button onClick={this.handleOnDeleteItem.bind(this, index)}>
                         <img src="/images/shop/icon-remove.svg" />
@@ -966,13 +941,6 @@ class OrderSumary extends React.PureComponent {
                           src={`/images/${warning.icon}`}
                       />
                     )}
-
-                    {!warning && (
-                      <span style={{
-                        'display': 'inline-block',
-                        'width': '30px',
-                      }}>&nbsp;</span>
-                    )}
                   </td>
                 </tr>
               );
@@ -983,26 +951,19 @@ class OrderSumary extends React.PureComponent {
             <tr>
               <td className="item-card-name">Price estimate</td>
               <td className="price">
-                <div>
+                {summary.length ? (
-                  {summary.length ? (
+                  `${currency} ${summary.reduce(
-                    `${currency} ${formatMoney(summary.reduce(
+                    (prev, next) => {
-                      (prev, next) => {
+                      return prev + next.price;
-                        return prev + next.price;
+                    }, 0
-                      }, 0
+                  ) + mode.price}`
-                    ) + mode.price)}`
+                ) : (
-                  ) : (
+                  `${currency} ${mode.price}`
-                    `${currency} ${formatMoney(mode.price)}`
+                )}
-                  )}
 
-                  <button style={{'opacity': '0', 'cursor': 'initial'}}>
+                <button style={{'opacity': '0', 'cursor': 'initial'}}>
-                    <img src="/images/shop/icon-remove.svg" alt="icon remove"/>
+                  <img src="/images/shop/icon-remove.svg" alt="icon remove"/>
-                  </button>
+                </button>
-                </div>
-
-                <span style={{
-                  'display': 'inline-block',
-                  'width': '30px',
-                }}>&nbsp;</span>
               </td>
             </tr>
           </tfoot>