Okay
  Public Ticket #2410391
Toggle Panel Title Font
Closed

Comments

  •  2
    Riall started the conversation
    May 20, 2020 at 1:32pm

    Good Day,

    I would like the font used in the toggle menu titles to match the rest of my website. (I believe toggle panels use H3 & H4?).

    I am looking for some help in order to customize toggle panels. I've found css snippets from other tickets but it is not working. Here's the snippet I used:

    .toggle h3 a h4 {       font-size: 20px !important;   }


    Is there anything else you'd recommend?


    Thanks,

    Riall

  •  2,979
    Andrew replied
    May 20, 2020 at 2:15pm

    Hi Riall,

    Use the following:

    .toggle h3 a {
    font-size: 20px !important;
}

    Hope this helps.

  •  2
    Riall replied
    May 20, 2020 at 2:30pm

    Hi Andrew,

    It worked really well! Thanks Andrew. I added some font code and it's working just like I wanted it to look. Last question on this: In the Minimal Small setting, can I adjust the line thickness and/or colour below the toggle title?

    Thanks,

    Riall

  •  2,979
    Andrew replied
    May 20, 2020 at 2:43pm

    Hi Riall,

    Try the following:

    div[data-style="minimal_small"] .toggle > h3:before {
    height: 5px;
    background: red;
}

    If we missed something the share a screenshot.

    Thanks.

  •  2
    Riall replied
    May 20, 2020 at 2:53pm

    Hi Andrew,

    That worked as well! Thank you for the fast responses.

    To complete the process, can you send the code to adjust the line height and colour for the non-open state.

    Also, I'm assuming Toggle Panels are not permitted in Inner Rows?

    Thanks,

    Riall

  •  2
    Riall replied
    May 20, 2020 at 5:36pm

    Hey Andrew,

    I figured it out using the following code:

    div[data-style="minimal_small"] .toggle > h3:before {
        height: 1px;
        background: #000000 !important;
    }

    div[data-style="minimal_small"] .toggle > h3:after {
        height: 2px;
        background: #CC9966 !important;
    }

    Looks good. Thanks again for pointing me in the right direction.

    Thanks,

    Riall