언제 쓰는가
공유 세션으로 들어가는 첫 화면. 위성은 자체 회원 원장을 만들지 않고 로그인·가입 폼만 그린 뒤 core 가 준 세션을 받는다. 소셜 연결도 같은 골격이다.
구조
<x-gujo::shell :title="__('auth.login_title')">
<x-slot:nav>@include('partials.nav')</x-slot:nav>
<div class="gj-container gj-section">
<div class="gj-section-head gj-section-head--center">
<h2>{{ __('auth.login_title') }}</h2>
<p>{{ __('auth.login_lead') }}</p>
</div>
<form method="post" action="{{ route('login') }}" class="gj-panel">
@csrf
<x-gujo::field name="email" type="email" :label="__('auth.f_email')" required />
<x-gujo::field name="password" type="password" :label="__('auth.f_password')" required />
<div class="gj-hero-cta">
<x-gujo::btn type="submit">{{ __('auth.submit_login') }}</x-gujo::btn>
<x-gujo::btn :href="route('register')" variant="ghost">{{ __('auth.go_register') }}</x-gujo::btn>
</div>
</form>
<p class="gj-note">{{ __('auth.session_shared') }}</p>
</div>
</x-gujo::shell>
- 폼은
.gj-panel하나. 로그인과 회원가입은 화면을 나누고, 서로ghost링크로만 건너간다. - 필드 두세 개(
email·password, 가입이면 이름 추가)만. 약관 체크는terms패턴으로 보낸다. - 실패는 필드 아래
.gj-err와 shell 의.gj-flash--error. 성공은 원래 가려던 주소로 리다이렉트.
쓰는 .gj-* 클래스와 Blade 컴포넌트
- 컴포넌트:
<x-gujo::shell>,<x-gujo::field>,<x-gujo::btn> - 클래스:
.gj-container,.gj-section,.gj-section-head,.gj-section-head--center,.gj-panel,.gj-hero-cta,.gj-note,.gj-err,.gj-flash--error
하지 말 것
- 위성에
users를 쓰지 않는다. 세션은 공유 쿠키이고 원장은 core 다. - 화면에 이메일 값을 다시 출력하거나 사용자 ID 를 보이지 않는다.
old('email')은 필드 값으로만. - 로그인 카드 옆에 상품·프로모션을 두지 않는다.
- 인라인
style로 폼 너비를 조이지 않는다..gj-panel이 너비를 가진다.
