Skip to content

Commit

Permalink
fix: existing lint issues (#337)
Browse files Browse the repository at this point in the history
* fix: existing lint issues

* fix: speaker profile image size
  • Loading branch information
kavania2002 authored Jun 19, 2024
1 parent c5703fc commit f9f8673
Show file tree
Hide file tree
Showing 8 changed files with 47 additions and 50 deletions.
5 changes: 3 additions & 2 deletions components/Agenda/agenda.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import React from 'react'
import Heading from '../Typography/heading'
import Paragraph from '../Typography/paragraph'
import Image from 'next/image'

function Agenda({ city }) {
return (
Expand Down Expand Up @@ -39,7 +40,7 @@ function Agenda({ city }) {
</div>
{talk.speaker && typeof talk.speaker === 'number' ? <div className='flex items-center lg:mt-4'>
<div className='w-[94px] h-[94px]'>
<img src={city.speakers[talk.speaker - 1].img} alt={city.speakers[talk.speaker -1].name} className='object-cover rounded-full w-full h-full'/>
<Image src={city.speakers[talk.speaker - 1].img} alt={city.speakers[talk.speaker -1].name} className='object-cover rounded-full' height={'100%'} width={'100%'} />
</div>
<div className='ml-4 w-[300px] sm:w-[250px]'>
<Heading typeStyle='heading-sm-semibold' className='text-white'>
Expand All @@ -54,7 +55,7 @@ function Agenda({ city }) {
{talk.speaker.map((speak, i) => <div key={i} className='mt-6'>
<div className='flex items-center lg:mt-4'>
<div className='w-[94px] h-[94px]'>
<img src={city.speakers[speak - 1].img} alt={city.speakers[speak - 1].name} className='object-cover rounded-full w-full h-full' />
<Image src={city.speakers[speak - 1].img} alt={city.speakers[speak - 1].name} className='object-cover rounded-full' height={'100%'} width={'100%'} />
</div>
<div className='ml-4 w-[300px] sm:w-[250px]'>
<Heading typeStyle='heading-sm-semibold' className='text-white'>
Expand Down
9 changes: 3 additions & 6 deletions components/Footer/footer.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import React from "react";
import Image from 'next/image';

function Footer() {
const socials = [
Expand All @@ -21,7 +22,7 @@ function Footer() {
return (
<div className="container">
<div className="w-full flex justify-between items-center p-4 sm:flex-col sm:gap-3">
<img src="/img/logo.png" alt="company logo" className="w-[150px]" />
<Image src="/img/logo.png" alt="company logo" width={150} height={42} />
<div className="sm:hidden">
{/* This div helps keep the text centered */}
</div>
Expand Down Expand Up @@ -49,11 +50,7 @@ function Footer() {
rel="noreferrer"
className="w-12 h-12 rounded-lg border-[1.5px] border-[#556061] flex items-center justify-center hover:border-[#AD20E2] duration-150 ease-in-out"
>
<img
src={social.imgUrl}
alt={social.name}
className="w-8 h-8"
/>
<Image src={social.imgUrl} alt={social.name} height={32} width={32} />
</a>
);
})}
Expand Down
2 changes: 1 addition & 1 deletion components/Form/Cfp/stepThree.js
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ function StepThree({ setStep, setForm, data }) {
const [value, setValue] = useState({});
useEffect(() => {
setForm({ ...data, ...value});
}, [value]);
}, [data, setForm, value]);
return (
<form className="mt-3 w-[30rem] lg:w-[auto]" onSubmit={(e) => setStep(e, 4)}>
<h1 className="text-white font-bold text-4xl lg:text-3xl">
Expand Down
2 changes: 1 addition & 1 deletion components/Form/select.js
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ function Dropdown({ options, title, setValue, multi }) {
} else {
setValue(selectedOption.value);
}
}, [selectedOption]);
}, [multi, selectedOption, setValue]);
return (
<div className="relative inline-block w-full">
<Select
Expand Down
67 changes: 34 additions & 33 deletions components/Navbar/navbar.js
Original file line number Diff line number Diff line change
@@ -1,11 +1,12 @@
import Link from 'next/link';
import Dropdown from '../illustration/dropdown';
import { useState,useEffect,useRef} from 'react';
import { useState, useEffect, useRef, useCallback } from 'react';
import links from '../../config/links.json';
import NavDrop from './navDrop';
import Hamburger from '../illustration/hamburger';
import { useMediaQuery } from 'react-responsive';
import Cancel from '../illustration/cancel';
import Image from 'next/image';



Expand All @@ -15,47 +16,47 @@ function Navbar() {
const [show, setShow] = useState(null);
const menuRef = useRef(null);
const svg = useRef(null);
function handleClosing(event) {
const handleClosing = useCallback((event) => {
if (show && !event.target.closest('.subMenu')) {
setShow(false);
}
}
}, [show]);
useEffect(() => {
document.addEventListener('mousedown', handleClosing);
return () => {
document.removeEventListener('mousedown', handleClosing);
};
}, [show]);
document.removeEventListener('mousedown', handleClosing);
};
}, [handleClosing, show]);

const handleCloseMenu = (event) => {
if (menuRef .current && !menuRef .current.contains(event.target)) {
if (menuRef.current && !menuRef.current.contains(event.target)) {
setDrop(false);
}if(svg.current&&event.target==svg.current){
} if (svg.current && event.target == svg.current) {
setDrop(true);
}
}
};

useEffect(() => {
document.addEventListener('click', handleCloseMenu);
return () => {
document.removeEventListener('click', handleCloseMenu);
};
document.addEventListener('click', handleCloseMenu);
return () => {
document.removeEventListener('click', handleCloseMenu);
};
}, [menuRef]);

const handleVenueHover = () => {
setShow('Venue');
};
const handleSubMenuLeave = () => {
setShow(null);
};
setShow('Venue');
};
const handleSubMenuLeave = () => {
setShow(null);
};
return (
<div className='flex justify-center items-center sticky top-0 z-[99] text-white'>
<div className='w-[1131px]'>
<div className='p-5 flex justify-between h-[75px] w-full items-center'>
<div className='flex items-center sm:justify-between sm:w-full'>
<Link href='/'>
<div className='flex items-center cursor-pointer w-[120px]'>
<img src='/img/logo.png' alt='conference logo' />
<div className='flex items-center cursor-pointer'>
<Image src='/img/logo.png' alt='conference logo' width={120} height={33} />
</div>
</Link>
</div>
Expand All @@ -67,7 +68,7 @@ function Navbar() {
</button>
) : (
<button>
<Hamburger ref={svg}/>
<Hamburger ref={svg} />
</button>
)}
</div>
Expand All @@ -76,21 +77,21 @@ function Navbar() {
{links.map((link) => (
<div href={link.ref} key={link.title}>
<div
onMouseEnter={() => setShow(link.title === 'Venue' ? 'Venue' : null)}
onClick={() => setShow(link.title === 'Venue' ? null : link.title)}
onMouseEnter={() => setShow(link.title === 'Venue' ? 'Venue' : null)}
onClick={() => setShow(link.title === 'Venue' ? null : link.title)}
className='ml-16 text-[14px] group cursor-pointer relative flex flex-col'
>
<div>
{link.subMenu ? (
<div
onMouseEnter={handleVenueHover}
className='flex items-center '>
<div
onMouseEnter={handleVenueHover}
className='flex items-center '>
{link.title}{' '}
{link.subMenu && (
<Dropdown
color="white"
className={`ml-2 transition-transform duration-700 ${show === link.title ? 'rotate-180' : 'rotate-0'
}`}
color="white"
className={`ml-2 transition-transform duration-700 ${show === link.title ? 'rotate-180' : 'rotate-0'
}`}
/>
)}
</div>
Expand All @@ -100,8 +101,8 @@ function Navbar() {
</div>
{show && show === link.title && link.subMenu && (
<div
onMouseLeave={handleSubMenuLeave}
className='subMenu absolute z-[9] mt-8 w-[140px] rounded-md left-[-15px] gradient-bg pl-2 pt-1 flex flex-col justify-center space-y-0'>
onMouseLeave={handleSubMenuLeave}
className='subMenu absolute z-[9] mt-8 w-[140px] rounded-md left-[-15px] gradient-bg pl-2 pt-1 flex flex-col justify-center space-y-0'>
{link.subMenu.map((subL) => (
<Link href={subL.ref} key={subL.title}>
<div className='h-[32px] text-[16px] hover:scale-95 hover:translate-x-1 transition-all'>
Expand All @@ -116,7 +117,7 @@ function Navbar() {
))}
</div>
)}
{isTablet && drop && <NavDrop setDrop={setDrop} ref={menuRef} />}
{isTablet && drop && <NavDrop setDrop={setDrop} ref={menuRef} />}
</div>
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion components/Select/select.js
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ function Dropdown({ options, title, setValue, multi }) {
} else {
setValue(selectedOption.value);
}
}, [selectedOption]);
}, [multi, selectedOption, setValue]);
return (
<div className="relative inline-block w-full">
<Select
Expand Down
7 changes: 2 additions & 5 deletions components/Speaker/speaker.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import Image from 'next/image';
import React from 'react'

function Speaker({details, location, className}) {
Expand All @@ -6,11 +7,7 @@ function Speaker({details, location, className}) {
className={`w-auto text-center flex flex-col items-center card h-auto rounded-md p-[27px] ${className}`}
>
<div className='w-[300px] h-[300px] lg:w-[250px] lg:h-[250px]'>
<img
src={details.img}
alt={details.name}
className='rounded-full w-full h-full object-cover'
/>
<Image src={details.img} alt={details.name} width={0} height={0} sizes='100vw' className='rounded-full object-cover' />
</div>
<div className='mt-[19px]'>
<h3 className='text-[23px] text-white'>{details.name}</h3>
Expand Down
3 changes: 2 additions & 1 deletion components/Venue/venue.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
/* eslint-disable react/no-unescaped-entities */
import React from 'react';
import Link from 'next/link';
import Image from 'next/image';

function Venue({ className, city }) {
return (
Expand All @@ -14,7 +15,7 @@ function Venue({ className, city }) {
e.preventDefault()
window.open(city.map, '_blank', 'noopener')
}} className='w-8 h-8 bg-white rounded-xl flex items-center justify-center ml-auto'>
<img src='/img/mapIcon.svg' className='w-6' />
<Image src='/img/mapIcon.svg' alt='Map Icon' width={24} height={24} />
</button>
</div>
<div></div>
Expand Down

0 comments on commit f9f8673

Please sign in to comment.