Tagged: ,

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • March 5, 2014 at 7:14 pm #232872
    HiDrew

    Hi there,

    Iʻm working on the site at: http://http://pmf.beta-kalani.com/

    On the home page, you will see we have an icon list. How can I change the color of those icons?

    On this page: http://pmf.beta-kalani.com/schedule/#toggle-id-3 you will see that the Kalapana Night Market has an icon list embedded. But that icon list is too large really for the space. I am using the icon list elsewhere, as you have seen – is there a way to custom style icon lists on a specific page to be smaller? If so – Iʻd like the icons about half the size, and the heading to be #C14000 and mixed case (not all caps).

    For the accordions, how can I make the text for the accordion heading larger?

    Many thanks for your help, as always!
    Drew

    March 6, 2014 at 7:06 am #233072
    Ismael

    Hi AndrewDelaware!

    Thank you for using the theme. I hope you’re doing great.

    1.) Change the icon list background color using this:

    .main_color .avia-icon-list .iconlist_icon {
background-color: red;
}

    2.) Please use this on Quick CSS or custom.css to change the size of the icon list on the toggle:

    .avia-icon-list .iconlist_title {
text-transform: normal;
color: #C14000 !important;
}

.page-id-56 .iconlist-char {
font-size: 15px;
}

.page-id-56 .avia-icon-list .iconlist_icon {
height: 32px;
width: 32px;
line-height: 32px;
font-size: 15px;
margin-right: 30px;
margin-left: 15px;
}

    Best regards,
    Ismael

    March 24, 2014 at 10:21 pm #242376
    HiDrew

    Hi there, working great – except the text transform doesn’t work (I even added !important) – any thoughts?

    Also – how can I increase the font size of the text for the toggle itself, and the body text within each toggle?

    Many thanks!
    Drew

    March 26, 2014 at 8:16 am #243191
    Dude

    Hi!

    1) normal is not a valid value. Please use this code instead:

    
.avia-icon-list .iconlist_title {
text-transform: none !important;
}

    2) To change the font size use:

    
#top .toggle_content, .js_active .toggler {
font-size: 13px;
}

    Cheers!
    Peter

    May 13, 2014 at 8:14 pm #264170
    CharlieBarey

    Can i change the space between lines? I want it smaller. I tried it with margin bottom, but does not work.

    May 14, 2014 at 5:58 am #264483
    Ismael

    Hi!

    You can change the bottom padding of the icon list. Use this:

    .avia-icon-list li {
padding: 0 0 10px 0;
}

    Cheers!
    Ismael

    May 14, 2014 at 4:49 pm #264758
    CharlieBarey

    Thanks Isnamel!
    Is it possible to use negative values? I want it even smaller

    May 15, 2014 at 11:13 pm #265593
    Yigit

    Hey!

    Please add following code to Quick CSS 

    .avia-icon-list li { line-height: 10px; }

    Best regards,
    Yigit

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