diff --git a/src/Meta.tsx b/src/Meta.tsx index 8245847..77c8363 100644 --- a/src/Meta.tsx +++ b/src/Meta.tsx @@ -70,7 +70,7 @@ Meta.defaultProps = { subject: '포케허브: 포켓몬 커뮤니티, 도감, 카드제작 및 토론', copyright: 'PokeHub_Team', keywords: - '포켓몬, 포켓몬 도감, 포켓몬 카드, 포켓몬 게임, 포켓몬 커뮤니티, 포켓몬 공략, 포켓몬 이벤트, 포켓몬 최신 뉴스, 포켓몬 교환, 포켓몬 카드 제작', + '포케허브, pokehub, 포켓몬, 포켓몬 도감, 포켓몬 카드, 포켓몬 게임, 포켓몬 커뮤니티, 포켓몬 공략, 포켓몬 이벤트, 포켓몬 최신 뉴스, 포켓몬 교환, 포켓몬 카드 제작', url: window.location.href, image: 'https://github.com/side-project-pokehub/my-pokemon/assets/115094069/20de534c-814b-441d-8b74-6cfc9347c66c', diff --git a/src/components/detail/Detail.module.scss b/src/components/detail/Detail.module.scss index 3f5297e..353ea29 100644 --- a/src/components/detail/Detail.module.scss +++ b/src/components/detail/Detail.module.scss @@ -96,7 +96,7 @@ flex-direction: column; justify-content: space-around; transition: 0.3s; - transform: rotateY(30deg); + transform: rotateY(15deg); border-radius: 0px 4px 4px 0px; border: 3px solid #000; background: #fff; @@ -182,24 +182,21 @@ span { color: #ff5050; - font-size: 14px; font-style: normal; font-weight: 600; line-height: normal; } - &:disabled { - border: 2px solid #999; - } - - &:disabled, - &:disabled span { + .disabledText { color: #999; - cursor: not-allowed; } } +.disabledButton { + border: 2px solid #999; +} + .stats__like__animate.animateHeart { animation: moveUpAndRotate 1s ease-in-out; } @@ -225,7 +222,7 @@ background: #fff; padding: 20px; transition: 0.3s; - transform: rotateY(-30deg); + transform: rotateY(-15deg); display: flex; flex-direction: column; justify-content: space-around; @@ -595,7 +592,6 @@ height: 226px; flex-shrink: 0; border-radius: 15px; - border: 2px solid #000; background: #fff; display: flex; justify-content: center; diff --git a/src/components/detail/LikePokemon.tsx b/src/components/detail/LikePokemon.tsx index 365ca7c..c976ace 100644 --- a/src/components/detail/LikePokemon.tsx +++ b/src/components/detail/LikePokemon.tsx @@ -34,7 +34,9 @@ const LikePokemon = ({ pokemonId, isLoading }: LikePokemonProps) => { }; const onToggleLike = async () => { - if (!user?.uid) return; + if (!user?.uid) { + return alert('로그인이 필요합니다.'); + } setAnimate(true); try { const docSnap = await getDocument(`/likes/${user.uid}`); @@ -76,9 +78,11 @@ const LikePokemon = ({ pokemonId, isLoading }: LikePokemonProps) => { }`} > ); diff --git a/src/components/dex/PokemonDex.module.scss b/src/components/dex/PokemonDex.module.scss index 3bb1554..f650d77 100644 --- a/src/components/dex/PokemonDex.module.scss +++ b/src/components/dex/PokemonDex.module.scss @@ -65,3 +65,7 @@ } } } + +.highlighted { + border: 2px solid rgb(250, 19, 2); +} diff --git a/src/components/dex/PokemonDexElementLayout.tsx b/src/components/dex/PokemonDexElementLayout.tsx index bbf253a..568f90c 100644 --- a/src/components/dex/PokemonDexElementLayout.tsx +++ b/src/components/dex/PokemonDexElementLayout.tsx @@ -2,6 +2,7 @@ import { ReactNode } from 'react'; import styles from './PokemonDex.module.scss'; import { PokemonType } from '@/lib/type'; import { motion } from 'framer-motion'; +import { useParams } from 'react-router-dom'; interface PokemonDexElementLayoutProp { children: ReactNode; @@ -16,15 +17,24 @@ const PokemonDexElementLayout = ({ onClick, className, }: PokemonDexElementLayoutProp) => { + const { id } = useParams(); + const number = () => { if (data.id < 10) { - return '00' + data.id + return '00' + data.id; } else if (data.id < 100) { - return '0' + data.id + return '0' + data.id; } else { - return data.id + return data.id; } - } + }; + + const getHighlightClass = () => { + return data.id.toString() === id ? styles.highlighted : ''; + }; + + console.log(data.id.toString() === id); + return (
diff --git a/src/components/users/SocialLogin.tsx b/src/components/users/SocialLogin.tsx index 974c26a..2319fc4 100644 --- a/src/components/users/SocialLogin.tsx +++ b/src/components/users/SocialLogin.tsx @@ -81,7 +81,6 @@ const SocialLogin = ({ isOpen, setIsOpen }: SocialLoginProps) => { await signOut(auth); setUser(null); console.log('로그아웃'); - navigate('/'); } catch (error) { console.error('로그아웃 중 오류 발생:', error); }