Okay
  Public Ticket #2302018
Mobile Breakpoint
Closed

Comments

  • Oliver started the conversation
    February 16, 2020 at 10:52pm

    Hello,

    I would like my social icons to remain in the header on mobile. Is this possible with custom CSS? Perhaps by reducing the mobile breakpoint to 1px?

    Many thanks in advance!

    Ollie.

  •  3,022
    Andrew replied
    February 17, 2020 at 6:01am

    Hi Oliver,

    It is not possible to lower the mobile breakpoint.

    Hope this helps.

  • Oliver replied
    February 17, 2020 at 7:58am

    Hi Andrew,

    Thanks for your reply. Is there another way to add the social icons to the mobile header?

  •  3,022
    Andrew replied
    February 17, 2020 at 11:05am

    Hi Oliver,

    Not possible to enable on header. Try adding social icons to mobile menu in Salient > Header navigation > Off canvas/Mobile menu.

    4898436965.png


    Hope this helps,

  • Oliver replied
    February 17, 2020 at 12:30pm

    Many thanks, Andrew.


    Is it please possible to position the off-canvas social icons at the bottom (below the text where my contact details currently are)?

  •  3,022
    Andrew replied
    February 17, 2020 at 12:37pm

    Hi Oliver,

    They will be positioned below. Make sure you add social media url in Salient > Social media

    1505183934.png


    Hope this helps.

  • Oliver replied
    February 17, 2020 at 1:00pm

    Hi Andrew,


    When I add the social icons, they are being positioned between the page links and my contact details. Is there a way to put them below my contact details. Please have a look: www.oliverpayne.com


    Thank you!

  •  3,022
    Andrew replied
    February 17, 2020 at 1:17pm

    Hi Oliver,

    The social links are not visible on our end. Can you enable so that we see possible custom css

    1019597937.png


    Thanks.

  •  3,022
    Andrew replied
    February 17, 2020 at 1:39pm

    Hi Oliver,

    Try the following custom css in Salient > General settings > CSS/Script related:

    .bottom-meta-wrap {
    display: flex !important;
    flex-direction: column-reverse !important;
}

    Hope this helps.

  • Oliver replied
    February 17, 2020 at 4:44pm

    Perfect! Thank you SO much.