Merge pull request #1697 from OpenBazaar/textAndMiscFixes

Text and misc fixes

Author: jjeffryes

css/obBase.css

@@ -654,27 +654,60 @@ h6, .h6 {
 }
 
 .flexRow .flexCol-11,
-.flexRow .flexCol-11 { flex-basis: 91.66666666666666%; }
+.flexRow .flexCol-11 {
+  flex-basis: 91.66666666666666%;
+  max-width: 91.66666666666666%;
+}
 
-.flexRow .flexCol-10 { flex-basis: 83.33333333333334%; }
+.flexRow .flexCol-10 {
+  flex-basis: 83.33333333333334%;
+  max-width: 83.33333333333334%;
+}
 
-.flexRow .flexCol-9 { flex-basis: 75%; }
+.flexRow .flexCol-9 {
+  flex-basis: 75%;
+  max-width: 75%;
+}
 
-.flexRow .flexCol-8 { flex-basis: 66.66666666666666%; }
+.flexRow .flexCol-8 {
+  flex-basis: 66.66666666666666%;
+  max-width: 66.66666666666666%;
+}
 
-.flexRow .flexCol-7 { flex-basis: 58.333333333333336%; }
+.flexRow .flexCol-7 {
+  flex-basis: 58.333333333333336%;
+  max-width: 58.333333333333336%;
+}
 
-.flexRow .flexCol-6 { flex-basis: 50%; }
+.flexRow .flexCol-6 {
+  flex-basis: 50%;
+  max-width: 50%;
+}
 
-.flexRow .flexCol-5 { flex-basis: 41.66666666666667%; }
+.flexRow .flexCol-5 {
+  flex-basis: 41.66666666666667%;
+  max-width: 41.66666666666667%;
+}
 
-.flexRow .flexCol-4 { flex-basis: 33.33333333333333%; }
+.flexRow .flexCol-4 {
+  flex-basis: 33.33333333333333%;
+  max-width: 33.33333333333333%;
+}
 
-.flexRow .flexCol-3 { flex-basis: 25%; }
+.flexRow .flexCol-3 {
+  flex-basis: 25%;
+  max-width: 25%;
+}
 
-.flexRow .flexCol-2 { flex-basis: 16.666666666666664%;; }
+.flexRow .flexCol-2 {
+  flex-basis: 16.666666666666664%;
+  max-width: 16.666666666666664%;
+}
 
-.flexRow .flexCol-1 { flex-basis: 8.333333333333332%; }
+.flexRow .flexCol-1 {
+  flex-basis: 8.333333333333332%;
+  max-width: 8.333333333333332%;
+}
 
 .flexExpand {
   /* use to make only one item in a flex row expand */
@@ -2541,7 +2574,7 @@ div.chatSearchOut .chatSearchIcon {
   display: inline-block;
   font-weight: 500;
   letter-spacing: 0.2px;
-  word-break: break-all;
+  word-break: break-word;
 }
 
 #inputConversationMessage {
@@ -3157,7 +3190,7 @@ input[type="number"].fieldItem.fieldItem-withButton {
   border: 2px solid transparent;
   color: #fff;
   overflow: auto; /* use customThemeScrollbar to add a scrolbar */
-  word-break: break-all; /* prevent urls from making the text area grow */
+  word-break: break-word; /* prevent urls from making the text area grow */
 }
 
 .fieldItem-textarea:focus {
@@ -4242,6 +4275,7 @@ input[type="checkbox"].fieldItem:checked + label .togLabelOff {
 
 .tooltip.tooltip-box.tooltip-boxUp:hover:after {
   bottom: 120%;
+  top: auto;
 }
 
 .btn-notifications.tooltip:hover:after{

js/App.js

@@ -125,6 +125,7 @@ App.prototype.setUnreadChatMessageCount = function(count) {
 };
 
 App.prototype.intlNumFormat = function(numberToFormat, maxDigits){
+  maxDigits = maxDigits || 8; //default to show down to the satoshi (.00000001)
   return new Intl.NumberFormat(window.lang, {maximumFractionDigits: maxDigits}).format(numberToFormat);
 };
 

js/languages/en-US.json

@@ -146,6 +146,7 @@
   "ShipsFrom": "Ships From",
   "ShipsFrom2": "Ships From %{country}",
   "ShipsTo": "Ships To",
+  "ShipsTo2": "Ships To %{country}",
   "AddShipToRegion": "Shipping Region",
   "AddShipToRegionNote": "Adds All Nations in a Region",
   "SelectRegion": "Add an Optional Region",
@@ -223,6 +224,7 @@
   "International": "International",
   "Time": "Time",
   "Free": "Free",
+  "FreeShipping": "Free Shipping",
   "Category": "Category",
   "ProcessingTime": "Processing Time",
   "SelectPhotos": "Select photos",
@@ -281,7 +283,7 @@
   "NewAvatar": "Select New Avatar",
   "NewCoverImage": "Select New Cover Image",
   "Loading": "Loading...",
-  "CheckExchanges": "Contacting seller's node and updating exchange rates if applicable...",
+  "CheckExchanges": "Contacting vendors's node and updating exchange rates if applicable...",
   "Transactions": "Transactions",
   "Purchases": "Purchases",
   "Sales": "Sales",
@@ -367,7 +369,7 @@
   },
   "moderatorSettings": {
     "DisputeResolution": "Dispute Resolution",
-    "ServiceFee": "Service fee",
+    "ServiceFee": "Dispute fee",
     "ServiceFeeNote": "Min: 0%, Max: 25%"
   },
   "BecomeModerator": "Become a Moderator",
@@ -412,9 +414,9 @@
     "OrderDetails": "Order Details",
     "ViewOnBlockchain": "View Details",
     "BuyerPayout": "Buyer Payout:",
-    "SellerPayout": "Seller Payout:",
+    "SellerPayout": "Vendor Payout:",
     "BuyerAmount": "Buyer Amount:",
-    "SellerAmount": "Seller Amount:",
+    "SellerAmount": "Vendor Amount:",
     "YouEarn": "You Earn:",
     "YourBitcoinPaymentAddress": "Your Bitcoin Payment Address:",
     "searchByOrder": "Search by order id or item name",
@@ -492,7 +494,7 @@
     "PayPurchase": "Pay for this Purchase",
     "CompleteOrder": "Complete Order",
     "CompleteOrderResend": "Resend Order Completion",
-    "CompleteOrderResendTooltip": "If the seller has not yet received the order completion, this button will resend it. This may take several seconds to complete.",
+    "CompleteOrderResendTooltip": "If the vendor has not yet received the order completion, this button will resend it. This may take several seconds to complete.",
     "LeaveReview": "Leave Review",
     "MarkAsShipped": "Mark as Shipped",
     "RateThisTransaction": "Rate this Transaction",
@@ -510,7 +512,7 @@
     "ModerationFee": "Moderation Fee:",
     "DisputeTransaction": "Start a Dispute",
     "DisputeTransactionResend": "Resend Start of Dispute",
-    "DisputeTransactionResendTooltip": "If the other party did not receive your dispute, click this button to send it to them again.",
+    "DisputeTransactionResendTooltip": "If the other party did not receive your dispute, click this button to send a new dispute message.",
     "sendMessagePlaceholder": "Enter message...",
     "DisputeInstructions": "To file a dispute for this transaction, type the reason for the dispute below, and check the Start a Dispute box. This will include the moderator in your conversation until the dispute is resolved. The moderator will make the final decision as to whether any funds are returned to you, and how much. The moderator's fee will be paid out of the funds you have already sent.",
     "SendMessage": "Send",
@@ -520,7 +522,7 @@
     "TotalInTransaction": "Transaction:",
     "StartDisputeFlag": "Dispute Started",
     "CloseDisputeFlag": "Dispute Ended",
-    "PayoutOnlyBuyer": "Closing this dispute will return all of the funds to the buyer, minus the Moderator fee, because the seller has not yet given their bitcoin payout address.",
+    "PayoutOnlyBuyer": "Closing this dispute will return all of the funds to the buyer, minus the Moderator fee, because the vendor has not yet given their bitcoin payout address.",
     "UpdatingOrder": "Updating your transaction",
     "UpdateComplete": "Your transaction update is complete",
     "UpdateFailed": "Your transaction update did not complete. Open the transaction and try again",
@@ -551,7 +553,7 @@
     "pageUnavailable": "This page is currently unavailable.",
     "badHandle": "The handle you entered does not have a valid OpenBazaar ID.",
     "serverDown": "The server has been shut down",
-    "unableToLoadImages": "We were unable to load your image(s).",
+    "unableToLoadImages": "We were unable to load your image. |||| We were unable to load your images.",
     "tooManyPhotosTitle": "Too many photos",
     "tooManyPhotosBody": "Some or all of your photos were prevented from being uploaded because you would exceeded the maximum allowable amount.",
     "badJSON": "The JSON data returned from the server was malformed",
@@ -1022,6 +1024,11 @@
     "ZAMBIA": "Zambia",
     "ZIMBABWE": "Zimbabwe"    
   },
+  "chosenJS": {
+    "noResultsText": "No results match",
+    "placeHolderTextSingle": "Select an option",
+    "placeHolderTextMultiple": "Select some options"
+  },
   "currencies": {
     "AED": "UAE Dirham",
     "AFN": "Afghani",

js/templates/buyAddresses.html

@@ -26,7 +26,7 @@
             <div class="fontWeight500 textOpacity1 textSize14px marginTop25 minWidth120 js-buyWizardAddressSelected ">
               <% if(address.country == ob.vendor_offer.listing.shipping.shipping_origin){ %>
                 <% if(ob.vendor_offer.listing.shipping.free){ %>
-                  <%= polyglot.t('Free') %>
+                  <%= polyglot.t('FreeShipping') %>
                 <% } else { %>
                   <%= ob.displayDomesticShipping %>
                   <% if(ob.userCurrencyCode != 'BTC'){ %>
@@ -35,7 +35,7 @@
                 <% } %>
               <% } else { %>
                 <% if(ob.vendor_offer.listing.shipping.free){ %>
-                  <%= polyglot.t('Free') %>
+                  <%= polyglot.t('FreeShipping') %>
                 <% } else { %>
                   <%= ob.displayInternationalShipping %>
                   <% if(ob.userCurrencyCode != 'BTC'){ %>

js/templates/buyDetails.html

@@ -21,7 +21,7 @@
                   <% } %>
               </div>
             </div>
-            <div class="pad10left txt-unleaded">
+            <div class="pad10left">
               <div class="marginTop12 marginBottom4 fontSize13 noOverflow"><strong><%= ob.vendor_offer.listing.item.title %></strong></div>
               <div class="noOverflow fontSize13 txt-fade"><%= polyglot.t('transactions.Vendor2') %> <% if(ob.page.profile.handle){ %><%= ob.page.profile.handle %><% } else { %><%= ob.page.profile.guid %><% } %></div>
             </div>
@@ -113,7 +113,7 @@
                   <% } %>
               </div>
             </div>
-            <div class="pad10left txt-unleaded">
+            <div class="pad10left">
               <div class="marginTop6 marginBottom4 fontSize13 noOverflow marginBottom4">
                 <%= polyglot.t('Moderator2') %>
                 <% if(ob.selectedModerator.blockchain_id){ %>
@@ -134,7 +134,7 @@
                     <% } %>
                 </div>
               </div>
-              <div class="pad10left txt-unleaded">
+              <div class="pad10left">
                 <div class="marginTop6 marginBottom4 fontSize13 noOverflow"><%= polyglot.t('buyFlow.DirectPayment') %> <%= ob.handle %></div>
                 <div class="textOpacity75 lineHeight15">
                   (<%= polyglot.t('buyFlow.directPaymentDisclaimer') %>)

js/templates/buyWizard.html

@@ -324,7 +324,7 @@ <h2 class="margin0 marginTop80"><%= polyglot.t('buyFlow.HaveWallet') %></h2>
                                             <% if(moderator.handle){ %><%= moderator.handle %><% } else { %><%= moderator.guid %><% } %>
                                             </div>
                                           </div>
-                                          <div class="floatRight textOpacity75"><%= ob.intlNumFormat(moderator.numFee) %></div>
+                                          <div class="floatRight textOpacity75"><%= ob.intlNumFormat(moderator.numFee) %>%</div>
                                         </div>
                                       </div>
                                     </div>

js/templates/chatMessage.html

@@ -5,7 +5,7 @@
 <div class="chatConversationMessageLine <% if(ob.message_type == "ORDER" || ob.message_type == "DISPUTE_OPEN" || ob.message_type == "dispute_open") { %>padding2015 borderBottom1 custCol-border<% } %>">
     <div class="flexRow">
         <div class="chatConversationMessageTimestamp paddingLeft2 <% if (ob.outgoing) { %>width100 alignRight<% } %>">
-            <div><%= ob.moment(new Date(ob.timestamp * 1000)).format('MMM D, h:mm A') %></div>
+            <div><%= ob.moment(new Date(ob.timestamp * 1000)).locale(window.lang).format('MMM D, h:mm A') %></div>
         </div>
     </div>
     <div class="flexRow noFlexWrap marginTop4">

js/templates/item.html

@@ -188,30 +188,26 @@ <h4><%= polyglot.t('CanBeShippedTo') %></h4>
         <% if(ob.vendor_offer.listing.shipping.shipping_regions.length || ob.vendor_offer.listing.policy.returns || ob.vendor_offer.listing.policy.terms_conditions) { %>
           <div class="flexCol-6">
             <div class="rowItem fontSize16 padding30 lineHeight24 fontWeight400">
-              <% if(ob.displayShippingOrigin){ %>
-                <h3><%= polyglot.t('ShipsFrom2', {country: ob.displayShippingOrigin}) %></h3>
-                <h3><% if(ob.worldwide){print(polyglot.t('Worldwide'));}else{print(polyglot.t('Local'));} %></h3>
+              <h3><% if(ob.worldwide){print(polyglot.t('Worldwide'));}else{print(polyglot.t('Local'));} %></h3>
+              <div>
+                <% if(ob.userCurrencyCode != "BTC"){ %>
+                <%= polyglot.t('Shipping2') %> <%= ob.displayDomesticShipping %> (<%= ob.intlNumFormat(ob.domesticShippingBTC, 8) %> BTC)
+              <% } else { %>
+                <%= polyglot.t('Shipping2') %> <%= ob.intlNumFormat(ob.domesticShippingBTC, 8) %> BTC
+              <% } %>
+              </div>
+              <p><%= polyglot.t('transactions.EstimatedDelivery') %> <%= ob.vendor_offer.listing.shipping.est_delivery.domestic %></p>
+              <% if(!ob.worldwide && ob.internationalShippingBTC){ %>
+                <hr/>
+                <h3><%= polyglot.t('International') %></h3>
                 <div>
                   <% if(ob.userCurrencyCode != "BTC"){ %>
-                  <%= polyglot.t('Shipping2') %> <%= ob.displayDomesticShipping %> (<%= ob.intlNumFormat(ob.domesticShippingBTC, 8) %> BTC)
+                    <%= polyglot.t('Shipping2') %> <%= ob.displayInternationalShipping %> (<%= ob.intlNumFormat(ob.internationalShippingBTC, 8) %> BTC)
                 <% } else { %>
-                  <%= polyglot.t('Shipping2') %> <%= ob.intlNumFormat(ob.domesticShippingBTC, 8) %> BTC
+                  <%= polyglot.t('Shipping2') %> <%= ob.intlNumFormat(ob.internationalShippingBTC, 8) %> BTC
                 <% } %>
                 </div>
-                <p><%= polyglot.t('transactions.EstimatedDelivery') %> <%= ob.vendor_offer.listing.shipping.est_delivery.domestic %></p>
-                <% if(ob.internationalShippingBTC){ %>
-                  <hr/>
-                  <h3><%= polyglot.t('International') %></h3>
-                  <div>
-                    <% if(ob.userCurrencyCode != "BTC"){ %>
-                      <%= polyglot.t('Shipping2') %> <%= ob.displayInternationalShipping %> (<%= ob.intlNumFormat(ob.internationalShippingBTC, 8) %> BTC)
-                  <% } else { %>
-                    <%= polyglot.t('Shipping2') %> <%= ob.intlNumFormat(ob.internationalShippingBTC, 8) %> BTC
-                  <% } %>
-                  </div>
-                  <p><%= polyglot.t('transactions.EstimatedDelivery') %> <%= ob.vendor_offer.listing.shipping.est_delivery.international %></p>
-                <% } %>
-                <hr/>
+                <p><%= polyglot.t('transactions.EstimatedDelivery') %> <%= ob.vendor_offer.listing.shipping.est_delivery.international %></p>
               <% } %>
               <% if(ob.vendor_offer.listing.policy.returns) { %>
                 <h3><%= polyglot.t('ReturnsPolicy') %></h3>
@@ -225,7 +221,12 @@ <h3><%= polyglot.t('TermsAndConditions') %></h3>
           </div>
           <div class="flexCol-6">
             <div class="rowItem fontSize16 padding30 lineHeight24 fontWeight400">
-              <% if (ob.shippingRegionsDisplay.length) { %>
+              <% if(ob.displayShippingOrigin){ %>
+                <h3><%= polyglot.t('ShipsFrom2', {country: ob.displayShippingOrigin}) %></h3>
+              <% } %>
+              <% if (ob.shippingRegionsDisplay.length == 1){ %>
+                <h3><%= polyglot.t('ShipsTo2', {country: ob.shippingRegionsDisplay[0]}) %></h3>
+              <% } else if (ob.shippingRegionsDisplay.length) { %>
               <h3><%= polyglot.t('ShipsTo') %></h3>
               <% _.each(ob.shippingRegionsDisplay, function(data, i) { %>
               <div class="row5">

js/templates/itemEdit.html

@@ -88,18 +88,22 @@ <h5><%= polyglot.t('Listing') %></h5>
               </div>
             </div>
           </div>
-          <div class="flexRow custCol-border js-inputParent">
+          <div class="flexRow custCol-border js-inputParent zIndex1">
             <div class="flexCol-3  borderRight custCol-border">
               <div class="fieldItem">
                 <label for="priceLocal">
                   <%= polyglot.t('Price') %> (<%= ob.userCurrencyCode %>)
                 </label>
-                <div class="underline note rowTop5">
-                  <a href="#settings" class="tooltip tooltip-box" data-tooltip="<%= polyglot.t('ChangeCurrencyHelp') %>"><%= polyglot.t('ChangeCurrency') %></a>
+                <div class="underline rowTop5">
+                  <a href="#settings" class="tooltip tooltip-box" data-tooltip="<%= polyglot.t('ChangeCurrencyHelp') %>">
+                    <span class="note">
+                      <%= polyglot.t('ChangeCurrency') %>
+                    </span>
+                  </a>
                 </div>
               </div>
             </div>
-            <div class="flexCol-5">
+            <div class="flexCol-4">
               <input type="number" step="any" name="price" id="inputPrice" class="hide" />
               <input type="text" name="currency_code" id="inputCurrencyCode" class="hide" />
               <input type="number" name="priceLocal" step="any" class="fieldItem js-priceLocal custCol-text"  id="priceLocal" value="<%= ob.price %>" required
@@ -110,8 +114,15 @@ <h5><%= polyglot.t('Listing') %></h5>
                 <% } %>
               >
             </div>
-            <div class="flexCol-4">
-              <span class="fieldItem txt-placeholder"><%= polyglot.t('MinimumIs', { amount: ob.userCurrencyCode == "BTC" ? ob.intlNumFormat(0.0002, 4) : ob.intlNumFormat(window.currentBitcoin * 0.0002, 4) }) %> <span class="ion-help-circled fontSize12 tooltip" data-tooltip="<%= polyglot.t('MinimumPrice') %>"></span></span>
+            <div class="flexCol-5">
+              <span class="fieldItem pull-right">
+                <span class="tooltip" data-tooltip="<%= polyglot.t('MinimumPrice') %>">
+                  <span class="txt-placeholder">
+                    <%= polyglot.t('MinimumIs', { amount: ob.userCurrencyCode == "BTC" ? ob.intlNumFormat(0.0002, 4) : ob.intlNumFormat(window.currentBitcoin * 0.0002, 4) }) %>
+                    <span class="ion-help-circled fontSize12"></span>
+                  </span>
+                </span>
+              </span>
             </div>
           </div>
           <div class="flexRow custCol-border js-shippingRow">