618 lines
43 KiB
PHP
618 lines
43 KiB
PHP
<?php $currentPage = "add-listing" ?>
|
||
<?php include('../components/header-after-login.php') ?>
|
||
|
||
|
||
<div class="main_content">
|
||
<div class="row">
|
||
<div class="col-md-3">
|
||
<?php include('../components/sidebar.php') ?>
|
||
</div>
|
||
<div class="col-md-9">
|
||
<div class="inner_contents">
|
||
<h2 class="main-head">Property Listing</h2>
|
||
|
||
<div class="step-box other_step_box">
|
||
<div class="nav nav-tabs" id="nav-tab" role="tablist">
|
||
<button class="nav-link active" id="nav-step1-tab" data-bs-toggle="tab"
|
||
data-bs-target="#nav-step1" type="button" role="tab" aria-controls="nav-step1"
|
||
aria-selected="true">
|
||
<span class="num">1</span>
|
||
<span class="num_data">Basic details</span>
|
||
</button>
|
||
<button class="nav-link" id="nav-step2-tab" data-bs-toggle="tab" data-bs-target="#nav-step2"
|
||
type="button" role="tab" aria-controls="nav-step2" aria-selected="false">
|
||
<span class="num">2</span>
|
||
<span class="num_data">Location details</span>
|
||
</button>
|
||
<button class="nav-link" id="nav-step3-tab" data-bs-toggle="tab" data-bs-target="#nav-step3"
|
||
type="button" role="tab" aria-controls="nav-step3" aria-selected="false">
|
||
<span class="num">3</span>
|
||
<span class="num_data">Property profile</span>
|
||
</button>
|
||
<button class="nav-link" id="nav-step4-tab" data-bs-toggle="tab" data-bs-target="#nav-step4"
|
||
type="button" role="tab" aria-controls="nav-step4" aria-selected="false">
|
||
<span class="num">4</span>
|
||
<span class="num_data">Videos & Photos</span>
|
||
</button>
|
||
<button class="nav-link" id="nav-step5-tab" data-bs-toggle="tab" data-bs-target="#nav-step5"
|
||
type="button" role="tab" aria-controls="nav-step5" aria-selected="false">
|
||
<span class="num">5</span>
|
||
<span class="num_data">Pricing & others</span>
|
||
</button>
|
||
<button class="nav-link last_child" id="nav-step6-tab" data-bs-toggle="tab"
|
||
data-bs-target="#nav-step6" type="button" role="tab" aria-controls="nav-step6"
|
||
aria-selected="false">
|
||
<span class="num">6</span>
|
||
<span class="num_data">Amenities</span>
|
||
</button>
|
||
</div>
|
||
|
||
<div class="tab-content" id="nav-tabContent">
|
||
<div class="tab-pane fade show active" id="nav-step1" role="tabpanel"
|
||
aria-labelledby="nav-step1-tab" tabindex="0">
|
||
<div class="card-shadow">
|
||
<h3>I’m Looking to </h3>
|
||
<div class="mb-4">
|
||
<button type="button" class="active btn-primary me-3">Sell</button>
|
||
<button type="button" class="btn-primary">Rent</button>
|
||
</div>
|
||
<h3>What kind of property do you have?</h3>
|
||
<div class="mb-4">
|
||
<div class="form-check">
|
||
<input class="form-check-input" type="radio" name="flexRadioDefault"
|
||
id="flexRadioDefault1">
|
||
<label class="form-check-label" for="flexRadioDefault1">
|
||
Residential
|
||
</label>
|
||
</div>
|
||
<div class="form-check">
|
||
<input class="form-check-input" type="radio" name="flexRadioDefault"
|
||
id="flexRadioDefault2" checked>
|
||
<label class="form-check-label" for="flexRadioDefault2">
|
||
Commercial
|
||
</label>
|
||
</div>
|
||
</div>
|
||
<div class="mb-3">
|
||
<button type="button" class="active btn-primary me-3">Flat/Apartment</button>
|
||
<button type="button" class="btn-primary">Independent house / villa</button>
|
||
</div>
|
||
<div class="next-btn">
|
||
<button type="button" class="yellow-btn next-step" id="step1-next">Continue</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="tab-pane fade" id="nav-step2" role="tabpanel" aria-labelledby="nav-step2-tab"
|
||
tabindex="0">
|
||
<div class="card-shadow">
|
||
<h3 class="mb-4">Where is your property located ? </h3>
|
||
<div class="row">
|
||
<div class="mb-3 col-md-6">
|
||
<label class="form-label">City</label>
|
||
<input type="text" class="form-control">
|
||
</div>
|
||
<div class="mb-3 col-md-6">
|
||
<label class="form-label">Locality</label>
|
||
<input type="text" class="form-control">
|
||
</div>
|
||
<div class="mb-3 col-md-6">
|
||
<label class="form-label">Sub locality ( Optional )</label>
|
||
<input type="text" class="form-control">
|
||
</div>
|
||
<div class="mb-3 col-md-6">
|
||
<label class="form-label">Apartment/society</label>
|
||
<input type="text" class="form-control">
|
||
</div>
|
||
<div class="next-btn">
|
||
<button type="button" class="yellow-btn next-step" id="step2-next">Continue</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="tab-pane fade" id="nav-step3" role="tabpanel" aria-labelledby="nav-step3-tab"
|
||
tabindex="0">
|
||
<div class="card-shadow">
|
||
<h3 class="mb-3">Tell us about your property ?</h3>
|
||
<div class="mb-4">
|
||
<h4>Your apartment is a</h4>
|
||
<button type="button" class="active btn-primary me-2">1 BHK</button>
|
||
<button type="button" class="btn-primary me-2">2 BHK</button>
|
||
<button type="button" class="btn-primary me-2">3 BHK</button>
|
||
<button type="button" class="btn-primary">Other</button>
|
||
</div>
|
||
<div class="mb-4">
|
||
<h3>Add room details</h3>
|
||
<div class="row">
|
||
<div class="col-md-6 mb-4">
|
||
<h4>No of bedrooms</h4>
|
||
<button type="button" class="active btn-primary me-2">1</button>
|
||
<button type="button" class="btn-primary me-2">2</button>
|
||
<button type="button" class="btn-primary me-2">3</button>
|
||
<button type="button" class="btn-primary me-2">4</button>
|
||
<button type="button" class="btn-primary me-2">5</button>
|
||
</div>
|
||
<div class="col-md-6 mb-4">
|
||
<h4>No of bedrooms</h4>
|
||
<button type="button" class="active btn-primary me-2">1</button>
|
||
<button type="button" class="btn-primary me-2">2</button>
|
||
<button type="button" class="btn-primary me-2">3</button>
|
||
<button type="button" class="btn-primary me-2">4</button>
|
||
<button type="button" class="btn-primary me-2">5</button>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<h4>Balconies</h4>
|
||
<button type="button" class="active btn-primary me-2">1</button>
|
||
<button type="button" class="btn-primary me-2">2</button>
|
||
<button type="button" class="btn-primary me-2">3</button>
|
||
<button type="button" class="btn-primary me-2">4</button>
|
||
<button type="button" class="btn-primary me-2">5</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="mb-4 col-md-5">
|
||
<h3>Add room details</h3>
|
||
<h4>Atleast one area type is mandatory</h4>
|
||
<select class="form-select form-select-md mb-3" aria-label="Large select example">
|
||
<option selected>Carpet area</option>
|
||
<option value="1">One</option>
|
||
<option value="2">Two</option>
|
||
<option value="3">Three</option>
|
||
</select>
|
||
</div>
|
||
<div class="mb-4">
|
||
<h4>Other rooms</h4>
|
||
<button type="button" class="btn-primary me-2"><i class="bi bi-plus-lg me-1"></i> Pooja
|
||
room</button>
|
||
<button type="button" class="btn-primary me-2"><i class="bi bi-plus-lg me-1"></i> Study
|
||
room</button>
|
||
<button type="button" class="btn-primary me-2"><i class="bi bi-plus-lg me-1"></i>
|
||
Servant room</button>
|
||
<button type="button" class="btn-primary me-2"><i class="bi bi-plus-lg me-1"></i> Store
|
||
room</button>
|
||
</div>
|
||
<div class="mb-4">
|
||
<h4>Reserved parking</h4>
|
||
<button type="button" class="btn-primary me-2">Furnishing</button>
|
||
<button type="button" class="btn-primary me-2">Semi - furnished</button>
|
||
<button type="button" class="btn-primary me-2">Un - furnished</button>
|
||
</div>
|
||
<div class="mb-4">
|
||
<h4>Furnishing</h4>
|
||
<button type="button" class="btn-primary me-2">Furnishing</button>
|
||
<button type="button" class="btn-primary me-2">Semi - furnished</button>
|
||
<button type="button" class="btn-primary me-2">Un - furnished</button>
|
||
</div>
|
||
<div class="mb-4">
|
||
<h4>Reserved parking</h4>
|
||
<div class="d-flex align-items-center mb-3">
|
||
<p class="mb-0 me-3">Covered parking</p>
|
||
<div class="d-flex count-num align-items-center">
|
||
<div class="button" id="decrementBtn"><i class="bi bi-dash-lg"></i></div>
|
||
<div class="counter" id="counter">0</div>
|
||
<div class="button" id="incrementBtn"><i class="bi bi-plus-lg"></i></div>
|
||
</div>
|
||
</div>
|
||
<div class="d-flex align-items-center">
|
||
<p class="mb-0 me-3">Open parking</p>
|
||
<div class="d-flex count-num align-items-center">
|
||
<div class="button" id="decrementBtn"><i class="bi bi-dash-lg"></i></div>
|
||
<div class="counter" id="counter">0</div>
|
||
<div class="button" id="incrementBtn"><i class="bi bi-plus-lg"></i></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="mb-4 col-md-7">
|
||
<h3>Floor details</h3>
|
||
<h4>Total no of floors and your floor details</h4>
|
||
<div class="d-flex">
|
||
<div class="w-50 me-3">
|
||
<input type="password" class="form-control" placeholder="Total floors">
|
||
</div>
|
||
<select class="w-50 form-select form-select-md mb-3"
|
||
aria-label="Large select example">
|
||
<option selected>Property on floors</option>
|
||
<option value="1">One</option>
|
||
<option value="2">Two</option>
|
||
<option value="3">Three</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<div class="mb-4">
|
||
<h3>Availability status</h3>
|
||
<button type="button" class="btn-primary me-2">Ready to move</button>
|
||
<button type="button" class="btn-primary">Under construction</button>
|
||
</div>
|
||
<div class="mb-4">
|
||
<h3>Age of property</h3>
|
||
<button type="button" class="btn-primary me-2">0-1 Years</button>
|
||
<button type="button" class="btn-primary me-2">1-5 Years</button>
|
||
<button type="button" class="btn-primary me-2">5-10 Years</button>
|
||
<button type="button" class="btn-primary">10+ Years</button>
|
||
</div>
|
||
<div class="mb-4">
|
||
<h3>Possesion by</h3>
|
||
<select class="w-50 form-select form-select-md mb-3" aria-label="Large select example">
|
||
<option selected>Expected by</option>
|
||
<option value="1">One</option>
|
||
<option value="2">Two</option>
|
||
<option value="3">Three</option>
|
||
</select>
|
||
</div>
|
||
<!-- <button type="button" class="btn btn-primary prev-step">Previous</button> -->
|
||
<div class="next-btn">
|
||
<button type="button" class="yellow-btn next-step" id="step3-next">Continue</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="tab-pane fade" id="nav-step4" role="tabpanel" aria-labelledby="nav-step4-tab"
|
||
tabindex="0">
|
||
<div class="card-shadow">
|
||
<h3 class="mb-4">Add one video of property</h3>
|
||
<div class="video-upload mb-4">
|
||
<ul class="nav nav-tabs" id="myTab" role="tablist">
|
||
<li class="nav-item w-50" role="presentation">
|
||
<button class="nav-link w-100 active" id="video-tab" data-bs-toggle="tab"
|
||
data-bs-target="#video-tab-pane" type="button" role="tab"
|
||
aria-controls="video-tab-pane" aria-selected="true">Upload video</button>
|
||
</li>
|
||
<li class="nav-item w-50 " role="presentation">
|
||
<button class="nav-link w-100" id="youtube-tab" data-bs-toggle="tab"
|
||
data-bs-target="#youtube-tab-pane" type="button" role="tab"
|
||
aria-controls="youtube-tab-pane" aria-selected="false">Youtube
|
||
video</button>
|
||
</li>
|
||
</ul>
|
||
<div class="tab-content" id="myTabContent">
|
||
<div class="tab-pane fade show active" id="video-tab-pane" role="tabpanel"
|
||
aria-labelledby="video-tab" tabindex="0">
|
||
<div class="image-box">
|
||
<p>Drag or upload your videos here</p>
|
||
<button type="button" class="active btn-primary me-2"
|
||
id="upload-container2">
|
||
Upload
|
||
<input type="file" id="file-input2" accept="video/*">
|
||
</button>
|
||
<div id="preview2"></div>
|
||
</div>
|
||
<div class="image-upload">
|
||
<h3 class="mx-4">Add images of your property</h3>
|
||
<div class="image-box">
|
||
<p>Drag or upload your images here</p>
|
||
<button type="button" class="active btn-primary me-2"
|
||
id="upload-container">
|
||
Upload
|
||
<input type="file" id="file-input" accept="image/*">
|
||
</button>
|
||
<div id="preview"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="tab-pane fade" id="youtube-tab-pane" role="tabpanel"
|
||
aria-labelledby="youtube-tab" tabindex="0">
|
||
<div class="d-flex justify-content-between align-items-center mx-3 mt-3 mb-4">
|
||
<h3 class="mb-0">Enter Url</h3>
|
||
<span><i class="bi bi-trash"></i></span>
|
||
</div>
|
||
<div class="youtube-box">
|
||
<div class="form-check">
|
||
<input class="form-check-input" type="checkbox" value=""
|
||
id="flexCheckDefault">
|
||
<label class="form-check-label" for="flexCheckDefault">
|
||
https://designreset.com/cork-admin/designreset.com/cork-admin/
|
||
</label>
|
||
</div>
|
||
<div class="form-check">
|
||
<input class="form-check-input" type="checkbox" value=""
|
||
id="flexCheckDefault">
|
||
<label class="form-check-label" for="flexCheckDefault">
|
||
https://designreset.com/cork-admin/designreset.com/cork-admin/
|
||
</label>
|
||
</div>
|
||
<div class="form-check">
|
||
<input class="form-check-input" type="checkbox" value=""
|
||
id="flexCheckDefault">
|
||
<label class="form-check-label" for="flexCheckDefault">
|
||
https://designreset.com/cork-admin/designreset.com/cork-admin/
|
||
</label>
|
||
</div>
|
||
<div class="form-check">
|
||
<input class="form-check-input" type="checkbox" value=""
|
||
id="flexCheckDefault">
|
||
<label class="form-check-label" for="flexCheckDefault">
|
||
https://designreset.com/cork-admin/designreset.com/cork-admin/
|
||
</label>
|
||
</div>
|
||
<div class="form-check">
|
||
<input class="form-check-input" type="checkbox" value=""
|
||
id="flexCheckDefault">
|
||
<label class="form-check-label" for="flexCheckDefault">
|
||
https://designreset.com/cork-admin/designreset.com/cork-admin/
|
||
</label>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- <button type="button" class="btn btn-primary prev-step">Previous</button> -->
|
||
<div class="next-btn">
|
||
<button type="button" class="yellow-btn next-step" id="step4-next">Continue without photos</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="tab-pane fade" id="nav-step5" role="tabpanel" aria-labelledby="nav-step5-tab"
|
||
tabindex="0">
|
||
<div class="card-shadow">
|
||
<h3 class="mb-4">Add pricing and details</h3>
|
||
<div class="mb-4">
|
||
<h4>Ownership </h4>
|
||
<button type="button" class="active btn-primary me-2">Freehold</button>
|
||
<button type="button" class="btn-primary me-2">Leasehold</button>
|
||
<button type="button" class="btn-primary me-2">Co-operative society</button>
|
||
<button type="button" class="btn-primary me-2">Power of attorney</button>
|
||
</div>
|
||
<div class="mb-3">
|
||
<h4>Price details </h4>
|
||
<div class="row">
|
||
<div class="mb-3 col-md-6">
|
||
<input type="text" class="form-control">
|
||
</div>
|
||
<div class="mb-3 col-md-6">
|
||
<input type="text" class="form-control">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="mb-4">
|
||
<div class=" mb-3 details-chek">
|
||
<div class="form-check me-5">
|
||
<input class="form-check-input" type="checkbox" value="" id="Price1">
|
||
<label class="form-check-label colour-gray" for="Price1">
|
||
All inclusive price
|
||
</label>
|
||
</div>
|
||
<div class="form-check me-3">
|
||
<input class="form-check-input" type="checkbox" value="" id="Price2">
|
||
<label class="form-check-label colour-gray" for="Price2">
|
||
Tax & Govt charges excluded
|
||
</label>
|
||
</div>
|
||
<div class="form-check me-3">
|
||
<input class="form-check-input" type="checkbox" value="" id="Price3">
|
||
<label class="form-check-label colour-gray" for="Price3">
|
||
Price negotiable
|
||
</label>
|
||
</div>
|
||
</div>
|
||
<p><i class="bi bi-plus-lg me-2"></i> Add more pricing details</p>
|
||
</div>
|
||
<div class="mb-4">
|
||
<h3>Do you charge brokerage ?</h3>
|
||
<div class="d-flex mb-3">
|
||
<div class="form-check me-5">
|
||
<input class="form-check-input" type="radio" name="flexRadioDefault"
|
||
id="flexRadioDefault1">
|
||
<label class="form-check-label" for="flexRadioDefault1">
|
||
Yes
|
||
</label>
|
||
</div>
|
||
<div class="form-check">
|
||
<input class="form-check-input" type="radio" name="flexRadioDefault"
|
||
id="flexRadioDefault2" checked>
|
||
<label class="form-check-label" for="flexRadioDefault2">
|
||
No
|
||
</label>
|
||
</div>
|
||
</div>
|
||
<button type="button" class="active btn-primary me-2">Fixed</button>
|
||
<button type="button" class="btn-primary me-2">Percentage of price</button>
|
||
</div>
|
||
<div class="mb-3 col-md-6">
|
||
<label class="form-label">Enter brokerage here</label>
|
||
<input type="email" class="form-control mb-3">
|
||
<div class="form-check me-3">
|
||
<input class="form-check-input" type="checkbox" value="" id="brokerage">
|
||
<label class="form-check-label colour-gray" for="brokerage">
|
||
Brokerage negotiable
|
||
</label>
|
||
</div>
|
||
</div>
|
||
<div class="mb-3">
|
||
<div>
|
||
<label class="mb-2">What makes your property unique ?</label>
|
||
<textarea class="form-control" id="floatingTextarea2"
|
||
style="height: 140px"></textarea>
|
||
</div>
|
||
</div>
|
||
<!-- <button type="button" class="btn btn-primary prev-step">Previous</button> -->
|
||
<div class="next-btn">
|
||
<button type="button" class="yellow-btn next-step" id="step5-next">Continue</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="tab-pane fade" id="nav-step6" role="tabpanel" aria-labelledby="nav-step6-tab"
|
||
tabindex="0">
|
||
<div class="card-shadow">
|
||
<h3 class="mb-4">Add amenities/unique features </h3>
|
||
<h4>Ownership </h4>
|
||
<div class="mb-4 btns_div">
|
||
<button type="button" class="active btn-primary">Maintenance staff</button>
|
||
<button type="button" class="btn-primary">Water storage</button>
|
||
<button type="button" class="btn-primary">Security/ Fire alarm</button>
|
||
<button type="button" class="btn-primary">Visitor parking</button>
|
||
<button type="button" class="btn-primary">Lifts</button>
|
||
<button type="button" class="btn-primary">Feng shui/vaastu compliant</button>
|
||
<button type="button" class="btn-primary">Park</button>
|
||
<button type="button" class="btn-primary">Intercom facility</button>
|
||
</div>
|
||
<h4>Property features </h4>
|
||
<div class="mb-4 btns_div">
|
||
<button type="button" class="active btn-primary">High ceiling height</button>
|
||
<button type="button" class="btn-primary">False ceiling</button>
|
||
<button type="button" class="btn-primary">Piped-gas</button>
|
||
<button type="button" class="btn-primary">Internet/wifi connectivity</button>
|
||
<button type="button" class="btn-primary">Centrally air conditioned</button>
|
||
<button type="button" class="btn-primary">Water purifier</button>
|
||
<button type="button" class="btn-primary">Recently renovated</button>
|
||
<button type="button" class="btn-primary">Private garden / Terrace</button>
|
||
<button type="button" class="btn-primary">Natural light</button>
|
||
<button type="button" class="btn-primary">Airy rooms</button>
|
||
<button type="button" class="btn-primary">Spacious interior</button>
|
||
</div>
|
||
<h4>Additional features</h4>
|
||
<div class="mb-4 btns_div">
|
||
<button type="button" class="active btn-primary">Separate entry for servants
|
||
room</button>
|
||
<button type="button" class="btn-primary">Waste disposal</button>
|
||
<button type="button" class="btn-primary">No open drainage around</button>
|
||
<button type="button" class="btn-primary">Rain water harvesting</button>
|
||
<button type="button" class="btn-primary">Bank attached property</button>
|
||
<button type="button" class="btn-primary">Low density society</button>
|
||
</div>
|
||
<h4>Water Source</h4>
|
||
<div class="mb-4 btns_div">
|
||
<button type="button" class="active btn-primary">Municipal Corporation</button>
|
||
<button type="button" class="btn-primary">Borewell/Tank</button>
|
||
<button type="button" class="btn-primary">24*7 Water</button>
|
||
</div>
|
||
<h4>Overlooking</h4>
|
||
<div class="mb-4 btns_div">
|
||
<button type="button" class="active btn-primary">Pool</button>
|
||
<button type="button" class="btn-primary">Park/Garden</button>
|
||
<button type="button" class="btn-primary">Club</button>
|
||
<button type="button" class="btn-primary">Main road</button>
|
||
<button type="button" class="btn-primary">Others</button>
|
||
</div>
|
||
<div class="mb-4 overloging-chek">
|
||
<h4 class="mb-2">Overlooking</h4>
|
||
<div class="row p-2">
|
||
<div class="col-md-6 form-check">
|
||
<input class="form-check-input" type="checkbox" value="" id="friendly1">
|
||
<label class="form-check-label colour-gray" for="friendly1">
|
||
In a gated society
|
||
</label>
|
||
</div>
|
||
<div class="col-md-6 form-check">
|
||
<input class="form-check-input" type="checkbox" value="" id="friendly2">
|
||
<label class="form-check-label colour-gray" for="friendly2">
|
||
Corner property
|
||
</label>
|
||
</div>
|
||
<div class="col-md-6 form-check">
|
||
<input class="form-check-input" type="checkbox" value="" id="friendly3">
|
||
<label class="form-check-label colour-gray" for="friendly3">
|
||
Pet friendly
|
||
</label>
|
||
</div>
|
||
<div class="col-md-6 form-check">
|
||
<input class="form-check-input" type="checkbox" value="" id="friendly4">
|
||
<label class="form-check-label colour-gray" for="friendly4">
|
||
Wheelchair friendly
|
||
</label>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<h4>Power backup</h4>
|
||
<div class="mb-4 btns_div">
|
||
<button type="button" class="active btn-primary">North</button>
|
||
<button type="button" class="btn-primary">South</button>
|
||
<button type="button" class="btn-primary">East</button>
|
||
<button type="button" class="active btn-primary">West</button>
|
||
<button type="button" class="btn-primary">North - east</button>
|
||
<button type="button" class="btn-primary">North - west</button>
|
||
<button type="button" class="btn-primary">South - east</button>
|
||
<button type="button" class="btn-primary">South - west</button>
|
||
</div>
|
||
<div class="mb-4 row">
|
||
<div class="col-md-6">
|
||
<select class="form-select" aria-label="Default select example">
|
||
<option selected>Open this select menu</option>
|
||
<option value="1">One</option>
|
||
<option value="2">Two</option>
|
||
<option value="3">Three</option>
|
||
</select>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<select class="form-select" aria-label="Default select example">
|
||
<option selected>Open this select menu</option>
|
||
<option value="1">One</option>
|
||
<option value="2">Two</option>
|
||
<option value="3">Three</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<h4>Location advantages</h4>
|
||
<div class="mb-4 btns_div">
|
||
<button type="button" class="active btn-primary">Close to metro station</button>
|
||
<button type="button" class="btn-primary">Close to school</button>
|
||
<button type="button" class="btn-primary">Close to hospital</button>
|
||
<button type="button" class="active btn-primary">Close to market</button>
|
||
<button type="button" class="btn-primary">Close to railway station</button>
|
||
<button type="button" class="btn-primary">Close to airport</button>
|
||
<button type="button" class="btn-primary">Close to mall</button>
|
||
<button type="button" class="btn-primary">Close to highway</button>
|
||
</div>
|
||
<div class="mb-4">
|
||
<label class="form-label">Add other feature</label>
|
||
<input type="text" class="form-control">
|
||
</div>
|
||
<!-- <button type="button" class="btn btn-primary prev-step">Previous</button> -->
|
||
<div class="next-btn">
|
||
<button type="button" class="yellow-btn next-step">Post property</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<?php include('../components/footer-link.php') ?>
|
||
|
||
<script>
|
||
document.addEventListener('DOMContentLoaded', function() {
|
||
const step1Next = document.getElementById('step1-next');
|
||
const step2Next = document.getElementById('step2-next');
|
||
const step3Next = document.getElementById('step3-next');
|
||
const step4Next = document.getElementById('step4-next');
|
||
const step5Next = document.getElementById('step5-next');
|
||
|
||
step1Next.addEventListener('click', function() {
|
||
const nextTab = new bootstrap.Tab(document.getElementById('nav-step2-tab'));
|
||
nextTab.show();
|
||
});
|
||
|
||
step2Next.addEventListener('click', function() {
|
||
const nextTab = new bootstrap.Tab(document.getElementById('nav-step3-tab'));
|
||
nextTab.show();
|
||
});
|
||
|
||
step3Next.addEventListener('click', function() {
|
||
const nextTab = new bootstrap.Tab(document.getElementById('nav-step4-tab'));
|
||
nextTab.show();
|
||
});
|
||
|
||
step4Next.addEventListener('click', function() {
|
||
const nextTab = new bootstrap.Tab(document.getElementById('nav-step5-tab'));
|
||
nextTab.show();
|
||
});
|
||
|
||
step5Next.addEventListener('click', function() {
|
||
const nextTab = new bootstrap.Tab(document.getElementById('nav-step6-tab'));
|
||
nextTab.show();
|
||
});
|
||
|
||
});
|
||
</script>
|
||
|
||
|
||
<?php include('../components/footer.php') ?>
|