Different views

  • Resolved spaniole

    (@spaniole)


    3 years, 10 months ago

    I have 2 WordPress sites running the amazing Football Pool plugin, they run the same version of WordPress (5.6) and the same Theme (same setup and version, just different colors), but with different versions of the Football Pool plugin. And here is my challenge, the FP 2.8.1 in mobile view looks good, the /user/ page goes from side to side all the way up and down, please see appendix 1 (fp281.png), but with FP 2.9.4 and in the same mobile view, the top of the /user/ page won’t fit from side to side, please see appendix 2 (fp294.png).

    I can see the difference, the FP 2.8.1 does not have the the blue/yellow/red symbol to see other users predictions in mobile view, but the FP 2.9.4 does have it.

    I think it is the pool.css file I have to edit, but also maybe a page with a table to adjust, but I’m not sure. How can I get FP 2.9.4 to fit like FP 2.8.1 at the /user/ page in mobile view? There is no problem at all with the Desktop view. Thanks a lot.

    Appendix 1: https://www.dropbox.com/s/85bs18vdaqf8rzw/fp281.png?dl=0
    Appendix 2: https://www.dropbox.com/s/ianrr54regwyzjt/fp294.png?dl=0

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author AntoineH

    (@antoineh)

    hi,
    This is a styling problem and needs to be adjusted in your css. Best option: add it to your Additional CSS in the Appearance > Customize menu. That way your other website will not be affected. Never make changes to the pool.css, because then your changes will be deleted on every plugin update.

    From the images I can’t tell what to adjust, but it looks like the table width (or cells) ‘push’ the column out.

    Another option is to change to the new flex layout (see plugin options). That layout is better optimized for mobile view.

    Thread Starter spaniole

    (@spaniole)

    Thank you for your quick answer.
    Please see Dropbox link for maybe further action. Thanks.

    Link: https://www.dropbox.com/s/5jrkbhx53ita26n/Just_some_screendumps_from_Football_Pool.pdf?dl=0

    Plugin Author AntoineH

    (@antoineh)

    regarding the comments in your PDF:

    1. The placement of the flags and the rest is not correct in your theme ?? It should look something like this. The new layou is a flex layout and it looks like the individual blocks are a bit too big to fit on one line, causing them to be pushed to the next line. This means a small adjustment is needed for your theme.

    2. The pool.css is automatically compiled from individual scss files and compressed, so, to be honest, I also do not always know where to look in the css. Best option is to use inspect in your browser, change the css in the developer window until it is correct and then copy & paste that into your additional css. But looking at your problem I think you need to make the image smaller for mobile viewports, e.g.:

    @media ( max-width: 767px ) {
  table.matchinfo td.matchstats a img {
    /* your css */
  }
}
    • This reply was modified 3 years, 10 months ago by AntoineH. Reason: added media query
    Thread Starter spaniole

    (@spaniole)

    Thank you, I will try your CSS recommendation, and maybe try a different theme.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Different views’ is closed to new replies.