// Menu.js
<li>
<NavLink className="nav-link" to="/ad/create">
Post Ad
</NavLink>
</li>
Horizontally and vertically centered buttons
Show options to either sell or rent
// pages/user/ad/AdCreate.js
import Sidebar from "../../../components/nav/Sidebar";
import { useState } from "react";
import { useNavigate } from "react-router-dom";
export default function AdCreate() {
// state
const [sell, setSell] = useState(false);
const [rent, setRent] = useState(false);
// hooks
const navigate = useNavigate();
const handleSell = () => {
setSell(true);
setRent(false);
};
const handleRent = () => {
setRent(true);
setSell(false);
};
return (
<div className="container-fluid mt-2">
<Sidebar />
<div
className="d-flex justify-content-center align-items-center vh-100"
style={{ marginTop: "-7%" }}
>
<div className="col-lg-6">
<button
onClick={handleSell}
className="btn btn-secondary p-5 col-12 h2"
>
<span className="h2">Sell</span>
</button>
{sell && "show sell house or land options"}
</div>
<div className="col-lg-6">
<button onClick={handleRent} className="btn btn-secondary p-5 col-12">
<span className="h2">Rent</span>
</button>
{rent && "show rent house or land options"}
</div>
</div>
</div>
);
}