Update payment methods icons

apps/desktop/desktop/src/main/java/bisq/desktop/components/controls/ChipButton.java

@@ -31,6 +31,8 @@
 import javafx.scene.control.Tooltip;
 import javafx.scene.image.ImageView;
 import javafx.scene.layout.HBox;
+import javafx.scene.layout.Priority;
+import javafx.scene.layout.VBox;
 import lombok.extern.slf4j.Slf4j;
 
 import javax.annotation.Nullable;
@@ -51,6 +53,7 @@ public ChipButton(String text) {
         toggleButton.setText(text);
         toggleButton.setMouseTransparent(true);
         toggleButton.setAlignment(Pos.CENTER_LEFT);
+        VBox.setVgrow(toggleButton, Priority.ALWAYS);
         getChildren().add(toggleButton);
 
         toggleButton.selectedProperty().addListener(new WeakReference<ChangeListener<Boolean>>((observable, oldValue, newValue) -> {
@@ -86,7 +89,6 @@ public ChipButton(String text) {
                 getStyleClass().add("chips-button-selected");
             }
         });
-
     }
 
     private void removeStyles() {
@@ -121,14 +123,13 @@ public Label setRightIcon(AwesomeIcon awesomeIcon) {
     public ImageView setRightIcon(String iconId) {
         ImageView imageView = ImageUtil.getImageViewById(iconId);
         imageView.setCursor(Cursor.HAND);
-        HBox.setMargin(imageView, new Insets(0, -5, 0, 20));
+        HBox.setMargin(imageView, new Insets(0, 5, 0, 0));
         getChildren().addAll(Spacer.fillHBox(), imageView);
         return imageView;
     }
 
     public void setSelected(boolean value) {
         toggleButton.setSelected(value);
-
     }
 
     public boolean isSelected() {
@@ -138,4 +139,4 @@ public boolean isSelected() {
     public void setOnAction(Runnable onActionHandler) {
         this.onActionHandler = onActionHandler;
     }
-}
+}

apps/desktop/desktop/src/main/java/bisq/desktop/main/content/bisq_easy/trade_wizard/payment_methods/AddCustomPaymentMethodBox.java

@@ -34,8 +34,8 @@ public class AddCustomPaymentMethodBox extends HBox {
     private final Button addIconButton;
     private final ImageView addIcon;
     private final ChangeListener<Boolean> focusedListener;
-    private final String defaultIconId = "add-white";
-    private final String activeIconId = "add";
+    private final String defaultIconId = "add-custom-grey";
+    private final String activeIconId = "add-custom-green";
 
     public AddCustomPaymentMethodBox() {
         customPaymentMethodField = new TextField();

apps/desktop/desktop/src/main/resources/css/bisq_easy.css

@@ -737,8 +737,8 @@
 .bisq-easy-trade-wizard-payment-methods-step .add-custom-payment-method-box {
     -fx-alignment: center-left;
     -fx-background-color: -bisq-dark-grey-50;
-    -fx-background-radius: 32;
-    -fx-padding: 4;
+    -fx-background-radius: 9;
+    -fx-padding: 5 5 5 6;
     -fx-spacing: 7;
 }
 

apps/desktop/desktop/src/main/resources/css/controls.css

@@ -327,13 +327,13 @@
 
 .chips-button {
     -fx-background-color: rgba(255, 255, 255, 0.1);
-    -fx-background-radius: 32;
+    -fx-background-radius: 9;
     -fx-text-fill: -fx-light-text-color;
     -fx-font-size: 1em;
     -fx-font-family: "IBM Plex Sans";
     -fx-border-width: 0;
     -fx-cursor: hand;
-    -fx-padding: 5 10 5 6;
+    -fx-padding: 5 0 5 7;
 }
 
 .chips-button-hover {
@@ -364,7 +364,7 @@
 .chips-button > .toggle-button:disabled,
 .chips-button > .toggle-button:disabled:hover {
     -fx-background-color: transparent;
-    -fx-padding: 0 20 0 10;
+    -fx-padding: 0 0 0 10;
 }
 
 

apps/desktop/desktop/src/main/resources/css/images.css

@@ -528,89 +528,98 @@
 /* Fiat payment methods based on enum names from FiatPaymentRailUtil */
 
 #SEPA {
-    -fx-image: url("/images/payment/SEPA.png");
+    -fx-image: url("/images/payment/sepa.png");
 }
 
 #SEPA_INSTANT {
-    -fx-image: url("/images/payment/SEPA.png");
+    -fx-image: url("/images/payment/sepa-instant.png");
 }
 
 #ZELLE {
-    -fx-image: url("/images/payment/Zelle.png");
+    -fx-image: url("/images/payment/zelle.png");
 }
 
 #REVOLUT {
-    -fx-image: url("/images/payment/Revolut.png");
+    -fx-image: url("/images/payment/revolut.png");
 }
 
 #WISE {
-    -fx-image: url("/images/payment/Wise.png");
+    -fx-image: url("/images/payment/wise.png");
 }
 
 #NATIONAL_BANK {
-    -fx-image: url("/images/payment/NationalBankTransfer.png");
+    -fx-image: url("/images/payment/national-bank-transfer.png");
 }
 
 #SWIFT {
-    -fx-image: url("/images/payment/NationalBankTransfer.png");
+    -fx-image: url("/images/payment/swift.png");
 }
 
 #F2F {
-    -fx-image: url("/images/payment/F2F.png");
+    -fx-image: url("/images/payment/f2f.png");
 }
 
 #ACH_TRANSFER {
-    -fx-image: url("/images/payment/ACH.png");
+    -fx-image: url("/images/payment/ach.png");
 }
 
 #PIX {
-    -fx-image: url("/images/payment/Pix.png");
+    -fx-image: url("/images/payment/pix.png");
 }
 
 #FASTER_PAYMENTS {
-    -fx-image: url("/images/payment/FasterPayments.png");
+    -fx-image: url("/images/payment/faster-payments.png");
 }
 
 #PAY_ID {
-    -fx-image: url("/images/payment/PayID.png");
+    -fx-image: url("/images/payment/pay-id.png");
 }
 
 #US_POSTAL_MONEY_ORDER {
-    -fx-image: url("/images/payment/USPostalMoneyOrder.png");
+    -fx-image: url("/images/payment/uspmo.png");
 }
 
 #CASH_BY_MAIL {
-    -fx-image: url("/images/payment/CashByMail.png");
+    -fx-image: url("/images/payment/cash-by-mail.png");
 }
 
 #STRIKE {
-    -fx-image: url("/images/payment/Strike.png");
+    -fx-image: url("/images/payment/strike.png");
 }
 
 #INTERAC_E_TRANSFER {
-    -fx-image: url("/images/payment/InteracETransfer.png");
+    -fx-image: url("/images/payment/interac-etransfer.png");
 }
 
 #AMAZON_GIFT_CARD {
-    -fx-image: url("/images/payment/Amazon.png");
+    -fx-image: url("/images/payment/amazon.png");
 }
 
 #CASH_DEPOSIT {
-    -fx-image: url("/images/payment/CashDeposit.png");
+    -fx-image: url("/images/payment/cash-deposit.png");
 }
 
 #UPI {
-    -fx-image: url("/images/payment/Upi.png");
+    -fx-image: url("/images/payment/upi.png");
 }
 
 #BIZUM {
-    -fx-image: url("/images/payment/Bizum.png");
+    -fx-image: url("/images/payment/bizum.png");
 }
 
 #CASH_APP {
-    -fx-image: url("/images/payment/CashApp.png");
+    -fx-image: url("/images/payment/cashapp.png");
 }
 
+#add-custom-green {
+    -fx-image: url("/images/payment/add-custom-green.png");
+}
+
+#add-custom-grey {
+    -fx-image: url("/images/payment/add-custom-grey.png");
+}
+
+
 /* Bitcoin payment method icons based on enum names from BitcoinPaymentRail */
 
 #MAIN_CHAIN {

i18n/src/main/resources/bisq_easy.properties

@@ -158,8 +158,8 @@ bisqEasy.component.amount.baseSide.tooltip.taker.offerPrice=with the offer price
 # Create offer / Payment methods
 ################################################################################
 
-bisqEasy.tradeWizard.paymentMethod.headline.buyer=How do you want to transfer the {0}
-bisqEasy.tradeWizard.paymentMethod.headline.seller=How do you want to receive the {0}
+bisqEasy.tradeWizard.paymentMethod.headline.buyer=How do you want to transfer the {0}?
+bisqEasy.tradeWizard.paymentMethod.headline.seller=How do you want to receive the {0}?
 bisqEasy.tradeWizard.paymentMethod.subTitle=Choose your payment methods.
 bisqEasy.tradeWizard.paymentMethod.noneFound=For the selected market there are no default payment methods provided.\n\
   Please add in the text field below the custom payment you want to use.