Noah
de3d6e9315
* Vendor fontawesome icons * User settings page: to edit profile details (other features not hooked up yet) * Initial user profile page
292 lines
15 KiB
HTML
292 lines
15 KiB
HTML
{{define "title"}}User Settings{{end}}
|
|
{{define "content"}}
|
|
<div class="container">
|
|
<section class="hero is-info is-bold">
|
|
<div class="hero-body">
|
|
<div class="container">
|
|
<h1 class="title">User Settings</h1>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{{ $User := .CurrentUser }}
|
|
|
|
<div class="block p-4">
|
|
<div class="columns">
|
|
|
|
<div class="column is-hidden-tablet p-4">
|
|
<label class="label">Jump to section:</label>
|
|
<ul class="menu-list">
|
|
<li><a href="#profile">My Profile</a></li>
|
|
<li><a href="#verification">Verification Photo</a></li>
|
|
<li><a href="#prefs">Website Preferences</a></li>
|
|
<li><a href="#account">Account Settings <small class="has-text-grey ml-2">Email & password</small></a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="column">
|
|
<div class="card" id="profile">
|
|
<header class="card-header has-background-link">
|
|
<p class="card-header-title has-text-light">
|
|
<i class="fa fa-user pr-2"></i>
|
|
My Profile
|
|
</p>
|
|
</header>
|
|
|
|
<form method="POST" action="/settings">
|
|
<input type="hidden" name="intent" value="profile">
|
|
{{InputCSRF}}
|
|
|
|
<div class="card-content">
|
|
<p class="block">
|
|
The fields here are shown on your <a href="/u/{{.CurrentUser.Username}}">profile page</a>
|
|
and are all optional. Fields with a <i class="fa fa-lock"></i> icon are not shown on
|
|
your page but may drive some data that is (e.g., your current age derived from your birthdate).
|
|
</p>
|
|
|
|
<div class="columns">
|
|
<div class="column field is-half">
|
|
<label class="label" for="display_name">Display Name</label>
|
|
<input type="text" class="input"
|
|
id="display_name"
|
|
name="display_name"
|
|
placeholder="John Doe"
|
|
value="{{$User.Name}}">
|
|
</div>
|
|
|
|
<div class="column field is-half">
|
|
<label class="label" for="dob">Birthdate <i class="fa fa-lock"></i></label>
|
|
<input type="date" class="input"
|
|
id="dob"
|
|
name="dob"
|
|
value="{{if not $User.Birthdate.IsZero}}{{$User.Birthdate.Format "2006-01-02"}}{{end}}">
|
|
<p class="help">
|
|
Used to show your age on your profile.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="columns">
|
|
<div class="column field is-half">
|
|
<label class="label" for="gender">Gender</label>
|
|
<div class="select is-fullwidth">
|
|
<select id="gender" name="gender">
|
|
<option value="">No answer</option>
|
|
{{range .Enum.Gender}}
|
|
<option value="{{.}}"{{if eq ($User.GetProfileField "gender") .}} selected{{end}}>{{.}}</option>
|
|
{{end}}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="column field is-half">
|
|
<label class="label" for="pronouns">Pronouns</label>
|
|
<input type="text" class="input"
|
|
id="pronouns"
|
|
name="pronouns"
|
|
maxlength="30"
|
|
value="{{$User.GetProfileField "pronouns"}}">
|
|
<p class="help">e.g. he/him; she/her</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="columns">
|
|
<div class="column field is-half">
|
|
<label class="label" for="city">City/Location</label>
|
|
<input type="text" class="input"
|
|
id="city"
|
|
name="city"
|
|
value="{{$User.GetProfileField "city"}}">
|
|
</div>
|
|
|
|
|
|
<div class="column field is-half">
|
|
<label class="label" for="job">Job/Occupation</label>
|
|
<input type="text" class="input"
|
|
id="job"
|
|
name="job"
|
|
value="{{$User.GetProfileField "job"}}">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="columns">
|
|
<div class="column field is-half">
|
|
<label class="label" for="marital_status">Marital Status</label>
|
|
<div class="select is-fullwidth">
|
|
<select id="marital_status" name="marital_status">
|
|
<option value="">No answer</option>
|
|
{{range .Enum.MaritalStatus}}
|
|
<option value="{{.}}"{{if eq ($User.GetProfileField "marital_status") .}} selected{{end}}>{{.}}</option>
|
|
{{end}}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="column field is-half">
|
|
<label class="label" for="relationship_type">Relationship Type</label>
|
|
<div class="select is-fullwidth">
|
|
<select id="relationship_type" name="relationship_type">
|
|
<option value="">No answer</option>
|
|
{{range .Enum.RelationshipType}}
|
|
<option value="{{.}}"{{if eq ($User.GetProfileField "relationship_type") .}} selected{{end}}>{{.}}</option>
|
|
{{end}}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="columns">
|
|
<div class="column field is-half">
|
|
<label class="label" for="orientation">Orientation</label>
|
|
<div class="select is-fullwidth">
|
|
<select id="orientation" name="orientation">
|
|
<option value="">No answer</option>
|
|
{{range .Enum.Orientation}}
|
|
<option value="{{.}}"{{if eq ($User.GetProfileField "orientation") .}} selected{{end}}>{{.}}</option>
|
|
{{end}}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label class="label">Here For</label>
|
|
<div class="columns is-multiline pb-5">
|
|
{{range .Enum.HereFor}}
|
|
<div class="column is-one-third pb-0">
|
|
<label class="checkbox">
|
|
<input type="checkbox"
|
|
name="here_for"
|
|
value="{{.}}"
|
|
{{if $User.ProfileFieldIn "here_for" .}}checked{{end}}>
|
|
{{.}}
|
|
</label>
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label class="label" for="about_me">About Me</label>
|
|
<textarea class="textarea" cols="60" rows="4"
|
|
id="about_me"
|
|
name="about_me"
|
|
placeholder="A little blurb about myself">{{$User.GetProfileField "about_me"}}</textarea>
|
|
<p class="help">
|
|
Write a bit about yourself. Markdown formatting is supported here.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label class="label" for="interests">My Interests</label>
|
|
<textarea class="textarea" cols="60" rows="4"
|
|
id="interests"
|
|
name="interests"
|
|
placeholder="What kinds of things make you curious?">{{$User.GetProfileField "interests"}}</textarea>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label class="label" for="music_movies">Music/Bands/Movies</label>
|
|
<textarea class="textarea" cols="60" rows="4"
|
|
id="music_movies"
|
|
name="music_movies"
|
|
placeholder="What is your style of music or movie?">{{$User.GetProfileField "music_movies"}}</textarea>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<button type="submit" class="button is-primary">
|
|
Save Profile Settings
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="column">
|
|
<div class="card block" id="verification">
|
|
<header class="card-header has-background-info">
|
|
<p class="card-header-title has-text-light">
|
|
<i class="fa fa-camera pr-2"></i>
|
|
Verification Photo
|
|
</p>
|
|
</header>
|
|
|
|
<div class="card-content">
|
|
xxx
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card block" id="prefs">
|
|
<header class="card-header has-background-success">
|
|
<p class="card-header-title">
|
|
<i class="fa fa-square-check pr-2"></i>
|
|
Website Preferences
|
|
</p>
|
|
</header>
|
|
|
|
<div class="card-content">
|
|
<div class="field">
|
|
<label class="label">Explicit Content Filter</label>
|
|
<label class="checkbox">
|
|
<input type="checkbox"
|
|
value="true">
|
|
Show explicit content
|
|
</label>
|
|
<p class="help">
|
|
Check this box if you are OK seeing explicit content on this site, which may
|
|
include erections or sexually charged content.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<form method="POST" action="/settings">
|
|
<input type="hidden" name="intent" value="settings">
|
|
{{InputCSRF}}
|
|
|
|
<div class="card block" id="account">
|
|
<header class="card-header has-background-danger">
|
|
<p class="card-header-title has-text-light">
|
|
<i class="fa fa-gear pr-2"></i>
|
|
Account Settings
|
|
</p>
|
|
</header>
|
|
|
|
|
|
<div class="card-content">
|
|
<div class="field">
|
|
<label class="label" for="change_email">Change Email</label>
|
|
<input type="email" class="input"
|
|
id="change_email"
|
|
name="change_email"
|
|
placeholder="name@domain.com">
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label class="label">Change Password</label>
|
|
<input type="password" class="input mb-2"
|
|
name="old_password"
|
|
placeholder="Current password">
|
|
<input type="password" class="input mb-2"
|
|
name="new_password"
|
|
placeholder="New password">
|
|
<input type="password" class="input mb-2"
|
|
name="new_password2"
|
|
placeholder="Confirm new password">
|
|
</div>
|
|
|
|
<div class="field">
|
|
<button type="submit" class="button is-primary">
|
|
Save Account Settings
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{end}} |