Tagged: 

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • December 14, 2018 at 6:09 pm #1045366
    lzevon

    I am trying to apply toggle ids and also style the icon to be one color and the text another…

    .my-custom-class .toggle_icon { color: #ffffff !important; background: #00aeef !important; }
    .my-custom-class .toggle_icon { color: #ffffff; background: #ed4f3e; }
    .my-custom-class-2 .toggler, .my-custom-class .toggler { font-size: 18px; font-weight: 600; color: #222222; }

    But the toggle ids (something I’ve done many other times) don’t work and neither do the custom styles I’m trying to apply?

    December 16, 2018 at 7:23 pm #1046025
    Nikko

    Hey lzevon,

    I have checked your site, and could see your css code working effectively:

    .the-nine-topics .toggle_icon {
    padding: 2px;
    color: #ffffff !important;
    background: #00aeef !important;
}

    but since you mentioned ids, maybe this selector can help:

    .the-nine-topics [data-fake-id="#toggle-id-1"] .toggle_icon {
  //css code here
}

    Best regards,
    Nikko

    December 18, 2018 at 9:42 pm #1047015
    lzevon

    I still can’t see the padding and formatting I’m trying to achieve with everything I can think of (border-spacing, padding, margins, etc)? The imgur link shows how I want the ‘+’ centered and not so bold (I set the border-width which helped) – any suggestions?

    December 19, 2018 at 10:07 pm #1047438
    Victoria

    Hi lzevon,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
#top .toggle_icon .vert_icon,
#top .toggle_icon .hor_icon {
    border-width: 1px;
}
#top .toggle_icon .hor_icon {
    top: 8px;
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Accordions custom toggle ids and css not working’ is closed to new replies.