-
Notifications
You must be signed in to change notification settings - Fork 6
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'develop' into page-search
- Loading branch information
Showing
36 changed files
with
543 additions
and
279 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
File renamed without changes
File renamed without changes
File renamed without changes
File renamed without changes
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
| .product { | ||
| padding: 0 24px; | ||
| } | ||
|
|
||
| .productInfo { | ||
| padding: 16px 24px; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,43 @@ | ||
| import classNames from 'classnames/bind'; | ||
| import Image from 'next/image'; | ||
|
|
||
| import Star from '@components/icons/Star'; | ||
| import Flex from '@shared/flex/Flex'; | ||
| import Header from '@shared/header/Header'; | ||
| import Radio from '@shared/radio/Radio'; | ||
| import Spacing from '@shared/spacing/Spacing'; | ||
| import Text from '@shared/text/Text'; | ||
|
|
||
| import styles from './page.module.scss'; | ||
|
|
||
| const cx = classNames.bind(styles); | ||
|
|
||
| function SuppliesPage() { | ||
| return ( | ||
| <> | ||
| <Header isDisplayLogo={false} displayRightIconType="heartShare" className={cx('product')} /> | ||
| <Image src="/assets/product.png" alt="상품 이미지" width={375} height={375} /> | ||
| <Flex direction="column" className={cx('productInfo')}> | ||
| <Text color="primary" typography="t6">카믹스</Text> | ||
| <Text typography="t4" bold>아머올 세차용품 스피드 왁스 스프레이</Text> | ||
| <Flex align="center"> | ||
| <Text color="tertiary" typography="t6">코팅제</Text> | ||
| <Spacing size={4} direction="vertical" /> | ||
| <Text color="tertiary" typography="t6">•</Text> | ||
| <Spacing size={4} direction="vertical" /> | ||
| <Star size={14} /> | ||
| <Spacing size={4} direction="vertical" /> | ||
| <Text color="tertiary" typography="t6">4.5</Text> | ||
| <Spacing size={4} direction="vertical" /> | ||
| <Text color="tertiary" typography="t6">(20)</Text> | ||
| </Flex> | ||
| </Flex> | ||
| <Flex> | ||
| <Radio type="product" label="제품정보" value="info" name="product" /> | ||
| <Radio type="product" label="리뷰" value="review" name="product" /> | ||
| </Flex> | ||
| </> | ||
| ); | ||
| } | ||
|
|
||
| export default SuppliesPage; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| function Star({ size }: { size: number }) { | ||
| return ( | ||
| <svg width={size} height={size} viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"> | ||
| <path d="M6.61835 0.820337C6.77435 0.504305 7.225 0.504305 7.381 0.820337L9.01274 4.12607C9.13652 4.37683 9.37567 4.55073 9.65238 4.59117L13.3021 5.12464C13.6508 5.1756 13.7898 5.60418 13.5373 5.85005L10.8974 8.42133C10.6968 8.61673 10.6052 8.89835 10.6526 9.17436L11.2755 12.8064C11.3351 13.1538 10.9704 13.4187 10.6585 13.2547L7.39554 11.5387C7.14772 11.4084 6.85163 11.4084 6.60381 11.5387L3.34089 13.2547C3.02892 13.4187 2.66425 13.1538 2.72383 12.8064L3.34677 9.17436C3.39411 8.89835 3.30254 8.61673 3.10193 8.42133L0.46201 5.85005C0.209584 5.60418 0.348549 5.1756 0.697217 5.12464L4.34697 4.59117C4.62368 4.55073 4.86283 4.37683 4.98661 4.12607L6.61835 0.820337Z" fill="#FFD15B" /> | ||
| </svg> | ||
|
|
||
| ); | ||
| } | ||
|
|
||
| export default Star; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,35 +1,37 @@ | ||
| import { useCallback, useMemo, useState } from 'react'; | ||
| import { | ||
| forwardRef, useCallback, useMemo, useState, | ||
| } from 'react'; | ||
|
|
||
| import AccordionContext from '@contexts/AccordionContext'; | ||
| import AccordionContext from '@/contexts/AccordionContext'; | ||
|
|
||
| import AccordionBody from './body'; | ||
| import AccordionHeader from './header'; | ||
| import AccordionItem from './item'; | ||
| import { AccordionProps } from './type/accordion.type'; | ||
|
|
||
| function Accordion({ children }: { children: React.ReactNode | React.ReactNode[] }) { | ||
| const [activeItem, setActiveItem] = useState(''); | ||
| // eslint-disable-next-line max-len | ||
| const Accordion = forwardRef<HTMLDivElement, AccordionProps>(({ defaultActiveItems = [], children, ...props }, ref) => { | ||
| const [activeItems, setActiveItems] = useState<string[]>(defaultActiveItems); | ||
|
|
||
| const changeActiveItem = useCallback((value: string) => { | ||
| if (activeItem !== value) setActiveItem(value); | ||
| if (activeItem === value) setActiveItem(''); | ||
| }, [setActiveItem, activeItem]); | ||
| const handleSetActiveItem = useCallback((item: string) => { | ||
| if (activeItems?.includes(item)) { | ||
| setActiveItems(activeItems.filter((activeItem) => { return activeItem !== item; })); | ||
| } else { | ||
| setActiveItems([...activeItems, item]); | ||
| } | ||
| }, [activeItems]); | ||
|
|
||
| const values = useMemo(() => { | ||
| return { | ||
| activeItem, | ||
| changeSelectedItem: changeActiveItem, | ||
| activeItems, | ||
| setActiveItem: handleSetActiveItem, | ||
| }; | ||
| }, [activeItem, changeActiveItem]); | ||
| }, [activeItems, handleSetActiveItem]); | ||
|
|
||
| return ( | ||
| <AccordionContext.Provider value={values}> | ||
| {children} | ||
| <div ref={ref} {...props}> | ||
| {children} | ||
| </div> | ||
| </AccordionContext.Provider> | ||
| ); | ||
| } | ||
|
|
||
| Accordion.Item = AccordionItem; | ||
| Accordion.Header = AccordionHeader; | ||
| Accordion.Body = AccordionBody; | ||
| }); | ||
|
|
||
| export default Accordion; |
Oops, something went wrong.