🔀 merge: Merge branch 'm1-tan' of https://github.com/KieIO/grocery-vercel-commerce into m1-tan

:%s

src/components/common/ItemWishList/ItemWishList.module.scss

@@ -1,12 +1,8 @@
-@import '../../../styles/utilities';
 
 .heartToggle{
     cursor: pointer;
     width: 2.4rem;
     height: 2.4rem;
-    path{
-        stroke: var(--primary);
-    }
 }
 .isToggleOn{
     svg path{

src/components/common/ItemWishList/ItemWishList.tsx

@@ -8,7 +8,7 @@ interface Props {
     onChange?: () => void
 }
 
-const ItemWishList = memo(({isActive, onChange}:Props) => {
+const ItemWishList = memo(({isActive=false, onChange}:Props) => {
     return(
         <div className={classNames({
             [s.heartToggle]: true, 

src/components/common/Logo/Logo.module.scss

@@ -10,7 +10,7 @@
         margin-right: 1.2rem;
     }
     .content{
-        @apply font-logo sub-headline;
+        @apply font-logo;
         font-size: var(--font-size);
     }
 }

src/components/common/SelectCommon/SelectCommon.module.scss

@@ -0,0 +1,32 @@
+@import "../../../styles/utilities";
+
+.select{
+    @apply rounded-lg border-solid;
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    align-items: center;
+    padding: 1.2rem 1.6rem;
+    &.base{
+        width: 18.6rem;
+        height: 4.8rem;
+    }
+    &.large{
+        width: 34.25rem;
+        height: 5.6rem;
+    }
+    &.default{
+        @apply border;
+    }
+    &.custom{
+        @apply border-2;
+        border-color: var(--border-line);
+        color: var(--text-label);
+    }
+    .option{
+        &:hover{
+            background-color: black;
+        }
+    }
+}
+

src/components/common/SelectCommon/SelectCommon.tsx

@@ -0,0 +1,27 @@
+import s from './SelectCommon.module.scss'
+import classNames from 'classnames'
+
+interface Props {
+    placeHolder? : string,
+    size?: 'base' | 'large',
+    type?: 'default' | 'custom',
+    option: {name: string}[],
+}
+
+const SelectCommon = ({ type = 'default', size = 'base', option, placeHolder }: Props) => {
+    return(
+        <select className={classNames({
+            [s.select] : true,
+            [s[type]]: !!type,
+            [s[size]]: !!size,
+        })}
+        >
+            <option disabled selected hidden>{placeHolder}</option>
+            {
+                option.map(item => <option className={s.option} value={item.name}> {item.name} </option>)
+            }
+        </select>
+    )
+}
+
+export default SelectCommon

src/components/common/ViewAllItem/ViewAllItem.module.scss

@@ -1,18 +1,16 @@
-@import '../../../styles/utilities';
+@import "../../../styles/utilities";
 
-.viewAll{
+.viewAll {
     display: flex;
-    color: var(--primary);
+    .content {
-    .conTent{
+        color: var(--primary);
         margin: 0.8rem 0.8rem 0.8rem 1.6rem;
         font-weight: bold;
     }
-    .vector{
+    .vector {
         margin: 0.8rem 0rem 0.8rem 0rem;
-        svg path{
+        svg path {
             fill: var(--primary);
         }
     }
 }
-
-

src/components/common/ViewAllItem/ViewAllItem.tsx

@@ -10,7 +10,7 @@ const ViewAllItem = ({ link }: Props) => {
     return(
         <div className={s.viewAll}>
             <Link href={link}>
-                <a className={s.conTent}>
+                <a className={s.content}>
                     View All
                 </a>
             </Link>

src/components/common/index.ts

@@ -19,3 +19,4 @@ export { default as Footer} from './Footer/Footer'
 export { default as MenuDropdown} from './MenuDropdown/MenuDropdown'
 export { default as NotiMessage} from './NotiMessage/NotiMessage'
 export { default as VideoPlayer} from './VideoPlayer/VideoPlayer'
+export { default as SelectCommon} from './SelectCommon/SelectCommon'

src/components/icons/index.ts

@@ -1,4 +1,5 @@
 export { default as IconBuy } from './IconBuy'
+<<<<<<< HEAD
 export { default as ArrowUp } from './IconArrowUp'
 export { default as IconSearch } from './IconSearch'
 export { default as IconArrowRight } from './IconArrowRight'
@@ -8,3 +9,7 @@ export { default as IconInfo } from './IconInfo'
 export { default as IconHome } from './IconHome'
 export { default as IconShopping } from './IconShopping'
 export { default as IconHeart } from './IconHeart'
+=======
+export { default as IconHeart } from './IconHeart'
+export { default as IconVector } from './IconVector'
+>>>>>>> 7d55bbf46e49a375575303f16ec393462c6c573d