tablet/atlantafx
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add hover effect for tab pane close button

Browse Source
This commit is contained in:
mkpaz 2023-02-11 09:11:26 +04:00
parent 605f867f8a
commit 4499668b35
2 changed files with 10 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.md
View File

@ -17,6 +17,7 @@ This is a bugfix/maintenance release that also contains a few style improvements
- (Build) SceneBuilder theme pack generation (#28) (thanks to **ennerf**). - (Build) SceneBuilder theme pack generation (#28) (thanks to **ennerf**).
- (CSS) Add inner border radius to improve controls border corners (#24) (thanks to **mimoguz**). - (CSS) Add inner border radius to improve controls border corners (#24) (thanks to **mimoguz**).
- (CSS) Hover effect for `CheckBox` and `RadioButton`. - (CSS) Hover effect for `CheckBox` and `RadioButton`.
- (CSS) Hover effect for `TabPane` close button.
- (CSS) Setting `Label` color via pseudo-classes support. - (CSS) Setting `Label` color via pseudo-classes support.
- (CSS) Setting `FontIcon` color support. - (CSS) Setting `FontIcon` color support.
- (CSS) Increased `Menu`/`Menubar` paddings. - (CSS) Increased `Menu`/`Menubar` paddings.

9
styles/src/components/_tab-pane.scss
View File

@ -93,6 +93,15 @@ $tab-float-width: 150px !default;
-fx-background-color: $color-fg; -fx-background-color: $color-fg;
-fx-shape: "M 0,0 H1 L 4,3 7,0 H8 V1 L 5,4 8,7 V8 H7 L 4,5 1,8 H0 V7 L 3,4 0,1 Z"; -fx-shape: "M 0,0 H1 L 4,3 7,0 H8 V1 L 5,4 8,7 V8 H7 L 4,5 1,8 H0 V7 L 3,4 0,1 Z";
-fx-scale-shape: false; -fx-scale-shape: false;
// Close button implemented as a single StackPane that transformed to the close icon via SVG path.
// Since there's no any wrapper around it, it's impossible to create background color hover effect.
// We can only manipulate icon color or scale or cursor.
&:hover {
-fx-cursor: hand;
-fx-scale-x: 1.1;
-fx-scale-y: 1.1;
}
} }
} }