Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • March 27, 2020 at 4:20 am #1198200
    Byrne

    Hi There,
    I have made some styling changes to my blog, I’m using the default blog style with the grid layout, the changes appear on the desktop but not mobile. Here are the changes I’ve made.

    1. Remove the small thumbnail from the post page.
    .single .big-preview.single-small, .single .blog-meta {
    display: none!important;
    }

    2. Change the style of the blog titles on the blog page.
    h3.slide-entry-title.entry-title {
    text-align: cente r!important;
    margin-top: 12px !important;
    font-family: poynter-oldstyle-display, serif !important;
    font-weight: 300 !important;
    font-size: 22px !important;
    text-transform: none !important;
    letter-spacing: 0.3px !important;
    }

    • This topic was modified 4 years, 7 months ago by Byrne.
    March 27, 2020 at 10:08 pm #1198462
    Jordan Shannon

    Hey Byrne,

    Whats the goal you’re trying to accomplish on mobile? It could just require different css from the desktop.

    Best regards,
    Jordan Shannon

    March 30, 2020 at 3:21 am #1198988
    Byrne

    Hi There

    Yes if I could have some help with the CSS.

    1. On the mobile, I want to hide the grey thumbnail at the top of the post page.
    Here’s a screenshot.
    https://www.dropbox.com/s/1wjtirxxni0xvhn/Screenshot%202020-03-30%2014.15.33.png?dl=0

    2. On the mobile, I want the post title font family to be the same as the desktop.
    Here’s the desktop view:
    https://www.dropbox.com/s/9qlgc57kjvn54b9/Screenshot%202020-03-30%2014.17.40.png?dl=0

    Here’s the current mobile view:
    https://www.dropbox.com/s/cjridumjh9shuiq/Screenshot%202020-03-30%2014.18.01.png?dl=0

    Cheers Jane

    April 1, 2020 at 7:59 am #1199638
    Rikard

    Hi Jane,

    Thanks for the update and sorry for the late reply.

    1. I can’t see that on my end on mobile, I can only see the featured images. Did you manage to fix this?

    2. You have this CSS applying to the header:

    h3 {
    font-family: futura-pt,sans-serif !important;
    font-weight: 400;
    font-style: normal;
    letter-spacing: 3px !important;
    margin-bottom: 1em !important;
    text-transform: uppercase !important;
}

    I can’t see where it’s coming from though since your CSS is minified.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.