From ac6e777e3dd14b15df56dba574e170e95cc6aa87 Mon Sep 17 00:00:00 2001 From: Fateme Azizi Date: Thu, 28 May 2026 04:18:34 +0330 Subject: [PATCH] add light.css and dark.css --- src/main/resources/sbu/javafx/dark.css | 92 +++++++++++++++++++++++++ src/main/resources/sbu/javafx/light.css | 0 src/main/resources/sbu/javafx/music.css | 74 -------------------- 3 files changed, 92 insertions(+), 74 deletions(-) create mode 100644 src/main/resources/sbu/javafx/dark.css create mode 100644 src/main/resources/sbu/javafx/light.css delete mode 100644 src/main/resources/sbu/javafx/music.css diff --git a/src/main/resources/sbu/javafx/dark.css b/src/main/resources/sbu/javafx/dark.css new file mode 100644 index 0000000..3f41f46 --- /dev/null +++ b/src/main/resources/sbu/javafx/dark.css @@ -0,0 +1,92 @@ +/* Overall application background */ +.root { + -fx-font-family: "Segoe UI", "Inter", "Arial"; /* Modern, clean fonts */ + -fx-background-color: #0f172a; /* Very dark blue/black */ + -fx-padding: 20; +} + +/* Main container for the music list */ +.main-container { /* Applied to the root VBox */ + -fx-background-color: #111827; /* Dark slate background */ + -fx-background-radius: 18; /* Rounded corners */ + -fx-padding: 20; + -fx-spacing: 14; /* Space between elements */ + -fx-effect: dropshadow(gaussian, rgba(0, 0, 0, 0.35), 20, 0.2, 0, 6); /* Stronger shadow for dark mode */ +} + +/* Header row (Track, Artist, etc.) */ +.header-row { + -fx-alignment: center-left; + -fx-padding: 0 0 10 0; + -fx-spacing: 14; +} + +/* Column headers within the header-row */ +.header-row .label { + -fx-text-fill: #f8fafc; /* Off-white for headers */ + -fx-font-size: 14px; + -fx-font-weight: bold; +} + +/* Individual track rows */ +.track-row { + -fx-background-color: #1f2937; /* Darker gray for rows */ + -fx-background-radius: 14; + -fx-padding: 10 14; + -fx-spacing: 14; + -fx-alignment: center-left; +} + +.track-row:hover { + -fx-background-color: #273244; /* Slightly lighter gray on hover */ + -fx-cursor: hand; +} + +/* Labels within track rows */ +.track-row .label { + -fx-text-fill: #cbd5e1; /* Light gray for track info */ + -fx-font-size: 13px; +} + +/* Buttons */ +.button { + -fx-background-color: #3b82f6; /* Bright blue */ + -fx-text-fill: white; + -fx-background-radius: 10; + -fx-padding: 8 14; + -fx-font-size: 13px; + -fx-cursor: hand; + -fx-border-width: 0; +} + +.button:hover { + -fx-background-color: #2563eb; /* Darker blue on hover */ +} + +.button:pressed { + -fx-background-color: #1d4ed8; /* Even darker blue when pressed */ +} + +/* Specific styling for the Playlist button */ +#PlayListButton { /* Use fx:id for specific element styling */ + -fx-background-color: #22c55e; /* Bright green */ +} + +#PlayListButton:hover { + -fx-background-color: #16a34a; /* Darker green on hover */ +} + +#PlayListButton:pressed { + -fx-background-color: #15803d; /* Darkest green when pressed */ +} + +/* Footer row (Playing: and Playlist button) */ +.footer-row { + -fx-alignment: center-left; + -fx-padding: 16 0 0 0; + -fx-spacing: 10; +} + +.footer-row .label { + -fx-text-fill: #94a3b8; /* Lighter gray for "Playing:" text */ +} diff --git a/src/main/resources/sbu/javafx/light.css b/src/main/resources/sbu/javafx/light.css new file mode 100644 index 0000000..e69de29 diff --git a/src/main/resources/sbu/javafx/music.css b/src/main/resources/sbu/javafx/music.css deleted file mode 100644 index e7366d5..0000000 --- a/src/main/resources/sbu/javafx/music.css +++ /dev/null @@ -1,74 +0,0 @@ -.root-pane { - -fx-padding: 20; - -fx-background-color: linear-gradient(to bottom right, #1e1e2f, #2b2b45); -} - -.header-row { - -fx-padding: 10 0 15 0; -} - -.header-label { - -fx-text-fill: white; - -fx-font-size: 24px; - -fx-font-weight: bold; -} - -.song-row { - -fx-padding: 12; - -fx-background-color: rgba(255, 255, 255, 0.08); - -fx-background-radius: 12; - -fx-border-radius: 12; - -fx-border-color: rgba(255, 255, 255, 0.15); - -fx-border-width: 1; -} - -.song-title { - -fx-text-fill: white; - -fx-font-size: 16px; - -fx-font-weight: bold; - -fx-min-width: 160px; -} - -.song-artist { - -fx-text-fill: #cfcfe8; - -fx-font-size: 14px; - -fx-min-width: 140px; -} - -.song-duration { - -fx-text-fill: #a8a8c8; - -fx-font-size: 13px; - -fx-min-width: 60px; -} - -.play-button { - -fx-background-color: #4CAF50; - -fx-text-fill: white; - -fx-font-weight: bold; - -fx-background-radius: 8; -} - -.play-button:hover { - -fx-background-color: #43a047; -} - -.secondary-button { - -fx-background-color: #2196F3; - -fx-text-fill: white; - -fx-background-radius: 8; -} - -.secondary-button:hover { - -fx-background-color: #1976D2; -} - -.primary-button { - -fx-background-color: #ff9800; - -fx-text-fill: white; - -fx-font-weight: bold; - -fx-background-radius: 8; -} - -.primary-button:hover { - -fx-background-color: #fb8c00; -}