Aurora Modules

간편 로그인

로그인 페이지에서 노출되는 간편로그인 모듈입니다.

사용 가능 변수

변수명	타입	기본값	설명
usableProvider	(PAYCO \| NAVER \| KAKAO \| KAKAO_SYNC \| FACEBOOK \| LINE \| APPLE \| GOOGLE)[]	[]	몰 정보 조회 API 응답 결과 중 `openIdJoinConfig > provider`와 동일 (PAYCO: 페이코, NAVER: 네이버, KAKAO: 카카오, KAKAO_SYNC: 카카오 싱크, FACEBOOK: 페이스북, LINE: 라인, APPLE: 애플, GOOGLE: 구글)

커스텀 핸들바 더 알아보기

:query 속성 더 알아보기

<open-id-sign-in>
    <div>
        <div slot="usableProvider">
            {{#if usableProvider}}
            <div class="open-id-sign-in">
                <div>
                    <ul class="open-id-sign-in__list">
                        {{#each usableProvider}}
                        <li class="open-id-sign-in__item type-{{this.provider}}">
                            <button class="btn btn--lg open-id-sign-in__link" shopby-provider="{{this.provider}}" shopby-action="OPEN_ID_CLICK">
                                <span class="ico ico--{{this.provider}}-28"></span>
                                <span>
                                    <strong>{{upperCase this.label}}</strong>
                                    아이디로 로그인
                                </span>
                            </button>
                        </li>
                        {{/each}}
                    </ul>
                </div>
            </div>
            {{/if}}
        </div>
    </div>
</open-id-sign-in>

<open-id-sign-in>
    <div>
        <div slot="usableProvider">
            {{#if usableProvider}}
            <div class="open-id-sign-in">
                <div>
                    <ul class="open-id-sign-in__list">
                        {{#each usableProvider}}
                        <li class="open-id-sign-in__item type-{{this.provider}}">
                            <button class="btn btn--lg open-id-sign-in__link" shopby-provider="{{this.provider}}" shopby-action="OPEN_ID_CLICK">
                                <span class="ico ico--{{this.provider}}-28"></span>
                                <span>
                                    <strong>{{upperCase this.label}}</strong>
                                    아이디로 로그인
                                </span>
                            </button>
                        </li>
                        {{/each}}
                    </ul>
                </div>
            </div>
            {{/if}}
        </div>
    </div>
</open-id-sign-in>

/* 여기에 스타일 코드를 작성해주세요. */