large search box

[AHMED]

hello
i need to put large search box at the primary menu instead of the the search button

[Zex]

Hello, Ahmed!

Insert the next custom CSS codes into Customizing->General->Additional CSS:

@media only screen and (min-width: 992px) {
#vision-search-open-icon{
    display:none!important;
}
#vision-search-box{
   top:15%!important;
    right:120%!important;
    padding: 5px;
    border: 1px solid #eeee22!important;
    opacity: 1!important;
    visibility: visible!important;
    transform: scale(1)!important;
    min-width: 500px!important;
};
}

Change the min-width and border color values per your needs.

Regards

[AHMED]

perfect
thank you

[AHMED]

i am sorry but it did’t appear at mobile mode

[Zex]

Hello Ahmed!

Insert additional, the following CSS codes:

@media only screen and (max-width: 999px) {
.site-header .sticky-header nav,
.sticky-nav{
       display: inline!important;
       float:none!important; 
}
.pull-right .main-menu-item,.pull-right a{
        display:none!important;
   }   
 #vision-search-box{
        position:static;
        height:55px;
        padding: 7px;
        border: 2px solid #eeee22!important;
        opacity: 1!important;
        visibility: visible!important;
        min-width: 300px!important;
        margin-top: 20px;
    }
}

Regards

• This reply was modified 4 years, 5 months ago by Zex.

[Author]

Posts