common map
name | structure | class |
---|---|---|
1. Text Button1 |
Learn more
Learn more Show more Show more
참고
.btn--invert : 까만글씨 |
.btn.btn--round .btn.btn--round.white .btn.btn--round.btn--invert .btn.btn--round.btn--invert.btn--plus |
2. Text Button2 |
Learn more
Learn more View all results View all results View all results
참고
.white : 흰 글씨 |
.btn.btn--arrow .btn.btn--arrow.white .btn.btn--arrow.btn--bg .btn.btn--bg .btn.btn--ghost |
3. Text-Line Button | .btn.btn--round.btn--line | |
4. Icon Button |
참고 .btn.btn--zoom : tablet/mobile 에서만 사용 |
.btn.btn--zoom .btn.btn--zoom.out .icon-question |
5. Video Button |
참고
정지표시가 기본 상태 |
.btn.btn--play .btn.btn--play.is-play |
6. Paging Box |
참고
페이지 이동버튼 비활성화시 클래스명 'disabled' 추가 |
.paging-box |
name | structure | class |
---|---|---|
1. Select Box |
참고
흰 배경이 기본 |
.select-wrap |
2. Select Box + Search |
|
.select-search-box |
3. Slider Prev/Next Button |
참고
Swiper 기본 클래스 사용시 스타일 적용됨 |
.swiper-button-next .swiper-button-prev |
3. RADIO/CHECKBOX |
|
.radio-box .checkbox .checkbox.input-block |
4. Tab - Link Type |
참고
링크 이동인 경우에 사용 |
.tab-link-box |
5. Tab - Block Type |
참고
탭 전환인 경우에 사용 |
.tab-block-box |
6. Popup |
참고
.popup_wrapper로 반드시 감싸줘야 함 |
.tab-block-box |