Unable to modify CSS

  • Unable to modify CSS
    Viewing 9 posts - 1 through 9 (of 9 total)

  • witigna
    Participant
    #3132

    Hi.

    I need to modify a few colors and sizes through custom CSS in “advanced” Theme Options. But some modifications are always get overridden on front end.

    For instances:
    • Tried to change the size of Social media logo size in Footer widget “Reach Us”. should be able to edit via .widgetSocials li & .widgetSocials li div
    • Tried to change the default accordion tab background color. Should be able to edit via .aq_block_accordion

    Please help thanks.


    Omar
    Keymaster
    #3134

    Hello Witigna,

    Did you try using !important to force you CSS.
    It would go something like this;

    #circleFlipFooter .widgetSocials li{
    height: 40px;
    width: 40px;
    }

    That would work 🙂

    Also for the accordion, please try

    .aq_block_accordion{
    background: #fff !important;
    }

    Let me know if you need anything else.
    Cheers


    witigna
    Participant
    #3136

    Hi Omar yes that works. Thx.

    2 more things:
    1• on the widgetSocials, the client wants the background icon color (normal state) to stay true to the facebook and twitter color-blue and light blue. Is this possible? Cause I don’t see a selector for the individual icon color.
    2• on .mainpageTitleImage how do you control the height of the bar?

    Thx.


    Omar
    Keymaster
    #3137

    Hello Witigna,

    A quick solution for the first request, you can use Custome JS
    It would look like

    jQuery(‘#circleFlipFooter .icon-twitter’).parent().parent().css(‘background-color’,’#fff’)

    for the second one, you can find this editable on the Page Edit from the ‘Page Title Style’ box
    Go ahead and edit a page with a title
    find the ‘Page title Style’ Box
    Choose your colors
    http://goo.gl/lvq1Dv

    Cheers


    witigna
    Participant
    #3138

    Omar,

    The first one didn’t work. I copied pasted the above into “Custom Javascript code” box.

    The second one: you misunderstood. what I wanted was to shorten the height of the bar not the color. In ‘Page Title Style’ I chose ‘Page Title with image Background’. There is no options to control the height of the bar.

    Regards,


    Omar
    Keymaster
    #3139

    I am sorry for the misunderstanding,

    for the first one, please note the single quotes copied-pasted look a little odd and in fact are not the real characters needed.
    To remedy this, please delete and retype the ‘ single quotes on the Custom JS panel

    For the Page title height please apply the following.

    .titlepage, .titlepage h1 {
    padding: 5px 0px;
    }
    .colorContainer{
    height: 50px;
    }

    of course you’ll have to adjust the 5px padding according to the height of colorContainer.

    Regards


    witigna
    Participant
    #3146

    Hi Omar,

    The page title height works.

    The javascript also works, only problem is when the icon is rolled over then the color goes back to the grey standard.


    Omar
    Keymaster
    #3151

    Hello Witigna,

    I have found the problem and was able to fix, but you’ll have to change the file themes/circleflip/widgets/contact-information.php with the file found here on the following link http://support.creiden.comwp-content/uploads/2014/12/contact_information.rar

    Regards


    witigna
    Participant
    #3164

    Awesome! That works….

Viewing 9 posts - 1 through 9 (of 9 total)

The topic ‘Unable to modify CSS’ is closed to new replies.