Home Forums Azuma Pro Search form in header text color

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #9917
    Frederik Leemans
    Participant

    I’ve noticed a different rendering of the search form in the header, depending on the browser (Safari vs Chrome). My main problem is that in Safari, the text is white on a white background. Any ideas how to address this?

    Thanks,

    Frederik

    #9921
    Andy
    Keymaster

    Hi Frederik, do you have it on a live site that I can take a look at please?

    #9922
    Andy
    Keymaster

    Could you try adding this CSS to Customize > Additional CSS:

    #masthead .search-form input[type="search"],
    #masthead .woocommerce-product-search input[type="search"] {
        background: #000000;
    }

    Please let me know if that works, or not. Thanks.

    #9923
    Frederik Leemans
    Participant

    Sure. Still ‘under construction’, but this is it:

    Thanks,

    Frederik

    #9925
    Frederik Leemans
    Participant

    Hi Andy,

    Doesn’t seem to resolve the problem…

    I do have another bit of extra CSS in there, but I don’t think it would interfere:

    .entry-header.with-image.full:before,
    .archive-header.with-image.full:before {
    background: transparent;
    }

    Picked that up from this site to keep the original header image colors.

    Thanks,

    Frederik

    #9928
    Andy
    Keymaster

    Thanks, yes that extra CSS would not intefere with the search form.

    Will need to do some more digging into this. Will get back to you soon when I have more information.

    Thanks.

    #9929
    Andy
    Keymaster

    Okay, please remove the CSS I gave you earlier and replace with this:

    #masthead .search-form input[type="search"],
    #masthead .woocommerce-product-search input[type="search"] {
        -moz-appearance: none;
        -webkit-appearance: none;
        background: #2d364c;
    }

    Let me know if that works, thanks.

    #9931
    Frederik Leemans
    Participant

    Yep, that seems to fix the problem.

    Thanks!

    Frederik

    #9933
    Andy
    Keymaster

    Thanks for letting me know it works.

    -webkit-appearance: none; should have been included in the theme so that the styling will work with safari. I’ll get the theme updated with this any other form inputs where it may be missing.

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