Mobile version colour block problem

  • Author
    Posts
  • #142526

    curiousjeorge92
    Member
    Original poster

    Hi,

    My website has the grey box pop up covering all of the blog posts on mobile and it looks awful!

    Could you please let me know how to remove the effect?

    The site I need help with is http://www.curiousjeorge.com

    Thanks,

    G

    The blog I need help with is: (visible only to logged in users)

    #142529

    binarymoon
    Theme Author

    Hi there

    The overlay displays so that you can see the post title. On desktop it is hidden until you put the mouse over the posts, but hovering like this isn’t possible on a touch device so it’s shown by default.

    We can tweak the display with some custom css but that requires a paid plan:
    https://en.support.wordpress.com/custom-css/

    If you have a paid plan, and want some css, then let me know what you want to do. A few options include hiding the overlay entirely. Changing the overlay colour. Changing the overlay transparency.

    #142532

    curiousjeorge92
    Member
    Original poster

    Hi,

    Thanks for getting back to me so quickly, much appreciated!

    I have a paid plan so I should be able to apply the CSS and I would like my site to replicate how the one below works with your theme;

    https://willseaborn.com/

    On mobile, it works nicely while still looking good on desktop.

    Thanks again,

    George

    #142541

    binarymoon
    Theme Author

    No problem. To do this you need the following css:

    .main .post-archive article h2.entry-title a,
    .main .post-archive article .post-meta-data a,
    .main .post-archive article .post-meta-data {
        color: #fff;
    }
    
    .main .post-archive article.post-has-thumbnail .entry {
        background-color: rgba(0,0,0,0.2);
    }
    #142549

    curiousjeorge92
    Member
    Original poster

    Great, that has worked a treat.

    Thanks a lot!

The topic ‘Mobile version colour block problem’ is closed to new replies.