Finalize info icon for funds needed

common/src/main/resources/i18n/displayStrings.properties

@@ -353,7 +353,7 @@ createOffer.fundsBox.offerFee=Trade fee:
 createOffer.fundsBox.networkFee=Mining fee:
 createOffer.fundsBox.placeOfferSpinnerInfo=Offer publishing is in progress ...
 createOffer.fundsBox.paymentLabel=Bisq trade with ID {0}
-createOffer.fundsBox.fundsStructure=({0} deposit, {1} trade fee, {2} mining fee)
+createOffer.fundsBox.fundsStructure=({0} security deposit, {1} trade fee, {2} mining fee)
 createOffer.success.headline=Your offer has been published
 createOffer.success.info=You can manage your open offers at \"Portfolio/My open offers\".
 
@@ -411,7 +411,7 @@ takeOffer.fundsBox.offerFee=Trade fee:
 takeOffer.fundsBox.networkFee=Total mining fees:
 takeOffer.fundsBox.takeOfferSpinnerInfo=Take offer in progress ...
 takeOffer.fundsBox.paymentLabel=Bisq trade with ID {0}
-takeOffer.fundsBox.fundsStructure=({0} deposit, {1} trade fee, {2} mining fee)
+takeOffer.fundsBox.fundsStructure=({0} security deposit, {1} trade fee, {2} mining fee)
 takeOffer.success.headline=You have successfully taken an offer.
 takeOffer.success.info=You can see the status of your trade at \"Portfolio/Open trades\".
 takeOffer.error.message=An error occurred when taking the offer.\n\n{0}

common/src/main/resources/i18n/displayStrings_de.properties

@@ -341,6 +341,7 @@ createOffer.fundsBox.offerFee=Erstellergebühr:
 createOffer.fundsBox.networkFee=Mining-Gebühr:
 createOffer.fundsBox.placeOfferSpinnerInfo=Das Angebot wird veröffentlicht ...
 createOffer.fundsBox.paymentLabel=Bisq-Handel mit der ID {0}
+createOffer.fundsBox.fundsStructure=({0} Kaution, {1} Erstellergebühr, {2} Mining-Gebühr)
 createOffer.success.headline=Ihr Angebot wurde veröffentlicht
 createOffer.success.info=Sie können Ihre offenen Angebote unter \"Portfolio/Meine offenen Angebote\" verwalten.
 
@@ -393,6 +394,7 @@ takeOffer.fundsBox.offerFee=Abnehmergebühr:
 takeOffer.fundsBox.networkFee=Mining-Gebühren (3x):
 takeOffer.fundsBox.takeOfferSpinnerInfo=Angebot wird angenommen ...
 takeOffer.fundsBox.paymentLabel=Bisq-Handel mit der ID {0}
+takeOffer.fundsBox.fundsStructure=({0} Kaution, {1} Abnehmergebühr, {2} Mining-Gebühr)
 takeOffer.success.headline=Sie haben erfolgreich ein Angebot angenommen.
 takeOffer.success.info=Sie können den Status Ihres Angebots unter \"Portfolio/Offene Angebote\" einsehen.
 takeOffer.error.message=Bei der Angebotsannahme trat ein Fehler auf.\n\n{0}

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-green;
+}
+
+.info:hover {
+    -fx-text-fill: -bs-grey;
+}
+
 .headline-label {
     -fx-font-weight: bold;
     -fx-font-size: 22;
@@ -362,10 +370,6 @@ textfield */
     -fx-padding: 4 4 4 4;
 }
 
-#address-text-field:hover {
-    -fx-text-fill: -bs-black;
-}
-
 #funds-confidence {
     -fx-progress-color: -bs-dim-grey;
 }
@@ -502,10 +506,6 @@ textfield */
     -fx-text-fill: -bs-medium-grey;
 }
 
-#clickable-icon:hover {
-    -fx-text-fill: -bs-grey;
-}
-
 /*******************************************************************************
  *                                                                             *
  * Images                                                                      *

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

@@ -87,12 +87,12 @@ public AddressTextField() {
                 Utilities.copyToClipboard(address.get());
         }));
 
-        AnchorPane.setRightAnchor(copyIcon, 5.0);
-        AnchorPane.setRightAnchor(extWalletIcon, 30.0);
+        AnchorPane.setRightAnchor(copyIcon, 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

@@ -19,6 +19,7 @@
 
 import de.jensd.fx.fontawesome.AwesomeDude;
 import de.jensd.fx.fontawesome.AwesomeIcon;
+import io.bisq.common.UserThread;
 import io.bisq.common.locale.Res;
 import io.bisq.common.util.Utilities;
 import javafx.beans.binding.Bindings;
@@ -33,12 +34,15 @@
 import org.slf4j.Logger;
 import org.slf4j.LoggerFactory;
 
+import java.util.concurrent.TimeUnit;
+
 public class FundsTextField extends AnchorPane {
     public static final Logger log = LoggerFactory.getLogger(FundsTextField.class);
 
     private final StringProperty amount = new SimpleStringProperty();
     private final StringProperty fundsStructure = new SimpleStringProperty();
     private final Label infoIcon;
+    private Boolean hidePopover;
     private PopOver infoPopover;
 
     ///////////////////////////////////////////////////////////////////////////////////////////
@@ -58,8 +62,7 @@ public FundsTextField() {
 
         infoIcon = new Label();
         infoIcon.setLayoutY(3);
-        infoIcon.setId("clickable-icon");
-        infoIcon.getStyleClass().addAll("highlight", "show-hand");
+        infoIcon.getStyleClass().addAll("icon", "info");
         AwesomeDude.setIcon(infoIcon, AwesomeIcon.INFO_SIGN);
 
         Label copyIcon = new Label();
@@ -81,9 +84,9 @@ public FundsTextField() {
             }
         });
 
-        AnchorPane.setRightAnchor(copyIcon, 5.0);
-        AnchorPane.setRightAnchor(infoIcon, 37.0);
-        AnchorPane.setRightAnchor(textField, 30.0);
+        AnchorPane.setRightAnchor(copyIcon, 30.0);
+        AnchorPane.setRightAnchor(infoIcon, 62.0);
+        AnchorPane.setRightAnchor(textField, 55.0);
         AnchorPane.setLeftAnchor(textField, 0.0);
 
         getChildren().addAll(textField, infoIcon, copyIcon);
@@ -95,21 +98,31 @@ public FundsTextField() {
 
     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 -> {
+            hidePopover = false;
+            showInfoPopOver(node);
+        });
         infoIcon.setOnMouseExited(e -> {
             if (infoPopover != null)
-                infoPopover.hide();
+                hidePopover = true;
+                UserThread.runAfter(() -> {
+                    if (hidePopover) {
+                        infoPopover.hide();
+                        hidePopover = false;
+                    }
+                },250, TimeUnit.MILLISECONDS);
         });
     }
 
     ///////////////////////////////////////////////////////////////////////////////////////////
     // 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

@@ -410,7 +410,7 @@ private void onShowPayFundsScreen() {
         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 @@ public String getSecurityDepositInfo() {
                 GUIUtil.getPercentageOfTradeAmount(dataModel.getSecurityDeposit(), dataModel.getAmount().get(), btcFormatter);
     }
 
-    public String getSecurityDepositPercentage() {
-        return GUIUtil.getPercentage(dataModel.getSecurityDeposit(), dataModel.getAmount().get(),
-                btcFormatter);
+    public String getSecurityDepositWithCode() {
+        return btcFormatter.formatCoinWithCode(dataModel.getSecurityDeposit());
     }
 
     public String getMakerFee() {

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

@@ -420,8 +420,8 @@ private void onShowPayFundsScreen() {
         balanceLabel.setVisible(true);
         balanceTextField.setVisible(true);
 
-        totalToPayTextField.setFundsStructure(Res.get("createOffer.fundsBox.fundsStructure",
-                model.getSecurityDepositPercentage(), model.getMakerFeePercentage(), model.getTxFeePercentage()));
+        totalToPayTextField.setFundsStructure(Res.get("takeOffer.fundsBox.fundsStructure",
+                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 @@ public String getSecurityDepositInfo() {
                 GUIUtil.getPercentageOfTradeAmount(dataModel.getSecurityDeposit(), dataModel.getAmount().get(), btcFormatter);
     }
 
-    public String getSecurityDepositPercentage() {
-        return GUIUtil.getPercentage(dataModel.getSecurityDeposit(), dataModel.getAmount().get(),
-                btcFormatter);
+    public String getSecurityDepositWithCode() {
+        return btcFormatter.formatCoinWithCode(dataModel.getSecurityDeposit());
     }
 
     public String getTakerFee() {