更新启动按钮分隔符颜色 (#5087)

Author: neveler

HMCL/src/main/java/org/jackhuang/hmcl/ui/main/MainPage.java

@@ -39,7 +39,6 @@
 import javafx.scene.layout.HBox;
 import javafx.scene.layout.StackPane;
 import javafx.scene.layout.VBox;
-import javafx.scene.shape.Rectangle;
 import javafx.scene.text.TextFlow;
 import javafx.util.Duration;
 import org.jackhuang.hmcl.Metadata;
@@ -207,10 +206,8 @@ public final class MainPage extends StackPane implements DecoratorPage {
             updatePane.getChildren().setAll(hBox, closeUpdateButton);
         }
 
-        StackPane launchPane = new StackPane();
+        HBox launchPane = new HBox();
         launchPane.getStyleClass().add("launch-pane");
-        launchPane.setMaxWidth(230);
-        launchPane.setMaxHeight(55);
         FXUtils.onScroll(launchPane, versions, list -> {
             String currentId = getCurrentGame();
             return Lang.indexWhere(list, instance -> instance.getId().equals(currentId));
@@ -219,16 +216,11 @@ public final class MainPage extends StackPane implements DecoratorPage {
         StackPane.setAlignment(launchPane, Pos.BOTTOM_RIGHT);
         {
             JFXButton launchButton = new JFXButton();
-            launchButton.setPrefWidth(230);
-            launchButton.setPrefHeight(55);
-            //launchButton.setButtonType(JFXButton.ButtonType.RAISED);
+            launchButton.getStyleClass().add("launch-button");
             launchButton.setDefaultButton(true);
-            launchButton.setClip(new Rectangle(-100, -100, 310, 200));
             {
                 VBox graphic = new VBox();
                 graphic.setAlignment(Pos.CENTER);
-                graphic.setTranslateX(-7);
-                graphic.setMaxWidth(200);
                 Label launchLabel = new Label();
                 launchLabel.setStyle("-fx-font-size: 16px;");
                 Label currentLabel = new Label();
@@ -261,26 +253,11 @@ public void accept(String currentGame) {
                 launchButton.setGraphic(graphic);
             }
 
-            Rectangle separator = new Rectangle();
-            separator.setWidth(1);
-            separator.setHeight(57);
-            separator.setTranslateX(95);
-            separator.setMouseTransparent(true);
-
             menuButton = new JFXButton();
-            menuButton.setPrefHeight(55);
-            menuButton.setPrefWidth(230);
-            //menuButton.setButtonType(JFXButton.ButtonType.RAISED);
-            menuButton.setStyle("-fx-font-size: 15px;");
+            menuButton.getStyleClass().add("menu-button");
             menuButton.setOnAction(e -> onMenu());
-            menuButton.setClip(new Rectangle(211, -100, 100, 200));
-            StackPane graphic = new StackPane();
-            Node svg = SVG.ARROW_DROP_UP.createIcon(30);
-            StackPane.setAlignment(svg, Pos.CENTER_RIGHT);
-            graphic.getChildren().setAll(svg);
-            graphic.setTranslateX(6);
             FXUtils.installFastTooltip(menuButton, i18n("version.switch"));
-            menuButton.setGraphic(graphic);
+            menuButton.setGraphic(SVG.ARROW_DROP_UP.createIcon(30));
 
             EventHandler<MouseEvent> secondaryClickHandle = event -> {
                 if (event.getButton() == MouseButton.SECONDARY && event.getClickCount() == 1) {
@@ -291,7 +268,7 @@ public void accept(String currentGame) {
             launchButton.addEventHandler(MouseEvent.MOUSE_CLICKED, secondaryClickHandle);
             menuButton.addEventHandler(MouseEvent.MOUSE_CLICKED, secondaryClickHandle);
 
-            launchPane.getChildren().setAll(launchButton, separator, menuButton);
+            launchPane.getChildren().setAll(launchButton, menuButton);
         }
 
         getChildren().addAll(updatePane, launchPane);

HMCL/src/main/resources/assets/css/root.css

@@ -421,18 +421,44 @@
  *                                                                             *
  ******************************************************************************/
 
+.launch-pane {
+    -fx-max-height: 57px;
+    -fx-min-height: 57px;
+    -fx-max-width: 230px;
+    -fx-min-width: 230px;
+}
+
 .launch-pane > .jfx-button {
+    -fx-translate-y: 1px;
+    -fx-max-height: 55px;
+    -fx-min-height: 55px;
     -fx-background-color: -monet-primary-container;
     -fx-cursor: hand;
 }
 
+.launch-pane > .jfx-button.launch-button {
+    -fx-max-width: 207px;
+    -fx-min-width: 207px;
+    -fx-border-width: 0 3px 0 0;
+    -fx-border-color: -monet-on-surface-variant;
+    -fx-background-radius: 4px 0 0 4px;
+}
+
+.launch-pane > .jfx-button.menu-button {
+    -fx-max-width: 20px;
+    -fx-min-width: 20px;
+    -fx-font-size: 15px;
+    -fx-background-radius: 0 4px 4px 0;
+}
+
 .launch-pane > .jfx-button > StackPane > .jfx-rippler {
     -jfx-rippler-fill: -monet-on-primary-container;
     -jfx-mask-type: CIRCLE;
-    -fx-padding: 0.0;
+    -fx-padding: 0;
 }
 
-.launch-pane > .jfx-button, .jfx-button * {
+.launch-pane > .jfx-button,
+.launch-pane > .jfx-button * {
     -fx-text-fill: -monet-on-primary-container;
     -fx-font-size: 14px;
 }
@@ -441,10 +467,6 @@
     -fx-fill: -monet-on-primary-container;
 }
 
-.launch-pane > Rectangle {
-    -fx-fill: -monet-primary-container;
-}
-
 /*******************************************************************************
  *                                                                             *
  * JFX Tab Pane                                                                *