website/web/templates/errors/certification_required.html
Noah Petherbridge 35258beb36 Helpful copy and image lightbox fix
* On the "Certification Required" error page: show help text under the
  checklist to make it clear that clicking the checklist item will link
  to the profile photo or cert photo upload page.
* Add more helpful text around the site to address common confusion:
  * On the Photo Upload page for profile_pic and the user is already at
    quota: add special text saying they can use an existing gallery
    photo as their profile pic instead.
  * On the self Gallery view page: if the user has no profile pic
    currently set, offer advice and links on how to set one.
* Fix the image max-width on Gallery lightbox modals
2024-03-28 23:02:42 -07:00

80 lines
3.0 KiB
HTML

{{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-xmark has-text-danger"></i></span>
{{end}}
<span>
Upload a Profile Picture to your account that shows your face
<p class="help ml-5 pl-2">
Click here to upload a new profile picture
<i class="fa fa-external-link ml-1"></i>
</p>
</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-xmark has-text-danger"></i></span>
{{end}}
<span>
Get certified by uploading a verification selfie
<p class="help ml-5 pl-2">
Click here to go to the Certification Photo upload page
<i class="fa fa-external-link ml-1"></i>
</p>
</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}}