Skip to content
This repository was archived by the owner on May 16, 2019. It is now read-only.

Commit d5b4372

Browse files
authored
Merge pull request #1759 from OpenBazaar/updateBTCPrice
Add avatars to dispute payout form.
2 parents e4995ee + eaf5039 commit d5b4372

File tree

2 files changed

+62
-33
lines changed

2 files changed

+62
-33
lines changed

css/obBase.css

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1122,6 +1122,11 @@ label.fieldItem {
11221122
position: relative;
11231123
}
11241124

1125+
.fieldItem.thumbnail-small {
1126+
min-height: 30px;
1127+
margin: 10px 0 10px 10px;
1128+
}
1129+
11251130
.thumbnail {
11261131
height: 54px;
11271132
width: 54px;
@@ -2980,6 +2985,10 @@ label {
29802985
margin: 0;
29812986
}
29822987

2988+
.fieldItem.plainText {
2989+
line-height: 20px;
2990+
}
2991+
29832992
input[type="text"].fieldItem,
29842993
input[type="number"].fieldItem,
29852994
input[type="email"].fieldItem,

js/templates/transactionModal.html

Lines changed: 53 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -156,7 +156,7 @@ <h3 class="txt-bright"><%= polyglot.t('CheckExchanges') %> </h3>
156156
</div>
157157
<% } %>
158158

159-
159+
160160
<div class="modal-hero js-transactionsConfirmOrderHolder confirmOrderHolder custCol-primary-darken overflowHidden">
161161
<div class="positionTop width100">
162162
<div class="js-confirm">
@@ -171,10 +171,10 @@ <h3 class="txt-bright"><%= polyglot.t('CheckExchanges') %> </h3>
171171
<span class="ion-checkmark fontSize11 marginRight2 textOpacity1"></span>
172172
<%= polyglot.t('Save') %>
173173
</a>
174-
</div>
174+
</div>
175175
<div class="pull-right textOpacity1">
176176
<a class="btn btn-txt custCol-primary js-hideConfirmForm textOpacity1"><%= polyglot.t('Cancel') %></a>
177-
</div>
177+
</div>
178178
</div>
179179
</div>
180180
<form id="transactionConfirmForm" class="flexRow scrollOverflowY custCol-border borderTop customThemeScrollbar fontSize13" style="height: 199px">
@@ -325,10 +325,10 @@ <h3 class="txt-bright"><%= polyglot.t('CheckExchanges') %> </h3>
325325
<div class="width100">
326326
<div class="fontSize15 pull-left noOverflow lineHeight32">
327327
<span><%= polyglot.t('transactions.TransactionReview') %></span>
328-
</div>
328+
</div>
329329
<div class="pull-right textOpacity1">
330330
<a class="btn btn-txt custCol-primary js-hideFeedbackRating textOpacity1"><%= polyglot.t('Close') %></a>
331-
</div>
331+
</div>
332332
</div>
333333
</div>
334334
</div>
@@ -396,7 +396,7 @@ <h3 class="txt-bright"><%= polyglot.t('CheckExchanges') %> </h3>
396396
<div class="fontSize15 pull-left noOverflow lineHeight32">
397397
<span class="fontSize13 ion-star marginLeft5"></span>
398398
<span><%= polyglot.t('transactions.RateThisTransaction') %></span>
399-
</div>
399+
</div>
400400
<div class="pull-right textOpacity1 marginLeft4">
401401
<a class="btn btn-txt custCol-primary js-completeOrder">
402402
<span class="ion-checkmark fontSize11 marginRight2 textOpacity1"></span>
@@ -405,9 +405,9 @@ <h3 class="txt-bright"><%= polyglot.t('CheckExchanges') %> </h3>
405405
</div>
406406
<div class="pull-right textOpacity1">
407407
<a class="btn btn-txt custCol-primary js-completeOrderHide textOpacity1"><%= polyglot.t('Cancel') %></a>
408-
</div>
408+
</div>
409409
</div>
410-
</div>
410+
</div>
411411
<form id="transactionCompleteForm" class="flexRow scrollOverflowY custCol-border borderTop customThemeScrollbar" style="height: 213px">
412412
<div class="flexRow custCol-border">
413413
<div class="flexCol-4 borderRight custCol-border">
@@ -511,7 +511,7 @@ <h3 class="txt-bright"><%= polyglot.t('CheckExchanges') %> </h3>
511511
<label for="customer_service2" class="tooltip height24" data-tooltip="<%= polyglot.t('customerServiceRatingKeys.twoStar') %>"></label>
512512
<input name="customer_service" id="customer_service3" type="radio" class="fieldItem starRating" value = 3 checked>
513513
<label for="customer_service3" class="tooltip height24" data-tooltip="<%= polyglot.t('customerServiceRatingKeys.threeStar') %>"></label>
514-
<input name="customer_service" id="customer_service4" type="radio" class="fieldItem starRating" value = 4 checked>
514+
<input name="customer_service" id="customer_service4" type="radio" class="fieldItem starRating" value = 4 checked>
515515
<label for="customer_service4" class="tooltip height24" data-tooltip="<%= polyglot.t('customerServiceRatingKeys.fourStar') %>"></label>
516516
<input name="customer_service" id="customer_service5" type="radio" class="fieldItem starRating" value = 5 checked>
517517
<label for="customer_service5" class="tooltip height24" data-tooltip="<%= polyglot.t('customerServiceRatingKeys.fiveStar') %>"></label>
@@ -547,12 +547,12 @@ <h3 class="txt-bright"><%= polyglot.t('CheckExchanges') %> </h3>
547547
<div class="fontSize15 pull-left noOverflow lineHeight32">
548548
<span class="fontSize13 ion-code marginLeft5"></span>
549549
<span><%= polyglot.t('transactions.ContractDetails') %></span>
550-
</div>
550+
</div>
551551
<div class="pull-right textOpacity1">
552552
<a class="btn btn-txt custCol-primary js-transactionHideContract textOpacity1 hide">
553553
<%= polyglot.t('transactions.HideDetails') %>
554554
</a>
555-
</div>
555+
</div>
556556
</div>
557557
</div>
558558
</div>
@@ -1119,33 +1119,53 @@ <h3 class="txt-bright"><%= polyglot.t('CheckExchanges') %> </h3>
11191119

11201120
<% if(ob.vendor_order_confirmation){ %>
11211121
<div class="flexRow">
1122-
<div class="flexCol-4 borderRight custCol-border">
1123-
<div class="fieldItem"><%= polyglot.t('transactions.BuyerAmount') %></div>
1122+
<div class="flexCol-6 borderRight custCol-border">
1123+
<div class="flexRow">
1124+
<div class="fieldItem thumbnail-small" <% if(ob.buyerAvatarURL) { %>
1125+
style="background-image: url(<%- ob.buyerAvatarURL %>), url(imgs/defaultUser.png);">
1126+
<% } else { %>
1127+
style="background-image: url(imgs/defaultUser.png);"
1128+
<% } %>>
1129+
</div>
1130+
<div class="fieldItem plainText"><%= polyglot.t('transactions.BuyerAmount') %></div>
1131+
</div>
11241132
</div>
1125-
<div class="flexCol-8 borderRight custCol-border padding10">
1126-
<span class="marginRight10">
1127-
<input type="number"
1128-
id="transactionsBuyerPayoutPercent"
1129-
max="100" min="0" step="0.1"
1130-
style="width: 50px"
1131-
value="50">%
1132-
</span>
1133-
<span id="transactionsBuyerPayoutBTC" class=""></span>
1133+
<div class="flexCol-6 borderRight custCol-border">
1134+
<div class="fieldItem">
1135+
<span class="marginRight10">
1136+
<input type="number"
1137+
id="transactionsBuyerPayoutPercent"
1138+
max="100" min="0" step="0.1"
1139+
style="width: 50px"
1140+
value="50">%
1141+
</span>
1142+
<span id="transactionsBuyerPayoutBTC" class=""></span>
1143+
</div>
11341144
</div>
11351145
</div>
11361146
<div class="flexRow">
1137-
<div class="flexCol-4 borderRight custCol-border">
1138-
<div class="fieldItem"><%= polyglot.t('transactions.SellerAmount') %></div>
1147+
<div class="flexCol-6 borderRight custCol-border">
1148+
<div class="flexRow">
1149+
<div class="fieldItem thumbnail-small" <% if(ob.vendorAvatarURL) { %>
1150+
style="background-image: url(<%- ob.vendorAvatarURL %>), url(imgs/defaultUser.png);">
1151+
<% } else { %>
1152+
style="background-image: url(imgs/defaultUser.png);"
1153+
<% } %>>
1154+
</div>
1155+
<div class="fieldItem plainText"><%= polyglot.t('transactions.SellerAmount') %></div>
1156+
</div>
11391157
</div>
1140-
<div class="flexCol-8 borderRight custCol-border padding10">
1141-
<span class="marginRight10">
1142-
<input type="number"
1143-
id="transactionsSellerPayoutPercent"
1144-
max="100" min="0" step="0.1"
1145-
style="width: 50px"
1146-
value="50">%
1147-
</span>
1148-
<span id="transactionsSellerPayoutBTC" class=""></span>
1158+
<div class="flexCol-6 borderRight custCol-border">
1159+
<div class="fieldItem">
1160+
<span class="marginRight10">
1161+
<input type="number"
1162+
id="transactionsSellerPayoutPercent"
1163+
max="100" min="0" step="0.1"
1164+
style="width: 50px"
1165+
value="50">%
1166+
</span>
1167+
<span id="transactionsSellerPayoutBTC" class=""></span>
1168+
</div>
11491169
</div>
11501170
</div>
11511171
<% } else {%>

0 commit comments

Comments
 (0)