@extends('layouts.site')

@section('content')

<div class="within">
  <div class="bar">新規登録</div>
  <div class="back">
    @if ($err)
    <div class="alert alert-danger" role="alert">
      {{ $err }}
    </div>
    @endif
    <form method="POST" action="/register">
      @csrf
      <div class="row body">
        <div class="col-sm-4"><b>ユーザー名 <span class="badge badge-danger">必須</span></b></div>
        <div class="col"><input name="username" id="username-register" type="text" class="form-control" value="{{ old('username') }}" /></div>
      </div>
      <div class="row body">
        <div class="col-sm-4"><b>パスワード <span class="badge badge-danger">必須</span></b></div>
        <div class="col"><input name="password" id="password-register" type="password" class="form-control" /></div>
      </div>
      <div class="row body">
        <div class="col-sm-4"><b>パスワード確認 <span class="badge badge-danger">必須</span></b></div>
        <div class="col"><input name="password_check" id="confirm-register" type="password" class="form-control" /></div>
      </div>
      <div class="row body">
        <div class="col-sm-4"><b>電子メール <span class="badge badge-danger">必須</span></b></div>
        <div class="col"><input name="email" id="email-register" type="text" class="form-control" value="{{ old('email') }}" /></div>
      </div>
      <div class="row body">
        <div class="col-sm-4"><b>国</b></div>
        <div class="col">
          <select name="country" id="country-register" class="custom-select">
            @foreach ($res as $r)
              <option value="{{$r['value']}}">{{$r['label']}}</option>
            @endforeach
          </select>
        </div>
      </div>
      <div class="row body">
        <div class="col-sm-4"><b>性別</b></div>
        <div class="col">
          <fieldset class="form-group">
            <div tabindex="-1" role="group">
              <div id="gender" role="radiogroup" tabindex="-1" class="btn-group-toggle btn-group" variant="primary">
                <label class="btn btn-forum">
                  <input id="gender0" name="gender" type="radio" name="gender" autocomplete="off" class="" value="0" />
                  <span>不明</span>
                </label>
                <label class="btn btn-primary">
                  <input id="gender1" name="gender" type="radio" name="gender" autocomplete="off" class="" value="1" />
                  <span>男性</span>
                </label>
                <label class="btn btn-pink">
                  <input id="gender2" name="gender" type="radio" name="gender" autocomplete="off" class="" value="2" />
                  <span>女性</span>
                </label>
              </div>
            </div>
          </fieldset>
        </div>
      </div>
      <div class="row body">
        <div class="col-sm-4"></div>
        <div class="col"><input name="submit" type="submit" class="btn btn-success btn-block" value="登録" /></div>
      </div>
    </form>
  </div>
</div>

@endsection
