CSS: Replace btn-block with buttons wrapped in d-grid

[ipfire.org.git] / src / templates / people / user-edit.html

{% extends "../base.html" %}

{% block title %}{{ account }} - {{ _("Edit") }}{% end block %}

{% block container %}
	<div class="header">
		<div class="container">
			<h1>{{ _("Edit Profile") }}</h1>

			<p class="text-muted">
				{{ account }}
			</p>
		</div>
	</div>

	<div class="container">
		<section>
			<form method="POST" action="" enctype="multipart/form-data">
				{% raw xsrf_form_html() %}

				<div class="row mb-3">
					<div class="col-12 col-sm-6">
						<label class="form-label">{{ _("First Name") }}</label>

						<input type="text" class="form-control" name="first_name"
							placeholder="{{ _("First Name") }}" value="{{ account.first_name }}" required>
					</div>

					<div class="col-12 col-sm-6">
						<label class="form-label">{{ _("Last Name") }}</label>

						<input type="text" class="form-control" name="last_name"
							placeholder="{{ _("Last Name") }}" value="{{ account.last_name }}" required>
					</div>
				</div>

				<div class="mb-3">
					<label class="form-label">{{ _("Nickname") }} ({{ _("optional") }})</label>

					<input type="text" class="form-control" name="nickname"
						placeholder="{{ _("Nickname") }}" value="{{ account.nickname or "" }}">
				</div>

				<div class="mb-3">
					<label class="form-label">{{ _("Address") }}</label>

					<textarea type="text" class="form-control" name="street" rows="3"
						placeholder="{{ _("Address") }}">{{ account.street or "" }}</textarea>
				</div>

				<div class="row mb-3">
					<div class="col-12 col-sm-6">
						<label class="form-label">{{ _("City") }}</label>

						<input type="text" class="form-control" name="city"
							placeholder="{{ _("City") }}" value="{{ account.city }}">
					</div>

					<div class="col-12 col-sm-6">
						<label class="form-label">{{ _("Postal Code") }}</label>

						<input type="text" class="form-control" name="postal_code"
							placeholder="{{ _("Postal Code") }}" value="{{ account.postal_code }}">
					</div>
				</div>

				<div class="mb-3">
					<label class="form-label">{{ _("Country") }}</label>

					<select class="form-control" name="country_code">
						<option value="">{{ _("- Please Select -") }}</option>

						{% for c in countries %}
							<option value="{{ c.alpha2 }}" {% if account.country_code == c.alpha2 %}selected{% end %}>{{ c.name }}</option>
						{% end %}
					</select>
				</div>

				<fieldset>
					<legend>{{ _("Tell Us Who You Are") }}</legend>

					<div class="mb-3" id="description">
						<textarea type="text" class="form-control" name="description" rows="5"
							placeholder="{{ _("Tell Us Who You Are") }}">{{ account.description or "" }}</textarea>

						<small class="form-text text-muted">
							{{ _("You can use Markdown syntax as you know it from the IPFire Wiki") }}
						</small>
					</div>

					<div class="mb-3" id="avatar">
						<label class="form-label">{{ _("Avatar") }}</label>

						<input type="file" class="form-control-file" name="avatar">

						<small class="form-text text-muted">
							{{ _("Upload a new avatar") }}
						</small>
					</div>
				</fieldset>

				{% if account.has_mail() %}
					<fieldset>
						<legend>{{ _("Email") }}</legend>

						<div class="mb-3">
							<label class="form-label">{{ _("Forward Emails") }}</label>

							<input type="mail" class="form-control" name="mail_routing_address"
								placeholder="{{ _("Email Address") }}" value="{{ account.mail_routing_address or "" }}">

							<small class="form-text text-muted">
								{{ _("All emails will be forwarded to this email address") }}
							</small>
						</div>
					</fieldset>
				{% end %}

				<fieldset>
					<legend>{{ _("Telephone") }}</legend>

					<div class="mb-3">
						<label class="form-label">{{ _("Phone Numbers") }}</label>

						<textarea type="text" class="form-control" name="phone_numbers" rows="3"
							placeholder="{{ _("Phone Numbers") }}">{{ "\n".join((format_phone_number_to_e164(n) for n in account.phone_numbers)) }}</textarea>

						<small class="form-text text-muted">
							{{ _("Enter your landline and mobile phone numbers") }}
						</small>
					</div>

					{% if account.has_sip() %}
						<div class="mb-3">
							<label class="form-label">{{ _("Forward Calls") }}</label>

							<input type="text" class="form-control" name="sip_routing_address"
								placeholder="{{ _("SIP URI or Phone Number") }}" value="{{ account.sip_routing_address or "" }}">

							<small class="form-text text-muted">
								{{ _("All calls will be forwarded to this phone number or SIP URI") }}
							</small>
						</div>
					{% end %}
				</fieldset>

				<div class="d-grid">
					<input class="btn btn-primary" type="submit" value="{{ _("Save") }}">
				</div>
			</form>
		</section>
	</div>
{% end block %}