VehicleManager component support

Hello everybody.

Please I need your support.
I created a searchbar with vehiclemanager searchbar.
I have a problem:
when I resize browser windows I wish that my searchbar is positioned as shown in the image, but I don't how could I do this.



I tried to modify the default.php code as follow:

<table>
<tr>
<td><input style="border-radius: 30px 0px 0px 30px; width:100%; margin: 0 auto; justify-content: center; " type="text" name="searchtext" size="300" maxlength="300" placeholder="<?php echo _VEHICLE_MANAGER_SEARCH_DESC1; ?>"/></td>
<td><input style="border-radius: 0px 0px 0px 0px; margin: 0 auto; justify-content: center;" type="text" id="vm_search_date_from_mod" name="search_date_from1" placeholder="<?php echo _VEHICLE_MANAGER_LABEL_AVAILABLE_FOR_RENT_FROM; ?>"></td>
<td><input style="border-radius: 0px 0px 0px 0px; margin: 0 auto; justify-content: center;" type="text" id="vm_search_date_until_mod" name="search_date_until1" placeholder="<?php echo _VEHICLE_MANAGER_LABEL_AVAILABLE_FOR_RENT_UNTIL; ?>"></td>
<td>
<input type="submit" value="<?php echo _VEHICLE_MANAGER_LABEL_SEARCH_BUTTON; ?>" class="button"></input>
</td>

But it doesn't work.
Could you help me [file] please? Thank you so much.

Hallo guys,
I post An update of my status.


I founded the instruction min-width and max-width that help me in a part of what a want to do, but I still have some difficulties to set a different searchbar's layout related to the size of active window.

My searchbar is composed by 4 elements:
1. an input box to find a vehicle
2. an input box to select the From date
3. an input box to select the To date
4. a GO button to start the search


and what I want to do is described below:

if (active windows' width is > min-width=400px) {
I want that all the 4 elements of searchbar are positioned on ONE single row (see tripadvisor searchbar)
}
elseif (active windows' width is < max-width=400px) {
I want that all the 4 elements of searchbar are positioned - one over each other - on ONE single row (see tripadvisor searchbar when you resize the active window)
}

I appreciate all of your help.

Thank you in advance.

Best regards
Michele

Dear Michele

In your CSS file You need create class some like below

for 4 fields per row:

@media ( min-width: 401px) {
.the_4_fields_per_row {
width: 24% !important;
margin: 0px;
display: block;
float: left;
}
}

for 1 field per row:
@media (max-width: 400px ) {
.the_4_fields_per_column {
width: 100% !important;
margin: 0px;
display: block;
float: left;
}
}

and add both these class to your block

Regards
Andrew
OrdaSoft team

Hallo Andrew,

thank you for your answer.

Maybe I am doing something wrong because it doesn't work.

I am editing these two files:

(1) ..components -> com_vehiclemanager -> includes -> vehiclemanager.css
(2) ..modules -> mod_vehicle_manager_search_free -> tmpl-> default.php

In the doc (1) I add your instruction at the bottom of file.
In the doc (2) I add the two class (.the_4_fields_per_row and .the_4_fields_per_column) to the block in this way:
code at line 30 modified from:
<div class="vm_search_inline" style="height: 200px;">
to
<div class="vm_search_inline; .the_4_fields_per_row; .the_4_fields_per_column;" style="height: 200px;">

Of course....it doesn't work.
Am I modifyng the right files?
Am I adding the two classes to the right instruction?

Furthermore, my goal is to create my own override file (called "myfile.css" in the path (1) ) but if I import it with @import myfile.css in the file (2) it doesn't work.

Thank you for your support.
Best regards
Michele

Hello

We at forum may give only advice for code change.

Your changes impossible do with help change one row

We may propose to you order this as "customization service".
Please write to OrdaSoft contact form (ordasoft.com/contact-us-form) with full details description.
How all must look and work. And we will give to you quota

If you would like any further information,
please do not hesitate to contact us.

Best Regards,
Andrew
OrdaSoft team

Thank you so much Andrew