From 3528a16b0e9d1a75eb1c70735c3888eaa9cbebbb Mon Sep 17 00:00:00 2001 From: tobias <thinkdifferent055@gmail.com> Date: Fri, 4 Dec 2020 17:37:20 +0100 Subject: [PATCH] Improve list styling --- .../view/option/pad/PlaylistTab.fxml | 2 +- .../src/main/sass/components/dark-list.scss | 23 +++++++++++++++++++ PlayWall/src/main/sass/components/list.scss | 9 +++++--- PlayWall/src/main/sass/modern.scss | 1 + 4 files changed, 31 insertions(+), 4 deletions(-) create mode 100644 PlayWall/src/main/sass/components/dark-list.scss diff --git a/PlayWall/src/main/resources/view/option/pad/PlaylistTab.fxml b/PlayWall/src/main/resources/view/option/pad/PlaylistTab.fxml index c8c8aeb9..6f25be3e 100644 --- a/PlayWall/src/main/resources/view/option/pad/PlaylistTab.fxml +++ b/PlayWall/src/main/resources/view/option/pad/PlaylistTab.fxml @@ -8,7 +8,7 @@ <children> <VBox spacing="14.0"> <children> - <ListView fx:id="mediaPathListView" prefWidth="250.0" VBox.vgrow="ALWAYS" styleClass="dark-list"/> + <ListView fx:id="mediaPathListView" prefWidth="250.0" VBox.vgrow="ALWAYS"/> <HBox spacing="14.0"> <children> <Button fx:id="addButton" maxWidth="1.7976931348623157E308" mnemonicParsing="false" diff --git a/PlayWall/src/main/sass/components/dark-list.scss b/PlayWall/src/main/sass/components/dark-list.scss new file mode 100644 index 00000000..080f1812 --- /dev/null +++ b/PlayWall/src/main/sass/components/dark-list.scss @@ -0,0 +1,23 @@ +@import "variables"; + +.dark-list { + -fx-base: rgb(60, 60, 60); + + + .list-cell { + -fx-skin: "com.sun.javafx.scene.control.skin.ListCellSkin"; + -fx-background-color: -fx-base; + -fx-padding: 10px; + -fx-text-fill: #FFFFFF; + -fx-opacity: 1; + + &:filled { + -fx-border-width: 0px 0px 1px 0px; + -fx-border-color: #00000044; + } + + &:odd { + -fx-background-color: -fx-base; + } + } +} \ No newline at end of file diff --git a/PlayWall/src/main/sass/components/list.scss b/PlayWall/src/main/sass/components/list.scss index 1ea1f4bc..c1de8fdc 100644 --- a/PlayWall/src/main/sass/components/list.scss +++ b/PlayWall/src/main/sass/components/list.scss @@ -1,19 +1,22 @@ @import "variables"; -.dark-list { +.list-view { -fx-base: rgb(60, 60, 60); .list-cell { -fx-skin: "com.sun.javafx.scene.control.skin.ListCellSkin"; -fx-background-color: -fx-base; - -fx-padding: 10px; + -fx-padding: 4px; -fx-text-fill: #FFFFFF; -fx-opacity: 1; &:filled { -fx-border-width: 0px 0px 1px 0px; - -fx-border-color: #00000044; + } + + &:odd { + -fx-background-color: derive(-fx-hover-base, -10%); } } diff --git a/PlayWall/src/main/sass/modern.scss b/PlayWall/src/main/sass/modern.scss index 7046c6af..bb353f61 100644 --- a/PlayWall/src/main/sass/modern.scss +++ b/PlayWall/src/main/sass/modern.scss @@ -12,6 +12,7 @@ @import "components/menu"; @import "components/toggle-button"; @import "components/list"; +@import "components/dark-list"; @import "components/progress-bar"; @import "components/dialog"; @import "components/treeview"; -- GitLab