diff --git a/core/src/main/resources/i18n/displayStrings.properties b/core/src/main/resources/i18n/displayStrings.properties index 695d2c3c351..5b909115430 100644 --- a/core/src/main/resources/i18n/displayStrings.properties +++ b/core/src/main/resources/i18n/displayStrings.properties @@ -2532,11 +2532,11 @@ popup.attention.forTradeWithId=Attention required for trade with ID {0} popup.info.multiplePaymentAccounts.headline=Multiple payment accounts available popup.info.multiplePaymentAccounts.msg=You have multiple payment accounts available for this offer. Please make sure you've picked the right one. -popup.news.launch.headline=Two Critical Updates +popup.news.launch.headline=Two Major Updates popup.news.launch.accountSigning.headline=ACCOUNT SIGNING popup.news.launch.accountSigning.description=Lift 0.01 BTC fiat trading limits by buying BTC from a signed peer. popup.news.launch.ntp.headline=NEW TRADE PROTOCOL -popup.news.launch.ntp.description=Multisig escrows are now 2-of-2 with a new dispute resolution system. +popup.news.launch.ntp.description=New two level dispute resolution system to make Bisq more secure, scalable and censorship resistant. popup.accountSigning.selectAccounts.headline=Select payment accounts popup.accountSigning.selectAccounts.description=Based on the payment method and point of time all payment accounts that are connected to a dispute where a payout to the buyer occurred will be selected for you to sign. diff --git a/desktop/src/main/java/bisq/desktop/bisq.css b/desktop/src/main/java/bisq/desktop/bisq.css index d593c1b465d..0c8a18df8c6 100644 --- a/desktop/src/main/java/bisq/desktop/bisq.css +++ b/desktop/src/main/java/bisq/desktop/bisq.css @@ -782,6 +782,14 @@ tree-table-view:focused { -fx-padding: 27 2 0 2; } +.close-icon { + -fx-text-fill: -bs-text-color; +} + +.close-icon:hover { + -fx-text-fill: -fx-accent; +} + /******************************************************************************* * * * Tooltip * @@ -838,6 +846,12 @@ textfield */ -fx-underline: false; } +.hyperlink.highlight, +.hyperlink.highlight .text.hyperlink.no-underline { + -fx-text-fill: -fx-accent; + -fx-fill: -fx-accent; +} + /******************************************************************************* * * * Table * @@ -1984,26 +1998,19 @@ textfield */ ********************************************************************************************************************/ .news-version { - -fx-alignment: center; - -fx-font-size: 1.077em; -} - -.news-headline { - -fx-font-size: 2.154em; - -fx-text-fill: -bs-rd-font-dark-gray; - -fx-font-family: "IBM Plex Sans Light"; + -fx-alignment: center-left; + -fx-font-size: 1em; } .news-feature-headline { - -fx-font-size: 1.462em; + -fx-font-size: 1.077em; -fx-text-fill: -bs-rd-font-dark-gray; - -fx-font-family: "IBM Plex Sans Light"; + -fx-font-family: "IBM Plex Sans Medium"; } .news-feature-description { - -fx-font-size: 1.231em; + -fx-font-size: 1em; -fx-text-fill: -bs-rd-font-dark-gray; - -fx-font-family: "IBM Plex Sans Light"; } /******************************************************************************************************************** * * diff --git a/desktop/src/main/java/bisq/desktop/components/HyperlinkWithIcon.java b/desktop/src/main/java/bisq/desktop/components/HyperlinkWithIcon.java index 368b67a22e0..c9504c9da40 100644 --- a/desktop/src/main/java/bisq/desktop/components/HyperlinkWithIcon.java +++ b/desktop/src/main/java/bisq/desktop/components/HyperlinkWithIcon.java @@ -52,11 +52,21 @@ public HyperlinkWithIcon(String text, AwesomeIcon awesomeIcon) { } public HyperlinkWithIcon(String text, GlyphIcons icon) { + this(text, icon, null); + } + + public HyperlinkWithIcon(String text, GlyphIcons icon, String style) { super(text); Text textIcon = FormBuilder.getIcon(icon); textIcon.setOpacity(0.7); textIcon.getStyleClass().addAll("hyperlink", "no-underline"); + + if (style != null) { + textIcon.getStyleClass().add(style); + getStyleClass().add(style); + } + setPadding(new Insets(0)); setIcon(textIcon); diff --git a/desktop/src/main/java/bisq/desktop/main/overlays/windows/NewTradeProtocolLaunchWindow.java b/desktop/src/main/java/bisq/desktop/main/overlays/windows/NewTradeProtocolLaunchWindow.java index 9071ba8e0fa..b474a1196e5 100644 --- a/desktop/src/main/java/bisq/desktop/main/overlays/windows/NewTradeProtocolLaunchWindow.java +++ b/desktop/src/main/java/bisq/desktop/main/overlays/windows/NewTradeProtocolLaunchWindow.java @@ -17,8 +17,8 @@ package bisq.desktop.main.overlays.windows; -import bisq.desktop.components.AutoTooltipButton; import bisq.desktop.components.AutoTooltipLabel; +import bisq.desktop.components.HyperlinkWithIcon; import bisq.desktop.main.overlays.Overlay; import bisq.desktop.util.FormBuilder; import bisq.desktop.util.GUIUtil; @@ -27,10 +27,12 @@ import bisq.core.locale.Res; import bisq.core.user.DontShowAgainLookup; +import de.jensd.fx.fontawesome.AwesomeIcon; import de.jensd.fx.glyphs.materialdesignicons.MaterialDesignIcon; import javafx.scene.control.Button; import javafx.scene.control.Label; +import javafx.scene.control.Separator; import javafx.scene.image.ImageView; import javafx.scene.layout.GridPane; import javafx.scene.layout.HBox; @@ -40,6 +42,7 @@ import javafx.geometry.HPos; import javafx.geometry.Insets; +import javafx.geometry.Orientation; import javafx.geometry.Pos; import lombok.extern.slf4j.Slf4j; @@ -58,7 +61,7 @@ public class NewTradeProtocolLaunchWindow extends Overlay hide()); HBox.setHgrow(closeButton, Priority.NEVER); @@ -94,10 +98,17 @@ protected void addHeadLine() { GridPane.setColumnSpan(header, 2); gridPane.getChildren().add(header); - Label headlineLabel = addLabel(gridPane, ++rowIndex, headLine); - headlineLabel.getStyleClass().add("news-headline"); - GridPane.setMargin(headlineLabel, new Insets(10, 0, 0, 0)); - GridPane.setColumnSpan(headlineLabel, 2); + headLineLabel = addLabel(gridPane, ++rowIndex, headLine); + headLineLabel.getStyleClass().add("popup-headline-information"); + headlineIcon = new Label(); + headlineIcon.getStyleClass().add("popup-icon-information"); + headlineIcon.setManaged(true); + headlineIcon.setVisible(true); + FormBuilder.getIconForLabel(AwesomeIcon.INFO_SIGN, headlineIcon, "1em"); + + headLineLabel.setGraphic(headlineIcon); + GridPane.setHalignment(headLineLabel, HPos.LEFT); + GridPane.setColumnSpan(headLineLabel, 2); } @Override @@ -116,9 +127,9 @@ protected void onShow() { private void createContent() { HBox content = new HBox(); - content.setMinWidth(700); - content.setAlignment(Pos.CENTER); - content.setSpacing(20); + content.setMinWidth(680); + content.setAlignment(Pos.CENTER_LEFT); + content.setSpacing(40); VBox accountSigning = getFeatureBox(Res.get("popup.news.launch.accountSigning.headline"), Res.get("popup.news.launch.accountSigning.description"), @@ -130,8 +141,9 @@ private void createContent() { "image-new-trade-protocol-screenshot", "https://docs.bisq.network/trading-rules"); - content.getChildren().addAll(accountSigning, newTradeProtocol); + content.getChildren().addAll(accountSigning, new Separator(Orientation.VERTICAL), newTradeProtocol); + GridPane.setMargin(content, new Insets(40, 0, 0, 0)); GridPane.setRowIndex(content, ++rowIndex); GridPane.setColumnSpan(content, 2); GridPane.setHgrow(content, Priority.ALWAYS); @@ -141,20 +153,19 @@ private void createContent() { @NotNull private VBox getFeatureBox(String title, String description, String imageId, String url) { Label featureTitle = new Label(title); - featureTitle.setTextAlignment(TextAlignment.CENTER); + featureTitle.setTextAlignment(TextAlignment.LEFT); featureTitle.getStyleClass().add("news-feature-headline"); ImageView sectionScreenshot = new ImageView(); sectionScreenshot.setId(imageId); Label featureDescription = new Label(description); - featureDescription.setTextAlignment(TextAlignment.CENTER); + featureDescription.setTextAlignment(TextAlignment.LEFT); featureDescription.getStyleClass().add("news-feature-description"); featureDescription.setWrapText(true); - AutoTooltipButton learnMoreButton = new AutoTooltipButton(Res.get("shared.learnMore")); - learnMoreButton.getStyleClass().add("action-button"); - learnMoreButton.setOnAction(event -> { + HyperlinkWithIcon learnMore = new HyperlinkWithIcon(Res.get("shared.learnMore"), MaterialDesignIcon.LINK, "highlight"); + learnMore.setOnAction(event -> { if (DontShowAgainLookup.showAgain(GUIUtil.OPEN_WEB_PAGE_KEY)) { hide(); @@ -167,8 +178,8 @@ private VBox getFeatureBox(String title, String description, String imageId, Str } }); - VBox vBox = new VBox(featureTitle, sectionScreenshot, featureDescription, learnMoreButton); - vBox.setAlignment(Pos.CENTER); + VBox vBox = new VBox(featureTitle, sectionScreenshot, featureDescription, learnMore); + vBox.setAlignment(Pos.CENTER_LEFT); vBox.setSpacing(20); vBox.setMaxWidth(300); return vBox; diff --git a/desktop/src/main/java/bisq/desktop/util/FormBuilder.java b/desktop/src/main/java/bisq/desktop/util/FormBuilder.java index 3cec5a40702..6e84ea688dc 100644 --- a/desktop/src/main/java/bisq/desktop/util/FormBuilder.java +++ b/desktop/src/main/java/bisq/desktop/util/FormBuilder.java @@ -2102,8 +2102,13 @@ public static Button getIconButton(GlyphIcons icon) { } public static Button getIconButton(GlyphIcons icon, String styleClass) { + return getIconButton(icon, styleClass, "2em"); + } + + public static Button getIconButton(GlyphIcons icon, String styleClass, String iconSize) { if (icon.fontFamily().equals(MATERIAL_DESIGN_ICONS)) { - Button textIcon = MaterialDesignIconFactory.get().createIconButton(icon, "", "2em", null, ContentDisplay.CENTER); + Button textIcon = MaterialDesignIconFactory.get().createIconButton(icon, + "", iconSize, null, ContentDisplay.CENTER); textIcon.setId("icon-button"); textIcon.getGraphic().getStyleClass().add(styleClass); textIcon.setPrefWidth(20);