Style update for certification checklist

This commit is contained in:
Noah Petherbridge 2024-03-28 23:18:23 -07:00
parent 4f3f6de158
commit d4e3aa755b
2 changed files with 66 additions and 46 deletions

View File

@ -34,33 +34,45 @@
<ul class="menu-list block"> <ul class="menu-list block">
<li> <li>
<a href="/photo/upload?intent=profile_pic"> <a href="/photo/upload?intent=profile_pic">
<div class="columns is-mobile is-gapless">
<div class="column is-narrow mr-2">
{{if .CurrentUser.ProfilePhoto.ID}} {{if .CurrentUser.ProfilePhoto.ID}}
<span class="icon"><i class="fa fa-circle-check has-text-success"></i></span> <span class="icon"><i class="fa fa-circle-check has-text-success"></i></span>
{{else}} {{else}}
<span class="icon"><i class="fa fa-circle has-text-danger"></i></span> <span class="icon"><i class="fa fa-circle-xmark has-text-danger"></i></span>
{{end}} {{end}}
<span> </div>
Add a Profile Picture <div class="column">
{{if not .CurrentUser.ProfilePhoto.ID}} Upload a Profile Picture to your account that shows your face
<span class="icon"><i class="fa fa-external-link"></i></span>
{{end}} <p class="help">
</span> Click here to upload a new profile picture
<i class="fa fa-external-link ml-1"></i>
</p>
</div>
</div>
</a> </a>
</li> </li>
<li> <li>
<a href="/photo/certification"> <a href="/photo/certification">
<div class="columns is-mobile is-gapless">
<div class="column is-narrow mr-2">
{{if .CurrentUser.Certified}} {{if .CurrentUser.Certified}}
<span class="icon"><i class="fa fa-circle-check has-text-success"></i></span> <span class="icon"><i class="fa fa-circle-check has-text-success"></i></span>
{{else}} {{else}}
<span class="icon"><i class="fa fa-circle has-text-danger"></i></span> <span class="icon"><i class="fa fa-circle-xmark has-text-danger"></i></span>
{{end}} {{end}}
<span> </div>
<div class="column">
Get certified by uploading a verification selfie Get certified by uploading a verification selfie
{{if not .CurrentUser.Certified}}
<span class="icon"><i class="fa fa-external-link"></i></span> <p class="help">
{{end}} Click here to go to the Certification Photo upload page
</span> <i class="fa fa-external-link ml-1"></i>
</p>
</div>
</div>
</a> </a>
</li> </li>
</ul> </ul>

View File

@ -29,37 +29,45 @@
<ul class="menu-list block"> <ul class="menu-list block">
<li> <li>
<a href="/photo/upload?intent=profile_pic"> <a href="/photo/upload?intent=profile_pic">
<div class="columns is-mobile is-gapless">
<div class="column is-narrow mr-2">
{{if .CurrentUser.ProfilePhoto.ID}} {{if .CurrentUser.ProfilePhoto.ID}}
<span class="icon"><i class="fa fa-circle-check has-text-success"></i></span> <span class="icon"><i class="fa fa-circle-check has-text-success"></i></span>
{{else}} {{else}}
<span class="icon"><i class="fa fa-circle-xmark has-text-danger"></i></span> <span class="icon"><i class="fa fa-circle-xmark has-text-danger"></i></span>
{{end}} {{end}}
<span> </div>
<div class="column">
Upload a Profile Picture to your account that shows your face Upload a Profile Picture to your account that shows your face
<p class="help ml-5 pl-2"> <p class="help">
Click here to upload a new profile picture Click here to upload a new profile picture
<i class="fa fa-external-link ml-1"></i> <i class="fa fa-external-link ml-1"></i>
</p> </p>
</span> </div>
</div>
</a> </a>
</li> </li>
<li> <li>
<a href="/photo/certification"> <a href="/photo/certification">
<div class="columns is-mobile is-gapless">
<div class="column is-narrow mr-2">
{{if .CurrentUser.Certified}} {{if .CurrentUser.Certified}}
<span class="icon"><i class="fa fa-circle-check has-text-success"></i></span> <span class="icon"><i class="fa fa-circle-check has-text-success"></i></span>
{{else}} {{else}}
<span class="icon"><i class="fa fa-circle-xmark has-text-danger"></i></span> <span class="icon"><i class="fa fa-circle-xmark has-text-danger"></i></span>
{{end}} {{end}}
<span> </div>
<div class="column">
Get certified by uploading a verification selfie Get certified by uploading a verification selfie
<p class="help ml-5 pl-2"> <p class="help">
Click here to go to the Certification Photo upload page Click here to go to the Certification Photo upload page
<i class="fa fa-external-link ml-1"></i> <i class="fa fa-external-link ml-1"></i>
</p> </p>
</span> </div>
</div>
</a> </a>
</li> </li>
</ul> </ul>