|
SCCDS
|
September 24, 2020 at 3:12 pm
Hello, hope guys are doing well. On our recent website sccds.org, our client has recently brought to our attention that the page https://sccds.org/events-and-courses which is using the table view addon had broken pagination, and the filters including search and filtering by category were also broken. I was wondering if someone could check this out and see if maybe this is an issue with how we implemented something or if its a bug in the plugin. We didn’t really do much in the way of changing this except for some CSS. I’m willing to provide login info if needed.
|
|
Tony
|
September 29, 2020 at 8:25 am
Hi there,
The pagination on that table is done with Footable which, in short, changes the display attribute on each row.
On your site you are forcing each row to use display: flex; with this:
.espresso-table-header-row tr,
.espresso-table-row {
display: flex !important;
flex-flow: row wrap !important;
width: 100% !important;
}
That’s in your child theme’s style.css file.
You’ll need to remove the above for pagination to work, or if you want to use the above you’ll need to remove the pagination.
|
|
SCCDS
|
October 1, 2020 at 2:59 pm
Hi Tony sorry to get back to you late, thanks for the advice. I’ll see if I can get a work around for this and get back to you, this was mainly to make the existing widget more attractive. What about the categories I mentioned, is this related to the same issue?
|
|
Tony
|
October 1, 2020 at 3:30 pm
Almost certainly yes, the category filter runs show() and hide() on each row that has/does not have the category class.
If you forcing the display to be something else with !important it will also override that.
|
|
SCCDS
|
October 1, 2020 at 5:23 pm
Hello Tony thanks for the help, I was able to change it with very little effort, the only issue that seems to present itself is it does not properly display on mobile view anymore. I’ve tried a couple things but it seems to overflow outside of the container instead of scaling to 100% for some reason. If you could provide some suggestions, not very used to the aged table layouts anymore, thanks!
|
|
Tony
|
October 5, 2020 at 5:22 am
In short, you’ll need to either reduce the size of the columns or hide one of them.
For example hiding the Venu column on mobile:
@media (max-width: 420px) {
#ee_filter_table th:nth-of-type(2),
#ee_filter_table td:nth-of-type(2) {
display: none;
}
}
|
