Skip to content

[Ionic v4] Allow swiper-pagination to be styled #14984

@peterpeterparker

Description

@peterpeterparker

Ionic Info
@ionic/angular: "4.0.0-beta.1"

Describe the Feature Request
I would like to be able to style the swiper-pagination element of the slides

For example, in my v3 app, I display the pagination as progressbar at the bottom of the slides

Because of shadow dom, this isn't possible anymore, a style like the following won't be applied

div.swiper-pagination.swiper-pagination-progressbar {
    top: inherit;
    bottom: 0;
}

Related Code

slideOptsProgressbar: SwiperOptions = {
    pagination: {
        el: '.swiper-pagination',
        type: 'progressbar'
    }
};

<ion-slides pager="true" [options]="slideOptsProgressbar">
</ion-slides>

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions