feat: 主题颜色

2024-11-23 12:36:43 +08:00 · 2024-09-10 03:09:09 +08:00 · 2024-09-10 03:09:09 +08:00 · a0e5e16afc
commit a0e5e16afc
parent a9dd63b251
6 changed files with 81 additions and 98 deletions
--- a/src/main/java/cn/octopusyan/alistgui/manager/WindowsUtil.java
+++ b/src/main/java/cn/octopusyan/alistgui/manager/WindowsUtil.java
@ -1,6 +1,7 @@
 package cn.octopusyan.alistgui.manager;

 import javafx.scene.layout.Pane;
+import javafx.stage.Stage;
 import javafx.stage.Window;

 import java.util.HashMap;
@ -13,6 +14,16 @@ public class WindowsUtil {
    public static final Map<Pane, Double> paneXOffset = new HashMap<>();
    public static final Map<Pane, Double> paneYOffset = new HashMap<>();

+    public static void bindShadow(Pane pane) {
+        pane.setStyle("""
+                -fx-background-radius: 5;
+                -fx-border-radius: 5;
+                -fx-effect: dropshadow(gaussian, rgba(0, 0, 0, 0.3), 15, 0, 0, 0);
+                -fx-background-insets: 20;
+                -fx-padding: 20;
+                """);
+    }
+
    public static void bindDragged(Pane pane) {
        Window stage = getStage(pane);
        pane.setOnMousePressed(event -> {
@ -25,7 +36,7 @@ public class WindowsUtil {
        });
    }

-    public static Window getStage(Pane pane) {
-        return pane.getScene().getWindow();
+    public static Stage getStage(Pane pane) {
+        return (Stage) pane.getScene().getWindow();
    }
 }
--- a/src/main/java/cn/octopusyan/alistgui/util/alert/ProgressBuilder.java
+++ b/src/main/java/cn/octopusyan/alistgui/util/alert/ProgressBuilder.java
@ -1,6 +1,7 @@
 package cn.octopusyan.alistgui.util.alert;

 import cn.octopusyan.alistgui.config.Context;
+import cn.octopusyan.alistgui.manager.WindowsUtil;
 import javafx.beans.binding.Bindings;
 import javafx.geometry.Insets;
 import javafx.geometry.Pos;
@ -8,6 +9,8 @@ import javafx.scene.Node;
 import javafx.scene.control.*;
 import javafx.scene.layout.HBox;
 import javafx.scene.layout.Pane;
+import javafx.scene.paint.Color;
+import javafx.stage.StageStyle;
 import javafx.stage.Window;

 /**
@ -24,17 +27,22 @@ public class ProgressBuilder extends BaseBuilder<ProgressBuilder, Dialog<Void>>
    public ProgressBuilder(Dialog<Void> dialog, Window mOwner) {
        super(dialog, mOwner);

+        DialogPane dialogPane = dialog.getDialogPane();
+        dialogPane.getScene().setFill(Color.TRANSPARENT);
+        WindowsUtil.bindDragged(dialogPane);
+        WindowsUtil.bindShadow(dialogPane);
+        WindowsUtil.getStage(dialogPane).initStyle(StageStyle.TRANSPARENT);
        var content = getContent();

-        DialogPane pane = dialog.getDialogPane();
-        pane.setContent(content);
-        pane.getButtonTypes().add(new ButtonType(
+        dialogPane.setContent(content);
+        dialogPane.getButtonTypes().add(new ButtonType(
                Context.getLanguageBinding("label.cancel").get(),
                ButtonType.CANCEL.getButtonData()
        ));
-        for (Node child : pane.getChildren()) {
-            if (child instanceof ButtonBar bar) {
-                pane.getChildren().remove(child);
+
+        for (Node child : dialogPane.getChildren()) {
+            if (child instanceof ButtonBar) {
+                dialogPane.getChildren().remove(child);
                break;
            }
        }
--- a/src/main/resources/css/main-view.scss
+++ b/src/main/resources/css/main-view.scss
@ -10,7 +10,7 @@
  -fx-padding: 2 5 2 5;
  -fx-text-fill: white;
  -fx-font-size: 15;
-  -fx-background-color: #1bc964;
+  -fx-background-color: -color-success-3;
  -fx-background-radius: 10;
  -fx-text-alignment: CENTER;
  -fx-border-radius: 10;
@ -22,34 +22,34 @@
  -fx-padding: 10 40 10 40;
  -fx-border-radius: 15;
  -fx-border-width: 2;
-  -fx-opacity: 0.9;
+  -fx-opacity: 1;

  &:hover {
-    -fx-opacity: 1.0;
+    -fx-opacity: 0.9;
  }
 }

 #startButton {
-  -fx-background-color: #fa6057;
-  -fx-border-color: #fa6057;
+  -fx-background-color: -color-danger-emphasis;
+  -fx-border-color: -color-danger-emphasis;
  -fx-text-fill: white;
 }

 #passwordButton {
-  -fx-background-color: #1bc964;
-  -fx-border-color: #1bc964;
+  -fx-background-color: -color-success-3;
+  -fx-border-color: -color-success-3;
 }

 #restartButton {
-  -fx-background-color: linear-gradient(#57b4f2, #9198e5);
-  -fx-border-color: linear-gradient(#57b4f2, #9198e5);
+  -fx-background-color: linear-gradient(to bottom right, -color-accent-3, -color-chart-6);
+  -fx-border-color: linear-gradient(to bottom right, -color-accent-3, -color-chart-6);
  -fx-text-fill: white;
 }

 #moreButton {
  -fx-background-color: transparent;
-  -fx-text-fill: #9254d1;
-  -fx-border-color: #9254d1;
+  -fx-text-fill: -color-chart-6;
+  -fx-border-color: -color-chart-6;
 }

 #logArea {
@ -57,34 +57,12 @@
  -fx-font-size: 20;
  -fx-background-radius: 15;
  -fx-border-radius: 15;
-  -fx-border-color: transparent;
  -fx-background-insets: 0;
-  -fx-background-color: #e9e9e9;
-
-  &:focused {
-    -fx-background-radius: 15;
-    -fx-border-radius: 15;
-    -fx-border-color: transparent;
-    -fx-background-color: #e9e9e9;
-  }

  .content {
    -fx-padding: 0 15 0 15;
    -fx-background-radius: 15;
-    -fx-background-color: #e9e9e9;
    -fx-border-radius: 15;
-    -fx-border-color: transparent;
-
-    &:focused {
-      -fx-background-color: #e9e9e9;
-    }
  }

-  .scroll-pane {
-    -fx-background-color: transparent;
-
-    .viewport {
-      -fx-background-color: transparent;
-    }
-  }
 }
--- a/src/main/resources/css/root-view.scss
+++ b/src/main/resources/css/root-view.scss
@ -14,21 +14,15 @@
  }

  #closeIcon {
-    -fx-color: #fa6057;
-    -fx-background-color: #fa6057;
-    -fx-icon-color: #fa6057;
+    -fx-icon-color: -color-chart-1;
  }

  #minimizeIcon {
-    -fx-color: #fbbc2e;
-    -fx-background-color: #fbbc2e;
-    -fx-icon-color: #fbbc2e;
+    -fx-icon-color: -color-chart-2;
  }

  #alwaysOnTopIcon {
-    -fx-color: #27c940;
-    -fx-background-color: #27c940;
-    -fx-icon-color: #27c940;
+    -fx-icon-color: -color-chart-3;

    &:always-on-top {
      -fx-opacity: 1.0;
@ -40,61 +34,53 @@
 /**************************************************
 * Tab label
 **************************************************/
-
 #tabPane {
+  -fx-background-color: transparent;

  .tab-header-area {
-    -fx-background-radius: 0 0 0 0;
    -fx-background-color: transparent;
-  }
-
-  .headers-region {
-    -fx-alignment: TOP_CENTER;
-    -fx-background-color: #e9e9e9;
-    -fx-background-radius: 15;
-    -fx-padding: 5 0 5 0;
-  }

    .tab-header-background {
      -fx-background-color: transparent;
    }

+    .headers-region {
+      //-fx-background-color: #f9f9fb;
+      -fx-background-color: -color-neutral-muted;
+      -fx-background-radius: 10;
+
      .tab {
-    -fx-padding: 10 20 10 20;
-    -fx-background-radius: 15;
+        -fx-padding: 5;
+        -fx-background-color: transparent;
+
+        .tab-container {
          -fx-background-color: transparent;
          -fx-border-width: 0;

-    .ikonli-font-icon {
-      -fx-icon-color: black;
-    }
-
          .tab-label {
+            -fx-pref-width: 80;
+            -fx-padding: 10 0;
+            -fx-background-radius: 10;
            -fx-text-alignment: CENTER;
            -fx-alignment: CENTER;
+            -fx-font-size: 15px;
+            -fx-border-width: 0;
+          }
        }

        &:selected {
-      -fx-background-color: #2c69e0;
+
+          .tab-label {
+            -fx-background-color: -color-accent-5;
+            -fx-text-fill: white;
+          }

          .ikonli-font-icon {
            -fx-icon-color: white;
          }
-
-      .tab-label {
-        -fx-text-fill: white;
-      }
-
-      .focus-indicator {
-        -fx-border-width: 0;
-        -fx-border-color: transparent;
-        -fx-border-insets: 0;
        }
      }
    }
-
-  .tab-label {
-    -fx-font-size: 15px;
  }
 }

@ -110,15 +96,15 @@
  }

  #document {
-    -fx-text-fill: #1bc964;
+    -fx-text-fill: -color-success-5;
  }

  #github {
-    -fx-text-fill: #1f4ca6;
+    -fx-text-fill: -color-accent-5;
  }

  #sponsor {
-    -fx-text-fill: #f22760;
+    -fx-text-fill: -color-danger-emphasis;
  }

  .ikonli-font-icon {
--- a/src/main/resources/css/root.scss
+++ b/src/main/resources/css/root.scss
@ -10,7 +10,7 @@
  -fx-border-radius: 15;

  // 窗口阴影
-  -fx-background-color: rgba(255, 255, 255, 1);
+  //-fx-background-color: rgba(255, 255, 255, 1);
  -fx-effect: dropshadow(gaussian, rgba(0, 0, 0, 0.3), 15, 0, 0, 0);
  -fx-background-insets: 20;
  -fx-padding: 20;
--- a/src/main/resources/css/setup-view.scss
+++ b/src/main/resources/css/setup-view.scss
@ -8,7 +8,7 @@
  }

  .proxy-panel {
-    -fx-background-color: #e9e9e9;
+    -fx-background-color: -color-neutral-muted;
    -fx-background-radius: 15;
    -fx-border-radius: 15;
    -fx-border-width: 5;
@ -20,7 +20,7 @@

  .proxy-label {
    -fx-font-size: 15;
-    -fx-text-fill: #2c69e0;
+    -fx-text-fill: -color-accent-5;
    -fx-text-alignment: CENTER;
  }
 }