From 42412d87225136a4dc90e19338bf1ec6197475eb Mon Sep 17 00:00:00 2001
From: OrzMiku <miku@ecy.pink>
Date: Sun, 18 Jan 2026 00:02:59 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E8=87=AA=E5=8A=A8=E5=AE=89?=
 =?UTF-8?q?=E8=A3=85=E7=95=8C=E9=9D=A2=E5=8D=A1=E7=89=87=E4=B8=8A=E6=8C=89?=
 =?UTF-8?q?=E9=92=AE=E6=97=A0=E6=B3=95=E7=82=B9=E5=87=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

fix: https://github.com/HMCL-dev/HMCL/issues/5248
---
 .../org/jackhuang/hmcl/ui/InstallerItem.java  |  8 +++++--
 HMCL/src/main/resources/assets/css/root.css   | 24 ++++++++++---------
 2 files changed, 19 insertions(+), 13 deletions(-)

diff --git a/HMCL/src/main/java/org/jackhuang/hmcl/ui/InstallerItem.java b/HMCL/src/main/java/org/jackhuang/hmcl/ui/InstallerItem.java
index f16c09715c..f111b365a4 100644
--- a/HMCL/src/main/java/org/jackhuang/hmcl/ui/InstallerItem.java
+++ b/HMCL/src/main/java/org/jackhuang/hmcl/ui/InstallerItem.java
@@ -300,11 +300,15 @@ private static final class InstallerItemSkin extends SkinBase<InstallerItem> {
             }
             pane.getStyleClass().add("installer-item");
             RipplerContainer container = new RipplerContainer(pane);
-            container.setPosition(JFXRippler.RipplerPos.FRONT);
-            getChildren().setAll(container);
+            container.setPosition(JFXRippler.RipplerPos.BACK);
+            StackPane paneWrapper = new StackPane();
+            paneWrapper.getStyleClass().add("installer-item-wrapper");
+            paneWrapper.getChildren().setAll(container);
+            getChildren().setAll(paneWrapper);
 
             pane.pseudoClassStateChanged(LIST_ITEM, control.style == Style.LIST_ITEM);
             pane.pseudoClassStateChanged(CARD, control.style == Style.CARD);
+            paneWrapper.pseudoClassStateChanged(CARD, control.style == Style.CARD);
 
             if (control.iconType != null) {
                 ImageView view = new ImageView(control.iconType.getIcon());
diff --git a/HMCL/src/main/resources/assets/css/root.css b/HMCL/src/main/resources/assets/css/root.css
index 0a3222a934..353c0dbeaf 100644
--- a/HMCL/src/main/resources/assets/css/root.css
+++ b/HMCL/src/main/resources/assets/css/root.css
@@ -388,31 +388,33 @@
     -fx-cursor: hand;
 }
 
-.installer-item {
-    -fx-padding: 8px;
+.installer-item-wrapper {
+    -fx-background-color: -monet-surface;
+    -fx-background-radius: 4;
+    -fx-pref-width: 180px;
+}
+
+.installer-item-wrapper:card {
+    -fx-effect: dropshadow(gaussian, rgba(0, 0, 0, 0.26), 10, 0.12, -1, 2);
 }
 
-.installer-item:list-item {
+.installer-item-wrapper .installer-item:list-item {
+    -fx-padding: 8px;
     -fx-border-color: -monet-outline-variant;
     -fx-border-width: 0 0 1 0;
     -fx-alignment: center-left;
 }
 
-.installer-item:list-item > .installer-item-name {
+.installer-item-wrapper .installer-item:list-item > .installer-item-name {
     -fx-pref-width: 80px;
 }
 
-.installer-item:list-item > .installer-item-status {
+.installer-item-wrapper .installer-item:list-item > .installer-item-status {
     -fx-max-width: infinity;
 }
 
-.installer-item:card {
-    -fx-background-color: -monet-surface;
-    -fx-background-radius: 4;
+.installer-item-wrapper .installer-item:card {
     -fx-alignment: center;
-    -fx-pref-width: 180px;
-
-    -fx-effect: dropshadow(gaussian, rgba(0, 0, 0, 0.26), 10, 0.12, -1, 2);
 }
 
 /*******************************************************************************