refactor(responsive): Adjust breakpoint from md to lg for better layout
The previous `md` breakpoint (768px) caused the desktop layout to activate too early, resulting in a cramped appearance on tablet-sized screens. This commit updates the responsive design by changing the primary breakpoint from `md` to `lg` (1024px) across the home page, contact page, and main layouts. This change ensures a more appropriate and visually balanced layout is maintained on medium-sized devices, improving the overall user experience.
This commit is contained in:
@@ -2,7 +2,7 @@ import ContactUs from "../_contact-us/page";
|
||||
|
||||
const FooterForm = () => {
|
||||
return (
|
||||
<div className="absolute w-full -top-[420px] md:-top-72 z-10">
|
||||
<div className="absolute w-full -top-[420px] lg:-top-72 z-10">
|
||||
<ContactUs />
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -5,7 +5,7 @@ import { usePathname } from "next/navigation";
|
||||
export default function HeaderButtons() {
|
||||
const pathname = usePathname();
|
||||
return (
|
||||
<div className="flex justify-between items-center gap-5 mt-4 md:mt-0">
|
||||
<div className="flex justify-between items-center gap-5 mt-4 lg:mt-0">
|
||||
<Link
|
||||
href={pathname.includes("contact-us") ? "/" : "/contact-us"}
|
||||
className="text-(--primary)">
|
||||
|
||||
Reference in New Issue
Block a user