We moved to new unified forum!

Please post all new support queries in our New Forum.

T3 Community Discussion & Support

Let's build the best free Joomla template framework, together!
Subscribe via RSS  Subscribe via email
Recent
Categories
Tags
Users
Badges
View Replies (1)

Resolved Pagination Size Tap Targets Appropriately

0
Votes
Undo
  1. Joshua Lyon
    Joshua Lyon
  2. General Discussion
  3. Thursday, 09 July 2015
  4.  Subscribe via email
In running my site through the PageSpeed Insight tool by Google, one of the only UX issues that remains is that the pagination links are all spaced too closely together.

Is there a way to hide the page numbers when on mobile? For example applying a class like .mobile-hidden to some object?

If not, is there a suggested way to improve the sizing of the tap targets?
Attachments (2)
google_sizetaptargets.png google_sizetaptargets.png
mobile_paginationissue.png mobile_paginationissue.png
References
  1. https://boshdirect.com
  1. purity III
  2. pagination
Comment
There are no comments made yet.
Accepted Answer
Gardner Luna
Gardner Luna
Hole-in-One The Voice
Accepted Answer Pending Moderation
0
Votes
Undo
Hi,

Please open the custom.css file in the folder: templates/t3_bs3_blank/css and add the following css rule:

@media screen and (max-width: 480px) {

	.pagination > li {

		display: none;

	}

	

	.pagination > li:nth-child(1),

	.pagination > li:nth-child(2),

	.pagination > li:nth-child(13),

	.pagination > li:nth-child(14) {

		display: inline-block;

	}

}


Regards.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # Permalink
Responses (1)


There are replies in this post but you are not allowed to view the replies from this post.