-
Posts
-
I have searched through your forums and found a site that has properly implemented Enfold with Diverse Solutions IDX Plugin. I’d like to know how it was done. I can’t get the search box dropdown and the features filters to look right on Safari, and I had to tweak a lot of css to get it to look decent on Chrome.
Here is the site that has it working properly: http://team-rb.com/idx/?idx-q-ListingAgentID%3C0%3E=32765&idx-q-ListingAgentID%3C1%3E=37833&idx-q-ListingAgentID%3C2%3E=137176&idx-q-ListingAgentID%3C3%3E=159523485&idx-q-ListingStatuses=1
As you can see the search box dropdown at the top displays properly, including the features filters checkboxes, on both Chrome and Safari, based on my testing. I can’t get mine to look like this in Safari.
If you look at my page in Safari, you will see that the search box breaks – its expanded by default and the filters are out of line (see private content). I also included a video in the private content.
Thanks
Hey!
The first website is not using Enfold.
Regarding your site, i believe that disabling the Enfold form styling will do the trick, open css/base.css and remove from line 182-253:
/* #Forms ================================================== */ #top form { margin-bottom: 20px; } #top fieldset { margin-bottom: 20px; } #top .input-text, #top input[type="text"], #top input[type="input"], #top input[type="password"], #top input[type="email"], #top input[type="number"], #top input[type="url"], #top input[type="tel"], #top input[type="search"], #top textarea, #top select { -webkit-appearance: none; border: 1px solid #e1e1e1; padding: 8px 6px; outline: none; font: 13px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #777; margin: 0; width: 210px; max-width: 100%; display: block; margin-bottom: 20px; background: #fff; border-radius: 0px; } #top input[type="text"]:focus, #top input[type="password"]:focus, #top input[type="email"]:focus, #top input[type="number"]:focus, #top input[type="url"]:focus, #top input[type="tel"]:focus, #top input[type="search"]:focus, #top textarea:focus { box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2); color: #555; } #top textarea { min-height: 60px; line-height:1.5em;} #top label{ display: block; font-weight: bold; font-size: 12px; } #top legend { display: block; font-weight: normal; font-size: 15px; } #top select { width: 220px; } #top input[type="checkbox"] { display: inline; } #top label span, #top legend span { font-weight: normal; font-size: 13px; color: #444; } #top textarea{width:100%;} #top #wrap_all .valid .text_input, #top #wrap_all .valid .text_area, #top #wrap_all .valid .select{border:1px solid #9AA600;} /*#70A41B*/ #top #wrap_all .error .text_input, #top #wrap_all .error .text_area, #top #wrap_all .error .select{border:1px solid #DF653E;} #top #wrap_all .ajax_alert .text_input, #top #wrap_all .ajax_alert .text_area, #top #wrap_all .ajax_alert .select{border:1px solid #ffb628;} #top #wrap_all .valid .input_checkbox_label{color:#9AA600;} #top #wrap_all .error .input_checkbox_label{color:#DF653E;}Cheers!
JosueThat worked perfectly. Thank you!
How can this be avoided in the future?I did have to add back into my custom css one style so the form fields look nice:
#top .input-text,
#top input[type=”text”],
#top input[type=”input”],
#top input[type=”password”],
#top input[type=”email”],
#top input[type=”number”],
#top input[type=”url”],
#top input[type=”tel”],
#top input[type=”search”],
#top textarea,
#top select {
border: 1px solid #e1e1e1;
}Hi!
If you are using a Child Theme you can use this code in functions.php to load your modified css/base.css file:
function wp_change_basecss() { if(!is_admin()){ wp_dequeue_style( 'avia-base' ); wp_enqueue_style( 'avia-base-child', get_stylesheet_directory_uri().'/css/base.css', array(), '2', 'all' ); } } add_action( 'wp_enqueue_scripts', 'wp_change_basecss', 100 );Cheers!
Josue
- The topic ‘Enfold + Diverse Solutions IDX Plugin’ is closed to new replies.