From 4189ef13dfab344341086587be1167f5a3df1803 Mon Sep 17 00:00:00 2001 From: akash Date: Tue, 12 Aug 2025 23:45:27 -0700 Subject: [PATCH] Nav Bar top scrolling and ressponsive added --- components/home/HeroBanner.tsx | 2 +- components/layout/MobileMenu.tsx | 2 +- components/layout/header/Header1.tsx | 59 ++++++++++++++++++++++--- package-lock.json | 8 ++-- package.json | 2 +- public/assets/css/main.css | 64 +++++++++++++++++++++++++--- 6 files changed, 120 insertions(+), 17 deletions(-) diff --git a/components/home/HeroBanner.tsx b/components/home/HeroBanner.tsx index 625ad6a..32e8987 100644 --- a/components/home/HeroBanner.tsx +++ b/components/home/HeroBanner.tsx @@ -53,7 +53,7 @@ export default function HomeHeroBanner() { modules={[Autoplay, Navigation, Pagination]} slidesPerView={1} loop={true} - autoplay={{ delay: 2000 }} + autoplay={{ delay: 5000 }} navigation pagination={{ clickable: true }} > diff --git a/components/layout/MobileMenu.tsx b/components/layout/MobileMenu.tsx index f1cdb05..8360a6d 100644 --- a/components/layout/MobileMenu.tsx +++ b/components/layout/MobileMenu.tsx @@ -67,7 +67,7 @@ export default function MobileMenu({ isMobileMenu, handleMobileMenu }: any) {
  • handleAccordion(2)}> - Online + Registration
    • Membership - 2024
    • Membership - 2025
      • diff --git a/components/layout/header/Header1.tsx b/components/layout/header/Header1.tsx index 9c82c8f..e798ff7 100644 --- a/components/layout/header/Header1.tsx +++ b/components/layout/header/Header1.tsx @@ -1,10 +1,52 @@ -import Link from 'next/link' +"use client"; +import Link from "next/link"; +import React, { useState } from "react"; +import { Swiper, SwiperSlide } from "swiper/react"; +import { Autoplay, Pagination } from "swiper/modules"; +import "swiper/css"; +import "swiper/css/pagination"; export default function Header1({ scroll, isMobileMenu, handleMobileMenu, isSearch, handleSearch }: any) { + + const [mobileMenu, setMobileMenu] = useState(false); + return ( <>
      + +
      +
      + + +
      + தமிழ்நாடு தொழில்நுட்ப முன்னேற்ற சங்கம் +
      +       + +
      + Welcome to our association — advancing innovation for all communities +
      +       + +
      + Welcome to our association — advancing innovation for all communities +
      +       +       + +
      +
      + +
  • - Online + Registration
    • Membership - 2024
    • Membership - 2025
      • @@ -260,10 +302,17 @@ export default function Header1({ scroll, isMobileMenu, handleMobileMenu, isSear
    • */}
  • - Contact + Contact
    • + + +
    + + Membership + +
    {/*
    @@ -275,12 +324,12 @@ export default function Header1({ scroll, isMobileMenu, handleMobileMenu, isSear
    • -
  • + {/*
  • -
    • + */}
    {/*
    diff --git a/package-lock.json b/package-lock.json index 12eccb3..0d85b35 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21,7 +21,7 @@ "sass": "^1.81.0", "sitemap": "^8.0.0", "slick-carousel": "^1.8.1", - "swiper": "^11.1.14", + "swiper": "^11.2.10", "wowjs": "^1.1.3", "yet-another-react-lightbox": "^3.24.0" }, @@ -5586,9 +5586,9 @@ } }, "node_modules/swiper": { - "version": "11.2.8", - "resolved": "https://registry.npmjs.org/swiper/-/swiper-11.2.8.tgz", - "integrity": "sha512-S5FVf6zWynPWooi7pJ7lZhSUe2snTzqLuUzbd5h5PHUOhzgvW0bLKBd2wv0ixn6/5o9vwc/IkQT74CRcLJQzeg==", + "version": "11.2.10", + "resolved": "https://registry.npmjs.org/swiper/-/swiper-11.2.10.tgz", + "integrity": "sha512-RMeVUUjTQH+6N3ckimK93oxz6Sn5la4aDlgPzB+rBrG/smPdCTicXyhxa+woIpopz+jewEloiEE3lKo1h9w2YQ==", "funding": [ { "type": "patreon", diff --git a/package.json b/package.json index 236ea9f..e059f4c 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,7 @@ "sass": "^1.81.0", "sitemap": "^8.0.0", "slick-carousel": "^1.8.1", - "swiper": "^11.1.14", + "swiper": "^11.2.10", "wowjs": "^1.1.3", "yet-another-react-lightbox": "^3.24.0" }, diff --git a/public/assets/css/main.css b/public/assets/css/main.css index fb1ca72..2057a70 100644 --- a/public/assets/css/main.css +++ b/public/assets/css/main.css @@ -1699,6 +1699,15 @@ Location: transition: all 0.4s; } + +@media (max-width: 1200px) { +.vl-btn9 { + font-size: var(--ztc-font-size-font-s17); + padding: 20px 26px; + +} +} + .vl-btn10 { color: var(--ztc-text-text-2); font-family: var(--grotesk); @@ -9905,17 +9914,36 @@ html { } .homepage1-body .header-area.homepage1 .header-elements .site-logo img { - width: 180px; - height: 80px; + width: 200px; + height: 130px; object-fit: contain; } +@media (max-width: 1440px) { + .homepage1-body .header-area.homepage1 .header-elements .site-logo img { + width: 108px; + height: 110px; + object-fit: contain; + } +} + +@media (max-width: 1200px) { + .homepage1-body .header-area.homepage1 .header-elements .site-logo img { + width: 80px; + height: 100px; + object-fit: contain; + } +} + + @media (max-width: 1024px) { .homepage1-body .header-area.homepage1 .header-elements .site-logo img { - width: 76px; + width: 80px; height: 80px; object-fit: contain; } + + } @@ -10115,7 +10143,7 @@ html { .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li a { font-family: var(--grotesk) !important; - font-size: var(--ztc-font-size-font-s16); + font-size: var(--ztc-font-size-font-s18); font-weight: var(--ztc-weight-medium); color: var(--ztc-text-text-1); display: block; @@ -10123,9 +10151,15 @@ html { padding: 0 20px; } +@media (max-width: 1200px) { + .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li a { + padding: 0 10px; + } +} + @media (max-width: 1024px) { .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li a { - padding: 0 11px; + padding: 0 9px; } } @@ -10309,6 +10343,26 @@ html { transition: all 0.4s; } + +@media (max-width: 1024px) { + .homepage1-body .header-area.homepage1 .header-elements .btn-area ul { + display: none; + } + + .homepage1-body .header-area.homepage1 .header-elements .main-menu ul li a { + + font-size: var(--ztc-font-size-font-s16); +} + +.vl-btn9 { + font-size: var(--ztc-font-size-font-s16); + padding: 17px 26px; + +} + + +} + .homepage2-body, html { overflow-x: hidden !important;