I attempted to add some styling to an accordion panel and encountered a issue.
Unfortunately, my attempt was unsuccessful.
accordion.setEffect(new DropShadow(BlurType.ONE_PASS_BOX, Color.BLACK, 8, 0, 2, 0));
The CSS approach I tried also did not yield the desired result.
.accordion{
-fx-effect: dropshadow( one-pass-box , black , 8 , 0.0 , 2 , 0 );
}
Currently, it appears as follows...
However, I would like the shadow effect to be similar to that of this table-view...
I attempted to research online for a solution but had no luck!
If anyone knows how to achieve this, thank you in advance for your help!
P.S.
The following variations were also unsuccessful:
.accordion .pane{
-fx-effect: dropshadow( one-pass-box , black , 8 , 0.0 , 2 , 0 );
}
.accordion .titled-pane{
-fx-effect: dropshadow( one-pass-box , black , 8 , 0.0 , 2 , 0 );
}
.accordion .titled-pane .title{
-fx-effect: dropshadow( one-pass-box , black , 8 , 0.0 , 2 , 0 );
}
.accordion .titled-pane > *.content{
-fx-effect: dropshadow( one-pass-box , black , 8 , 0.0 , 2 , 0 );
}
.accordion > .titled-pane > .content{
-fx-effect: dropshadow( one-pass-box , black , 8 , 0.0 , 2 , 0 );
}