problem with formatting on mobile device

Hi,

first of all, I'm very impressed with the plugin and it works very well.
I've been setting it up on a site I'm working on for a massuese.
One thing that is bugging me is when viewing the appointments page on a mobile device it doesn't display well for the screen size. I removed the [app*] one by one to see which was the culprit and narrowed it down to the [app_pagination] one. If I remove
<tr>
<td>
[app_pagination month="1"]
</td>
</tr>
then it displays fine but of course that is needed for it to work as intended.

Any help much appreciated and I'm sure I'm missing something obvious!

Tim :slight_smile:

  • totzo
    • New Recruit

    I found a workaround for this issue which hopefully won't break if I update the plugin, I didn't want to do all the styling in my theme css so added this in the plugin option for css styling:

    @media only screen and (max-width: 480px) {
    table.appointments-legend-table td{
    min-width: 0px;
    }
    }

    it seems that the "min-width: 30px" in front.css was causing the page to be too wide on mobile devices.

  • Tom Eagles
    • Syntax Hero

    @totzo

    Nice work around the only thing you may have to do is add that code back into the css on updates. I normally keep a text file with any custom css etc i add to plugins in with notes and line numbers just in case i need to update them and forget i have made changes and update before backing em up.

    Cheers

  • totzo
    • New Recruit

    thanks Tom,

    I put the code in the plugin admin option for custom css so there are no changes to the front.css. I'll keep a note of it all the same though! I wondered if it was just the theme I was using but it seemed to be the same for the few others I've been testing- might be worth flagging up with the devs?

    cheers,

    Tim

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.