{{define "content"}}
<div class="container">
    <section class="hero block is-danger is-bold">
        <div class="hero-body">
            <div class="container">
                <h1 class="title">Certification Required</h1>
            </div>
        </div>
    </section>

    <div class="block content p-4 mb-0">
        <h1>Certification Required</h1>
        <p>
            Your profile must be <strong>certified</strong> as being a real person before you
            are allowed to interact with much of this website. Certification helps protect this
            site from spammers, robots, anonymous lurkers and other unsavory characters.
        </p>

        <p>
            To access the Certification Required areas you need to upload a Profile Picture
            that shows your face and submit a "verification selfie" depicting yourself
            holding a hand-written note on paper to prove that you are the person in your
            profile picture.
        </p>

        <h3>Your Certification Checklist</h3>
    </div>

    <ul class="menu-list block">
        <li>
            <a href="/photo/upload?intent=profile_pic">
                {{if .CurrentUser.ProfilePhoto.ID}}
                <span class="icon"><i class="fa fa-circle-check has-text-success"></i></span>
                {{else}}
                <span class="icon"><i class="fa fa-circle has-text-danger"></i></span>
                {{end}}
                <span>
                    Upload a Profile Picture to your account that shows your face
                    {{if not .CurrentUser.ProfilePhoto.ID}}
                    <span class="icon"><i class="fa fa-external-link"></i></span>
                    {{end}}
                </span>
            </a>
        </li>

        <li>
            <a href="/photo/certification">
                {{if .CurrentUser.Certified}}
                <span class="icon"><i class="fa fa-circle-check has-text-success"></i></span>
                {{else}}
                <span class="icon"><i class="fa fa-circle has-text-danger"></i></span>
                {{end}}
                <span>
                    Get certified by uploading a verification selfie
                    {{if not .CurrentUser.Certified}}
                    <span class="icon"><i class="fa fa-external-link"></i></span>
                    {{end}}
                </span>
            </a>
        </li>
    </ul>

    <div class="content p-4">
        <h3>While You Wait</h3>

        <p>
            While waiting for your Certification Photo to be approved, you may
            <a href="/u/{{.CurrentUser.Username}}">view your profile</a>,
            <a href="/settings">edit your profile</a> and
            <a href="/u/{{.CurrentUser.Username}}/photos">upload some additional pictures</a>
            to your profile. Your additional photos will not be visible to other members
            until your profile has been certified.
        </p>
    </div>
</div>
{{end}}