Skip to content
This repository was archived by the owner on Jun 21, 2022. It is now read-only.

styled settings pages #190

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open

styled settings pages #190

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
eee857f
styled account settings
tjfoerster Jun 21, 2022
57225e7
style organization settings
tjfoerster Jun 21, 2022
82267e3
style project settings
tjfoerster Jun 21, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
80 changes: 43 additions & 37 deletions root/templates/settings/account.tt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,11 @@
[% IF confirm_email_change_url %]
<div class="message message-info">
<form method="post" action="[% confirm_email_change_url %]" name="confirm_email_change">
<p>
<div>
You can confirm to change your email address to
<strong>[% user.new_email_fc | html %]</strong>
<input type="submit" value="Confirm email change">
</p>
<input type="submit" value="Confirm email change" class="btn btn-primary">
</div>
</form>
</div>
[% END %]
Expand All @@ -16,80 +16,86 @@

<form method="post" action="[% change_display_name_url %]">
<div class="card">
<div class="card-header"><h3>Change your user’s display name</h3></div>
<div class="card-header"><h3 class="my-2">Change your user’s display name</h3></div>

<div class="card-body">
<p><label>Username:</label> [% user.name %]</p>
<div class="mb-3"><label>Username:</label> [% user.name %]</div>

<p>
<label for="display_name">Display name:</label>
<input type="text" name="display_name" value="[% user.display_name | html %]" id="display_name">
<input type="submit" value="Change display name">
</p>
<div class="row g-3 align-items-center mb-3">
<div class="col-auto">
<label for="display_name" class="col-form-label">Display name:</label>
</div>
<div class="col-auto">
<input type="text" name="display_name" value="[% user.display_name | html %]" id="display_name" class="form-control">
</div>
<div class="col-auto">
<input type="submit" value="Change display name" class="btn btn-primary">
</div>
</div>

<p>
<div>
You can’t change your username that you use for login
and that others use to reference your account,
e.g. to give you permissions on their projects.
</p>
</div>
</div>
</div>
</form>

<div class="card my-4">
<div class="card-header"><h3>Change your password</h3></div>
<div class="card-header"><h3 class="my-2">Change your password</h3></div>

<div class="card-body">
<form method="post" action="[% change_password_url %]">
<div class="mb-2">
<input type="password" name="current_password" placeholder="current password">
</div>
<div class="mb-2">
<input type="password" name="password" placeholder="new password">
</div>
<div class="mb-2">
<input type="password" name="password2" placeholder="new password">
</div>
<input type="submit" value="Change password">
<div class="mb-3" style="max-width: 300px;">
<input type="password" name="current_password" placeholder="current password" class="form-control mb-1">
<input type="password" name="password" placeholder="new password" class="form-control mb-1">
<input type="password" name="password2" placeholder="confirm new password" class="form-control">
</div>
<input type="submit" value="Change password" class="btn btn-primary mb-3">
</form>
<p>
<div>
If you don’t know your current password anymore, you can
<a href="[% recovery_url %]">request a recovery link</a>
to set a new password.
</p>
</div>
</div>
</div>

<div class="card my-4">
<div class="card-header"><h3>Change your email address</h3></div>
<div class="card-header"><h3 class="my-2">Change your email address</h3></div>

<div class="card-body">
<p>
<div class="mb-3">
This is the email address that you get notifications from [% name %] sent to
and that you can use to recover your account in case you lost your password.
The address is never displayed to other users.
</p>
</div>

[% IF user.new_email_fc %]
<form method="post" action="[% cancel_email_change_url %]" name="cancel_email_change">
<p>
<div class="mb-3">
You’ve requested change to <strong>[% user.new_email_fc | html %]</strong>
at [% display_datetime(user.token_created, {short=>1}) %] UTC
<input type="submit" value="Cancel">
</p>
<input type="submit" value="Cancel" class="btn btn-primary">
</div>
</form>
[% END %]

<form method="post" action="[% change_email_url %]">
<p>
<input type="email" value="[% user.email_fc | html %]" name="new_email" required placeholder="new email address">
<input type="submit" value="Change email address">
</p>
<div class="row g-3 align-items-center mb-3">
<div class="col-auto">
<input type="email" value="[% user.email_fc | html %]" name="new_email" required placeholder="new email address" class="form-control">
</div>
<div class="col-auto">
<input type="submit" value="Change email address" class="btn btn-primary">
</div>
</div>
</form>

<p>
<div>
You’ll receive an email to both your current and the new email address
and need to click a link to confirm the change.
</p>
</div>
</div>
</div>
20 changes: 11 additions & 9 deletions root/templates/settings/organizations.tt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
[% link_organization(organization_user.organization, organization_user.organization_url) %] ([% organization_user.role %])
[% IF organization_user.leave_url %]
<form class="inline" method="post" action="[% organization_user.leave_url %]">
<input type="submit" value="Leave organization">
<input type="submit" value="Leave organization" class="btn btn-primary">
</form>
[% END %]
</li>
Expand All @@ -20,19 +20,21 @@
<p>You are not member of any organization yet.</p>
[% END %]

<div class="container-fluid">
<form method="post" action="[% create_organization_url %]">
<div class="card">
<div class="card-header"><h3>Create a new user organization</h3></div>
<div class="card-header"><h3 class="my-2">Create a new user organization</h3></div>

<div class="card-body">
<p>You can pool users in organizations and grant organizations permissions on projects.
You will be member and owner of the new organization.</p>
<div class="mb-3">You can pool users in organizations and grant organizations permissions on projects.
You will be member and owner of the new organization.</div>

<input type="text" name="name" placeholder="organization name" pattern="[A-Za-z0-9_]+" value="[% last_input.name %]">

<input type="submit" name="create" value="Create organization">
<div class="row g-3 align-items-center">
<div class="col-auto">
<input type="text" name="name" placeholder="organization name" pattern="[A-Za-z0-9_]+" value="[% last_input.name %]" class="form-control">
</div>
<div class="col-auto">
<input type="submit" name="create" value="Create organization" class="btn btn-primary">
</div>
</div>
</div>
</form>
</div>
12 changes: 6 additions & 6 deletions root/templates/settings/projects.tt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,14 +3,14 @@
[% IF projects.size > 0 %]
<p>These are all projects that you own or that you have permissions for.</p>

<table>
<table class="table">
<thead>
<tr>
<th title="Archived projects">📁</th>
<th title="Private projects">🔒</th>
<th>Name</th>
<th>Your role</th>
<th>Created</th>
<th title="Archived projects" scope="col">📁</th>
<th title="Private projects" scope="col">🔒</th>
<th scope="col">Name</th>
<th scope="col">Your role</th>
<th scope="col">Created</th>
</tr>
</thead>
<tbody>
Expand Down