첫 커밋
This commit is contained in:
65
src/entities/payment/ui/credit-card-list-bottom-sheet.tsx
Normal file
65
src/entities/payment/ui/credit-card-list-bottom-sheet.tsx
Normal file
@@ -0,0 +1,65 @@
|
||||
import { IMAGE_ROOT } from '@/shared/constants/common';
|
||||
|
||||
export const CreditCardListBottomSheet = () => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="bg-dim"></div>
|
||||
<div className="bottomsheet">
|
||||
<div className="bottomsheet-header">
|
||||
<div className="bottomsheet-title">
|
||||
<h2>카드사</h2>
|
||||
<button
|
||||
className="close-btn"
|
||||
type="button"
|
||||
>
|
||||
<img
|
||||
src={ IMAGE_ROOT + '/ico_close.svg' }
|
||||
alt="닫기"
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="bottomsheet-content">
|
||||
<div className="card-list">
|
||||
<div className="card-option selected">
|
||||
<span className="name">KB국민</span>
|
||||
<i className="check"></i>
|
||||
</div>
|
||||
<div className="card-option">
|
||||
<span className="name">비씨</span>
|
||||
<i className="check"></i>
|
||||
</div>
|
||||
<div className="card-option">
|
||||
<span className="name">하나(외환)</span>
|
||||
<i className="check"></i>
|
||||
</div>
|
||||
<div className="card-option">
|
||||
<span className="name">삼성</span>
|
||||
<i className="check"></i>
|
||||
</div>
|
||||
<div className="card-option">
|
||||
<span className="name">신한</span>
|
||||
<i className="check"></i>
|
||||
</div>
|
||||
<div className="card-option">
|
||||
<span className="name">현대</span>
|
||||
<i className="check"></i>
|
||||
</div>
|
||||
<div className="card-option">
|
||||
<span className="name">롯데</span>
|
||||
<i className="check"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bottomsheet-footer">
|
||||
<button
|
||||
className="btn-50 btn-blue flex-1"
|
||||
type="button"
|
||||
>확인</button>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
};
|
||||
Reference in New Issue
Block a user