How to change the CSS for Brooklyn theme pagination?

Solved
Highlighted
Tourist
18 0 3

Hi All,

My website is https://flawedbyshaleen.com/ and the password is "flawed". I am looking at the pagination on collections page (for eg. https://flawedbyshaleen.com/collections/all-products) and I see that the prev and next are coming in different lines. When I inspect the element, I see:

span.current {
display: block !important;
text-align: center !important;
}

I want to remove display: block !important; so the prev and next are in the same line.

However, span.current is not part of any CSS file and the theme uses default filter in pagination.liquid:

<div class="pagination">
{{ paginate | default_pagination: previous: previous_label, next: next_label }}
</div>

Where can I find the code / CSS for the default filters being used? 

Surprisingly, when I look at the brooklyn theme demo https://brooklyn-theme-classic.myshopify.com/collections/all , I do not see this CSS. I am not sure how this got changed for my instance because I haven't worked on this section. 

Can someone please help?

Thanks,

Priyanka

0 Likes
Highlighted
Excursionist
34 8 9

Hello @itspriyanka , this CSS should be somewhere in the theme files. If you allow me to access your store backend I can find the CSS and fix it for you.

0 Likes
Highlighted
Excursionist
34 8 9

This is an accepted solution.

Hi @itspriyanka , there is one more way to fix this. Just add this CSS in your theme's CSS file and you will be good to go.

.pagination>span.current {
    display: inline-block !important;
}

 

Let me know if that works for you. 

0 Likes
Highlighted
Tourist
18 0 3
Hi,

Thanks. Can you send a collaborator request or let me know your ID so I can
create a staff account for you?

Thanks,
Priyanka
0 Likes
Highlighted
Tourist
18 0 3

Hi,

This fixed the issue.Thanks a ton!

Regards,

Priyanka

0 Likes