Almost updated

This commit is contained in:
mukesh13
2025-08-13 22:37:58 +05:30
parent 5867410a7e
commit 852c11725b
3 changed files with 89 additions and 210 deletions

View File

@ -104,7 +104,7 @@ export default function Footer3() {
</Link> </Link>
<div className="footer-info mb_51"> <div className="footer-info mb_51">
<a href="#" className="link text-body-2" style={{ color: 'white' }}> <a href="#" className="link text-body-2" style={{ color: 'white' }}>
themesflat@gmail.com koushik@keystonesolution.in
</a> </a>
<div className="text-body-2" style={{ color: 'white' }}> <div className="text-body-2" style={{ color: 'white' }}>
No. 3A, 1st Floor, Balaji Nagar,<br /> No. 3A, 1st Floor, Balaji Nagar,<br />
@ -252,7 +252,7 @@ export default function Footer3() {
<p className="text-body-2 m-0" style={{ color: 'white' }}> <p className="text-body-2 m-0" style={{ color: 'white' }}>
© {new Date().getFullYear()} Copyright by{" "} © {new Date().getFullYear()} Copyright by{" "}
<a href="#" className="link-black text-body-3" style={{ color: 'white', fontWeight: '600' }}> <a href="#" className="link-black text-body-3" style={{ color: 'white', fontWeight: '600' }}>
Keystone Keystone Solutions
</a>{" "} </a>{" "}
. All Rights Reserved. . All Rights Reserved.
</p> </p>

View File

@ -21,31 +21,14 @@ export default function Header4() {
{ id: 13, title: "Data Processing", href: "/service-details/13" }, { id: 13, title: "Data Processing", href: "/service-details/13" },
{ id: 14, title: "Receipt Data Entry Services", href: "/service-details/14" }, { id: 14, title: "Receipt Data Entry Services", href: "/service-details/14" },
{ id: 15, title: "Logistics Data Entry Services", href: "/service-details/15" }, { id: 15, title: "Logistics Data Entry Services", href: "/service-details/15" },
{ id: 16, title: "Construction", href: "/service-details/16" } { id: 16, title: "Construction", href: "/#" }
]; ];
const renderServiceLink = (service) => { const renderServiceLink = (service) => {
// Disable Construction service (id: 16) same as in Services component // Disable Construction service (id: 16) same as in Services component
const isDisabled = service.id === 16;
if (isDisabled) {
return (
<span
style={{
display: 'block',
padding: '8px 16px',
color: '#999999',
fontSize: '14px',
fontWeight: '500',
borderLeft: '3px solid transparent',
cursor: 'not-allowed',
opacity: '0.5'
}}
>
{service.title}
</span>
);
}
return ( return (
<Link <Link

View File

@ -1,12 +1,4 @@
"use client"; "use client";
import {
blogPages,
homepages,
otherPages,
servicePages,
shopPages,
} from "@/data/menu";
import Image from "next/image";
import Link from "next/link"; import Link from "next/link";
import { usePathname } from "next/navigation"; import { usePathname } from "next/navigation";
import React from "react"; import React from "react";
@ -14,18 +6,50 @@ import React from "react";
export default function Mobilemenu() { export default function Mobilemenu() {
const pathname = usePathname(); const pathname = usePathname();
const isActive = (link) => link.split("/")[1] == pathname.split("/")[1]; const isActive = (link) => link.split("/")[1] == pathname.split("/")[1];
const isActiveParent = (links) => links.some((link) => isActive(link.href));
// Service items matching Header4 component
const serviceItems = [
{ id: 11, title: "Data Entry Services", href: "/service-details/11" },
{ id: 12, title: "Data Conversion", href: "/service-details/12" },
{ id: 13, title: "Data Processing", href: "/service-details/13" },
{ id: 14, title: "Receipt Data Entry Services", href: "/service-details/14" },
{ id: 15, title: "Logistics Data Entry Services", href: "/service-details/15" },
{ id: 16, title: "Construction", href: "/#" }
];
const isServiceActive = () => {
return serviceItems.some(service => pathname.includes(service.href));
};
return ( return (
<div className="offcanvas offcanvas-start canvas-mb" id="menu-mobile"> <div className="offcanvas offcanvas-start canvas-mb" id="menu-mobile">
<div className="offcanvas-header top-nav-mobile justify-content-between"> <div className="offcanvas-header top-nav-mobile justify-content-between">
<Link href={`/`} className="logo"> <Link href={`/`} className="logo">
<Image {/* Updated logo to match Header4 SVG logo */}
alt="logo" <svg
src="/images/logo/footer-logo.png" width="140"
width={390} height={35}
height={80} viewBox="0 0 150 40"
fill="none"
xmlns="http://www.w3.org/2000/svg"
style={{ display: 'block' }}
>
<path
d="M18.2183 15.7033L29.395 34.7289C29.4936 34.8967 29.6741 34.9994 29.8687 34.9985L41.1397 34.9463C41.3308 34.9455 41.5075 34.8448 41.6058 34.6809L47.5 24.8527L35.944 24.8365C35.7518 24.8362 35.5738 24.7349 35.4754 24.5698L23.9713 5.2667C23.8727 5.10131 23.6944 5 23.5019 5L12.3005 5C12.1083 5 11.9302 5.10099 11.8315 5.26594L5.91087 15.1639L0.167756 24.7208C0.0644005 24.8928 0.0636223 25.1076 0.165723 25.2804L5.75222 34.7316C5.85055 34.8979 6.02941 35 6.22264 35L16.7708 35C17.1948 35 17.4573 34.538 17.2402 34.1738L5.91087 15.1639L17.276 15.1639C17.6635 15.1639 18.022 15.3691 18.2183 15.7033Z"
fill="#28285B"
/> />
<text
x="55"
y="20"
fontFamily="Arial, sans-serif"
fontSize="20"
fontWeight="600"
fill="#121416"
dominantBaseline="central"
>
Keystone
</text>
</svg>
</Link> </Link>
<div className="close-menu" data-bs-dismiss="offcanvas"> <div className="close-menu" data-bs-dismiss="offcanvas">
<i className="icon-times-solid" /> <i className="icon-times-solid" />
@ -35,83 +59,8 @@ export default function Mobilemenu() {
<div className="mb-body"> <div className="mb-body">
<div className="mb-content-top"> <div className="mb-content-top">
<ul className="nav-ul-mb" id="wrapper-menu-navigation"> <ul className="nav-ul-mb" id="wrapper-menu-navigation">
<li {/* Services Menu Item with Dropdown */}
className={`nav-mb-item ${ <li className={`nav-mb-item ${isServiceActive() ? "active" : ""}`}>
isActiveParent(homepages) ? "active" : ""
}`}
>
<a
href="#dropdown-menu-home"
className="collapsed mb-menu-link"
data-bs-toggle="collapse"
aria-expanded="true"
aria-controls="dropdown-menu-home"
>
<span>Home</span>
<span className="btn-open-sub" />
</a>
<div
id="dropdown-menu-home"
className="collapse"
data-bs-parent="#menu-mobile"
>
<ul className="sub-nav-menu">
{homepages.map((item, index) => (
<li key={index}>
<Link
href={item.href}
className={`sub-nav-link ${
isActive(item.href) ? "active" : ""
}`}
>
{item.title}
</Link>
</li>
))}
</ul>
</div>
</li>
<li
className={`nav-mb-item ${
isActiveParent(otherPages) ? "active" : ""
}`}
>
<a
href="#dropdown-menu-pages"
className="collapsed mb-menu-link"
data-bs-toggle="collapse"
aria-expanded="true"
aria-controls="dropdown-menu-pages"
>
<span>Pages</span>
<span className="btn-open-sub" />
</a>
<div
id="dropdown-menu-pages"
className="collapse"
data-bs-parent="#menu-mobile"
>
<ul className="sub-nav-menu">
{otherPages.map((item) => (
<li key={item.href}>
<Link
href={item.href}
className={`sub-nav-link ${
isActive(item.href) ? "active" : ""
}`}
>
{item.label}
</Link>
</li>
))}
</ul>
</div>
</li>
<li
className={`nav-mb-item ${
isActiveParent(servicePages) ? "active" : ""
}`}
>
<a <a
href="#dropdown-menu-services" href="#dropdown-menu-services"
className="collapsed mb-menu-link" className="collapsed mb-menu-link"
@ -119,7 +68,7 @@ export default function Mobilemenu() {
aria-expanded="true" aria-expanded="true"
aria-controls="dropdown-menu-services" aria-controls="dropdown-menu-services"
> >
<span>Serivce</span> <span>Services</span>
<span className="btn-open-sub" /> <span className="btn-open-sub" />
</a> </a>
<div <div
@ -128,104 +77,51 @@ export default function Mobilemenu() {
data-bs-parent="#menu-mobile" data-bs-parent="#menu-mobile"
> >
<ul className="sub-nav-menu"> <ul className="sub-nav-menu">
{servicePages.map((item) => ( {serviceItems.map((service) => {
<li key={item.href}> // Disable Construction service (id: 16) same as in Header4
return (
<li key={service.id}>
<Link <Link
href={item.href} href={service.href}
className={`sub-nav-link ${ className={`sub-nav-link ${
isActive(item.href) ? "active" : "" isActive(service.href) ? "active" : ""
}`} }`}
> >
{item.label} {service.title}
</Link> </Link>
</li> </li>
))} );
})}
</ul> </ul>
</div> </div>
</li> </li>
<li
className={`nav-mb-item ${ {/* About Menu Item */}
isActiveParent(blogPages) ? "active" : "" <li className={`nav-mb-item ${isActive("/about") ? "active" : ""}`}>
}`} <Link href={`/about`} className="mb-menu-link">
> About
<a
href="#dropdown-menu-blog"
className="collapsed mb-menu-link"
data-bs-toggle="collapse"
aria-expanded="true"
aria-controls="dropdown-menu-blog"
>
<span>Blog</span>
<span className="btn-open-sub" />
</a>
<div
id="dropdown-menu-blog"
className="collapse"
data-bs-parent="#menu-mobile"
>
<ul className="sub-nav-menu">
{blogPages.map((item) => (
<li key={item.href}>
<Link
href={item.href}
className={`sub-nav-link ${
isActive(item.href) ? "active" : ""
}`}
>
{item.label}
</Link> </Link>
</li> </li>
))}
</ul> {/* Career Menu Item */}
</div> <li className={`nav-mb-item ${isActive("/career") ? "active" : ""}`}>
</li> <Link href={`/career`} className="mb-menu-link">
<li Career
className={`nav-mb-item ${
isActiveParent(shopPages) ? "active" : ""
}`}
>
<a
href="#dropdown-menu-shop"
className="collapsed mb-menu-link"
data-bs-toggle="collapse"
aria-expanded="true"
aria-controls="dropdown-menu-shop"
>
<span>Shop</span>
<span className="btn-open-sub" />
</a>
<div
id="dropdown-menu-shop"
className="collapse"
data-bs-parent="#menu-mobile"
>
<ul className="sub-nav-menu">
{shopPages.map((item) => (
<li key={item.href}>
<Link
href={item.href}
className={`sub-nav-link ${
isActive(item.href) ? "active" : ""
}`}
>
{item.label}
</Link> </Link>
</li> </li>
))}
</ul> {/* Contact Menu Item */}
</div> <li className={`nav-mb-item ${isActive("/contact-us") ? "active" : ""}`}>
</li>
<li
className={`nav-mb-item ${
isActive("/contact-us") ? "active" : ""
}`}
>
<Link href={`/contact-us`} className="mb-menu-link"> <Link href={`/contact-us`} className="mb-menu-link">
Contact Contact
</Link> </Link>
</li> </li>
</ul> </ul>
</div> </div>
{/* Updated contact information and buttons */}
<div className="mb-other-content"> <div className="mb-other-content">
<ul className="mb-info mb_20"> <ul className="mb-info mb_20">
<li> <li>
@ -233,10 +129,10 @@ export default function Mobilemenu() {
Address: Address:
<a <a
target="_blank" target="_blank"
href="https://www.google.com/maps?q=16/9,ScotlandUnitedKingdom" href="https://www.google.com/maps?q=No.3A,1stFloor,BalajiNagar,Dharapadavedu,Vellore-632007,TamilNadu,India"
> >
<span className="fw-5 text_mono-gray-5"> <span className="fw-5 text_mono-gray-5">
16/9, Scotland United Kingdom No. 3A, 1st Floor, Balaji Nagar, Dharapadavedu, Vellore - 632007, Tamil Nadu, India
</span> </span>
</a> </a>
</p> </p>
@ -244,9 +140,9 @@ export default function Mobilemenu() {
<li> <li>
<p className="text_mono-gray"> <p className="text_mono-gray">
Email: Email:
<a href="mailto:themesflat@gmail.com"> <a href="mailto:koushik@keystonesolution.in">
<span className="fw-5 text_mono-gray-5"> <span className="fw-5 text_mono-gray-5">
themesflat@gmail.com koushik@keystonesolution.in
</span> </span>
</a> </a>
</p> </p>
@ -254,16 +150,16 @@ export default function Mobilemenu() {
<li> <li>
<p className="text_mono-gray"> <p className="text_mono-gray">
Phone: Phone:
<a href="tel:+11635565389"> <a href="tel:+919095450005">
<span className="fw-5 text_mono-gray-5"> <span className="fw-5 text_mono-gray-5">
+1 16355 65389 +91 90954 50005
</span> </span>
</a> </a>
</p> </p>
</li> </li>
</ul> </ul>
<div className="mb-wrap-btn d-flex gap_12"> <div className="mb-wrap-btn d-flex gap_12">
<Link href={`/pricing`} className="tf-btn"> <Link href={`/about`} className="tf-btn">
<span>Get Started</span> <span>Get Started</span>
<span className="bg-effect" /> <span className="bg-effect" />
</Link> </Link>