implemeted a style
This commit is contained in:
parent
af4603ea26
commit
0d582b06eb
@ -13,6 +13,7 @@ public class App extends Application {
|
||||
public void start(Stage stage) throws IOException {
|
||||
FXMLLoader fxmlLoader = new FXMLLoader(App.class.getResource("main.fxml"));
|
||||
Scene scene = new Scene(fxmlLoader.load(), 320, 240);
|
||||
scene.getStylesheets().add(getClass().getResource("style.css").toExternalForm());
|
||||
stage.setTitle("Question Catalog");
|
||||
stage.setScene(scene);
|
||||
stage.show();
|
||||
|
||||
@ -21,7 +21,9 @@ public class Utils {
|
||||
|
||||
FXMLLoader fxmlLoader = new FXMLLoader(App.class.getResource(fxmlFileName));
|
||||
Parent root = fxmlLoader.load();
|
||||
stage.setScene(new Scene(root));
|
||||
Scene scene = new Scene(root);
|
||||
scene.getStylesheets().add(App.class.getResource("style.css").toExternalForm());
|
||||
stage.setScene(scene);
|
||||
stage.show();
|
||||
}
|
||||
|
||||
|
||||
114
src/main/resources/at/ionas999/questioncatalog/style.css
Normal file
114
src/main/resources/at/ionas999/questioncatalog/style.css
Normal file
@ -0,0 +1,114 @@
|
||||
/* antdesign.css */
|
||||
/* 1. Root Variables */
|
||||
.root {
|
||||
/* Colors */
|
||||
-fx-accent: #1890ff; /* Primary */
|
||||
-fx-background: #f5f5f5; /* Page background */
|
||||
-fx-control-inner-background: #ffffff; /* Surface */
|
||||
-fx-text-base-color: #000000d9; /* High-emphasis text */
|
||||
-fx-text-secondary-color: #00000073; /* Disabled text */
|
||||
|
||||
/* Typography */
|
||||
-fx-font-family: "Helvetica Neue", Arial, sans-serif;
|
||||
-fx-font-size: 14px;
|
||||
}
|
||||
|
||||
/* 2. Buttons */
|
||||
.button {
|
||||
-fx-background-color: -fx-accent;
|
||||
-fx-text-fill: white;
|
||||
-fx-background-radius: 2px;
|
||||
-fx-padding: 8 16;
|
||||
-fx-effect: dropshadow( gaussian , rgba(0,0,0,0.16), 6, 0, 0, 3 );
|
||||
-fx-cursor: hand;
|
||||
-fx-transition: background-color 0.2s ease;
|
||||
}
|
||||
.button:hover {
|
||||
-fx-background-color: #40a9ff; /* Primary Hover */
|
||||
}
|
||||
.button:pressed {
|
||||
-fx-background-color: #096dd9; /* Primary Active */
|
||||
}
|
||||
.button:disabled {
|
||||
-fx-background-color: derive(-fx-accent, 30%);
|
||||
-fx-text-fill: -fx-text-secondary-color;
|
||||
}
|
||||
|
||||
/* 3. Labels */
|
||||
.label {
|
||||
-fx-text-fill: -fx-text-base-color;
|
||||
-fx-font-weight: 600; /* Semibold */
|
||||
}
|
||||
.label.secondary {
|
||||
-fx-text-fill: -fx-text-secondary-color;
|
||||
-fx-font-size: 12px;
|
||||
}
|
||||
|
||||
/* 4. TextInput & TextArea */
|
||||
.text-field, .text-area {
|
||||
-fx-background-color: -fx-control-inner-background;
|
||||
-fx-border-color: #d9d9d9;
|
||||
-fx-border-width: 1;
|
||||
-fx-background-radius: 2px;
|
||||
-fx-border-radius: 2px;
|
||||
-fx-padding: 4 8;
|
||||
-fx-text-fill: -fx-text-base-color;
|
||||
}
|
||||
.text-field:focused, .text-area:focused {
|
||||
-fx-border-color: -fx-accent;
|
||||
-fx-effect: dropshadow( gaussian , rgba(24,144,255,0.2), 6, 0, 0, 0 );
|
||||
}
|
||||
|
||||
/* 5. ListView */
|
||||
.list-view {
|
||||
-fx-background: transparent;
|
||||
-fx-border-color: #d9d9d9;
|
||||
-fx-border-radius: 2px;
|
||||
}
|
||||
.list-cell {
|
||||
-fx-padding: 8 12;
|
||||
-fx-text-fill: -fx-text-base-color;
|
||||
}
|
||||
.list-cell:selected {
|
||||
-fx-background-color: derive(-fx-accent, -20%);
|
||||
-fx-text-fill: white;
|
||||
}
|
||||
|
||||
/* 6. ScrollBar Thumb */
|
||||
.scroll-bar .thumb {
|
||||
-fx-background-color: #d9d9d9;
|
||||
-fx-background-radius: 2px;
|
||||
}
|
||||
.scroll-bar:hover .thumb {
|
||||
-fx-background-color: #bfbfbf;
|
||||
}
|
||||
|
||||
/* 7. Tooltips */
|
||||
.tooltip {
|
||||
-fx-background-color: #000000d9;
|
||||
-fx-text-fill: white;
|
||||
-fx-padding: 4 8;
|
||||
-fx-background-radius: 2px;
|
||||
-fx-font-size: 12px;
|
||||
}
|
||||
|
||||
/* 8. Dialogs & Popovers */
|
||||
.dialog-pane {
|
||||
-fx-background: -fx-control-inner-background;
|
||||
-fx-border-color: #d9d9d9;
|
||||
-fx-border-radius: 2px;
|
||||
-fx-background-radius: 2px;
|
||||
-fx-effect: dropshadow( gaussian , rgba(0,0,0,0.16), 12, 0, 0, 4 );
|
||||
}
|
||||
|
||||
/* 9. Tabs */
|
||||
.tab-pane .tab-header-area .tab {
|
||||
-fx-background-color: transparent;
|
||||
-fx-padding: 8 16;
|
||||
-fx-text-fill: -fx-text-base-color;
|
||||
}
|
||||
.tab-pane .tab-header-area .tab:selected {
|
||||
-fx-background-color: -fx-accent;
|
||||
-fx-text-fill: white;
|
||||
-fx-background-radius: 2px 2px 0 0;
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user