diff --git a/src/js/controllers/modals/txpDetails.js b/src/js/controllers/modals/txpDetails.js
index ca05f5027..853383dd1 100644
--- a/src/js/controllers/modals/txpDetails.js
+++ b/src/js/controllers/modals/txpDetails.js
@@ -18,10 +18,20 @@ angular.module('copayApp.controllers').controller('txpDetailsController', functi
$scope.color = $scope.wallet.color;
$scope.data = {};
$scope.hasClick = platformInfo.hasClick;
+ $scope.displayAmount = getDisplayAmount(tx.amountStr);
+ $scope.displayUnit = getDisplayUnit(tx.amountStr);
initActionList();
checkPaypro();
}
+ function getDisplayAmount(amountStr) {
+ return amountStr.split(' ')[0];
+ }
+
+ function getDisplayUnit(amountStr) {
+ return amountStr.split(' ')[1];
+ }
+
function initActionList() {
$scope.actionList = [];
diff --git a/src/sass/views/includes/txp-details.scss b/src/sass/views/includes/txp-details.scss
index 28c1d977e..562f8ba96 100644
--- a/src/sass/views/includes/txp-details.scss
+++ b/src/sass/views/includes/txp-details.scss
@@ -1,36 +1,58 @@
-#txp-details{
+#txp-details {
+ $item-lateral-padding: 20px;
+ $item-vertical-padding: 10px;
+ $item-border-color: #EFEFEF;
+ $item-label-color: #6C6C6E;
+
+ .wallet-color-header-bar {
+ border: 0;
+ background: none;
+ }
.slide-to-pay {
bottom: 100px;
}
.head {
- padding-bottom: 30px;
- .sending-label{
- line-height: 70px;
- font-size: 25px;
- i {
- margin-left: 20px;
- }
- span {
- margin-left: 15px;
+ padding: 30px $item-lateral-padding 4rem;
+ .sending-label {
+ display: flex;
+ font-size: 18px;
+ align-items: center;
+ margin-bottom: 1.5rem;
+
+ img {
+ margin-right: 1rem;
}
}
.amount-label{
- margin-left: 20px;
line-height: 30px;
.amount{
- font-size: 36px;
+ font-size: 38px;
+ margin-bottom: .5rem;
+
+ > .unit {
+ font-family: "Roboto-Light";
+ }
}
- .alternative{
- font-size: 18px;
- font-weight: 200;
- color: grey;
+ .alternative {
+ font-size: 16px;
+ font-family: "Roboto-Light";
+ color: #9B9B9B;
}
}
}
- .info{
+ .info {
span {
display: block;
}
+ .item {
+ border-color: $item-border-color;
+ padding: $item-vertical-padding $item-lateral-padding;
+
+ &__label {
+ font-size: 14px;
+ color: $item-label-color;
+ }
+ }
.payment-proposal-to {
width: 100%;
display: inline-block;
diff --git a/www/img/sending-icon.svg b/www/img/sending-icon.svg
new file mode 100644
index 000000000..fdbf4de25
--- /dev/null
+++ b/www/img/sending-icon.svg
@@ -0,0 +1,19 @@
+
+
\ No newline at end of file
diff --git a/www/views/modals/txp-details.html b/www/views/modals/txp-details.html
index de3091d91..b7a6e6368 100644
--- a/www/views/modals/txp-details.html
+++ b/www/views/modals/txp-details.html
@@ -1,5 +1,5 @@
-
+