Reposition and colorize existing icons and add security deposit with currency code

gui/src/main/java/io/bisq/gui/bisq.css

@@ -126,6 +126,14 @@ bg color of non edit textFields: fafafa
     -fx-text-fill: -bs-black;
 }
 
+.info {
+    -fx-text-fill: -bs-bg-green2;
+}
+
+.info:hover {
+    -fx-text-fill: -bs-grey;
+}
+
 .headline-label {
     -fx-font-weight: bold;
     -fx-font-size: 22;

gui/src/main/java/io/bisq/gui/components/AddressTextField.java

@@ -87,12 +87,12 @@ public class AddressTextField extends AnchorPane {
                 Utilities.copyToClipboard(address.get());
         }));
 
-        AnchorPane.setRightAnchor(copyIcon, 5.0);
+        AnchorPane.setRightAnchor(copyIcon, 30.0);
-        AnchorPane.setRightAnchor(extWalletIcon, 30.0);
+        AnchorPane.setRightAnchor(extWalletIcon, 5.0);
         AnchorPane.setRightAnchor(textField, 55.0);
         AnchorPane.setLeftAnchor(textField, 0.0);
 
-        getChildren().addAll(textField, extWalletIcon, copyIcon);
+        getChildren().addAll(textField, copyIcon, extWalletIcon);
     }
 
     private void openWallet() {

gui/src/main/java/io/bisq/gui/components/FundsTextField.java

@@ -58,8 +58,7 @@ public class FundsTextField extends AnchorPane {
 
         infoIcon = new Label();
         infoIcon.setLayoutY(3);
-        infoIcon.setId("clickable-icon");
+        infoIcon.getStyleClass().addAll("icon", "info");
-        infoIcon.getStyleClass().addAll("highlight", "show-hand");
         AwesomeDude.setIcon(infoIcon, AwesomeIcon.INFO_SIGN);
 
         Label copyIcon = new Label();
@@ -81,9 +80,9 @@ public class FundsTextField extends AnchorPane {
             }
         });
 
-        AnchorPane.setRightAnchor(copyIcon, 5.0);
+        AnchorPane.setRightAnchor(copyIcon, 30.0);
-        AnchorPane.setRightAnchor(infoIcon, 37.0);
+        AnchorPane.setRightAnchor(infoIcon, 62.0);
-        AnchorPane.setRightAnchor(textField, 30.0);
+        AnchorPane.setRightAnchor(textField, 55.0);
         AnchorPane.setLeftAnchor(textField, 0.0);
 
         getChildren().addAll(textField, infoIcon, copyIcon);
@@ -95,7 +94,7 @@ public class FundsTextField extends AnchorPane {
 
     public void setContentForInfoPopOver(Node node) {
         // As we don't use binding here we need to recreate it on mouse over to reflect the current state
-        infoIcon.setOnMouseEntered(e -> createInfoPopOver(node));
+        infoIcon.setOnMouseEntered(e -> showInfoPopOver(node));
         infoIcon.setOnMouseExited(e -> {
             if (infoPopover != null)
                 infoPopover.hide();
@@ -106,10 +105,11 @@ public class FundsTextField extends AnchorPane {
     // Private
     ///////////////////////////////////////////////////////////////////////////////////////////
 
-    private void createInfoPopOver(Node node) {
+    private void showInfoPopOver(Node node) {
         node.getStyleClass().add("default-text");
 
-        infoPopover = new PopOver(node);
+        if (infoPopover == null) infoPopover = new PopOver(node);
+
         if (infoIcon.getScene() != null) {
             infoPopover.setDetachable(false);
             infoPopover.setArrowLocation(PopOver.ArrowLocation.RIGHT_TOP);

gui/src/main/java/io/bisq/gui/main/offer/createoffer/CreateOfferView.java

@@ -408,7 +408,7 @@ public class CreateOfferView extends ActivatableViewAndModel<AnchorPane, CreateO
         cancelButton2.setVisible(true);
 
         totalToPayTextField.setFundsStructure(Res.get("createOffer.fundsBox.fundsStructure",
-                model.getSecurityDepositPercentage(), model.getMakerFeePercentage(), model.getTxFeePercentage()));
+                model.getSecurityDepositWithCode(), model.getMakerFeePercentage(), model.getTxFeePercentage()));
         totalToPayTextField.setContentForInfoPopOver(createInfoPopover());
 
         final byte[] imageBytes = QRCode

gui/src/main/java/io/bisq/gui/main/offer/createoffer/CreateOfferViewModel.java

@@ -831,9 +831,8 @@ class CreateOfferViewModel extends ActivatableWithDataModel<CreateOfferDataModel
                 GUIUtil.getPercentageOfTradeAmount(dataModel.getSecurityDeposit(), dataModel.getAmount().get(), btcFormatter);
     }
 
-    public String getSecurityDepositPercentage() {
+    public String getSecurityDepositWithCode() {
-        return GUIUtil.getPercentage(dataModel.getSecurityDeposit(), dataModel.getAmount().get(),
+        return btcFormatter.formatCoinWithCode(dataModel.getSecurityDeposit());
-                btcFormatter);
     }
 
     public String getMakerFee() {

gui/src/main/java/io/bisq/gui/main/offer/takeoffer/TakeOfferView.java

@@ -419,7 +419,7 @@ public class TakeOfferView extends ActivatableViewAndModel<AnchorPane, TakeOffer
         balanceTextField.setVisible(true);
 
         totalToPayTextField.setFundsStructure(Res.get("createOffer.fundsBox.fundsStructure",
-                model.getSecurityDepositPercentage(), model.getMakerFeePercentage(), model.getTxFeePercentage()));
+                model.getSecurityDepositWithCode(), model.getMakerFeePercentage(), model.getTxFeePercentage()));
         totalToPayTextField.setContentForInfoPopOver(createInfoPopover());
 
         if (model.dataModel.isWalletFunded.get()) {

gui/src/main/java/io/bisq/gui/main/offer/takeoffer/TakeOfferViewModel.java

@@ -584,9 +584,8 @@ class TakeOfferViewModel extends ActivatableWithDataModel<TakeOfferDataModel> im
                 GUIUtil.getPercentageOfTradeAmount(dataModel.getSecurityDeposit(), dataModel.getAmount().get(), btcFormatter);
     }
 
-    public String getSecurityDepositPercentage() {
+    public String getSecurityDepositWithCode() {
-        return GUIUtil.getPercentage(dataModel.getSecurityDeposit(), dataModel.getAmount().get(),
+        return btcFormatter.formatCoinWithCode(dataModel.getSecurityDeposit());
-                btcFormatter);
     }
 
     public String getTakerFee() {