Compact Mode In Responsive

[mverrastroParticipant]

Hi, is there any way to make the search box compact when responsive? I mean the search box change to compact mode when the display is less than 992px

[Ernest MarcinkoKeymaster]

Hi!

Sorry for the delay!

It’s not possible unfortunately. The compact mode is affected by javascript as well, so some custom CSS would not do the trick here.

One thing you can do is to create two search instances (1st as regular, 2nd as compact), and either use a media query and custom CSS to completely hide the first one/display the second one below 992px and vice versa. Something like:

/* Above 992px width */
@media screen and (min-width: 992px) {
  /* Force hide the second search */
  .wpdreams_asp_sc-2, .asp-try-2 {
    display: none !important;
  } 
}
/* Below 992px width */
@media screen and (max-width: 991px) {
  /* Force hide the first search */
  .wpdreams_asp_sc-1, .asp-try-1 {
    display: none !important;
  } 
}

This is the fastest and the best possible method I can think of.

Best,
Ernest Marcinko
If you like my products, don't forget to rate them on codecanyon :)

[mverrastroParticipant]

Thanks for your answer Ernest.

You can close the ticket.

[Ernest MarcinkoKeymaster]

You cannot access this content. Best,
Ernest Marcinko
If you like my products, don't forget to rate them on codecanyon :)

[Author]

Posts