thumbnailClasses changing border size

[lieira]

I tried to change the border size and was unsuccessful, i declare in my angular project this:

In my Typescript component .ts

this.galleryOptions = [ { // max-width +800 width: '100%', height: '700px', thumbnailsColumns: 4, imageAnimation: NgxGalleryAnimation.Slide, //imageAutoPlay: true, imageAutoPlayInterval: 4000, imageAutoPlayPauseOnHover: true, preview: false, thumbnailsPercent: 20, thumbnailMargin: 10, thumbnailClasses: ['ngx-gallery-custom'] }, // max-width 800 { breakpoint: 800, width: '100%', height: '600px', imagePercent: 80, thumbnailsPercent: 20, thumbnailsMargin: 20, thumbnailMargin: 20 }, // max-width 400 { width: '100%', height: '350px', breakpoint: 400, preview: false, } ];

In my .sass component

.ngx-gallery-custom border: 5px double #000;

[weishenggg98]

You can access the class using ng::deep Override CSS for unselected thumbnail border

::ng-deep.ngx-gallery-thumbnails .ngx-gallery-thumbnail {
    border: none !important;
}

Override CSS for selected thumbnail border

::ng-deep.ngx-gallery-thumbnails .ngx-gallery-thumbnail.ngx-gallery-active {
    border: 1px solid rgba(59, 59, 59, 0.5) !important;
}