changing the mobile menu and search bar look

Did you clear your caching plugin after the updates?

If the issue still exists, can you disable the caching plugin for us to take a look?

Yea I did and I also tried disabling it but didn't solve the issue

Hi Justin,

This is what it currently looks like on my end on mobile: https://share.getcloudapp.com/z8ulYney

May I know how you want it to look like?

https://postimg.cc/QHMZWM75
This is what it was before

Can you try adding this CSS?:

@media (max-width: 768px) {
    form.wp-block-search__button-inside.wp-block-search__icon-button.alignright.wp-block-search .wp-block-search__inside-wrapper {
        border-radius: 40px;
    }

    form.wp-block-search__button-inside.wp-block-search__icon-button.alignright.wp-block-search .wp-block-search__inside-wrapper input#wp-block-search__input-1 {
        border-radius: 30px;
        padding-top: 0;
        padding-bottom: 0;
    }

    form.wp-block-search__button-inside.wp-block-search__icon-button.alignright.wp-block-search {
        border: none;
        background-color: transparent;
    }

    button.wp-block-search__button.has-icon.wp-element-button {
        background-color: transparent;
        color: #888888;
        padding: 4px 0 4px 0;
    }
}

It didn't change anything

You have a syntax error somewhere in your custom CSS. Copy and paste all CSS code you have here http://csslint.net/ and correct the error first.

I tested that by removing all custom css and just adding your css but that did noting also

I can see it working from my end. Can you try clearing your browser's cache? If that doesn't work, try a different device/browser.

That wasn't the case for me but I instead just undid everything and after much research got it to look almost the way it was before except for one thing the height is much larger and when I try to change the height with CSS the search icon lowers what is a good fix for this?

That's odd. It must have been a caching issue.

Try adding this:

form.wp-block-search .wp-block-search__inside-wrapper :is(input#wp-block-search__input-1, button.wp-block-search__button) {
    padding-top: 5px;
    padding-bottom: 5px
}

Replace the values to adhere to your preference.

Thank you that worked

You're welcome, Justin!