mirror of
https://github.com/freedombox/FreedomBox.git
synced 2026-03-11 09:04:54 +00:00
backups: Tweak appearance of add remote location form
- Use bootstrapform templates where possible to reduce code. - Fix incorrect tag for radio button for password authentication. - Drop borders and instead: - Style each group as a section. This includes encryption section and repository path section. - Utilize the simplicity as passwords fields are not displayed. - Retain <label> tag so that clicking on it works and it also easier for accessibility tools. Tests: - The option for password authentication works are expected. The fields for encryption passphrase, ssh password work as before. - Clicking on form labels focuses the form element. - Adding a repository with key and password authentication works with and without encryption. Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
This commit is contained in:
parent
7d3d930137
commit
ff7c3a53a5
@ -30,7 +30,7 @@
|
||||
|
||||
<div class="form-group{% if form.repository.errors %}
|
||||
has-error{% endif %}">
|
||||
<label class="control-label" for="id_repository">
|
||||
<label class="control-label fs-4 fw-medium" for="id_repository">
|
||||
{{ form.repository.label }}
|
||||
</label>
|
||||
<div>
|
||||
@ -46,78 +46,60 @@
|
||||
</div>
|
||||
|
||||
<div class="form-group{% if form.ssh_auth_type.errors %}
|
||||
has-error{% endif %} border border-primary rounded p-3">
|
||||
<h4 class="control-label">{{ form.ssh_auth_type.label }}</h4>
|
||||
has-error{% endif %}">
|
||||
<label class="control-label fs-4 fw-medium">
|
||||
{{ form.ssh_auth_type.label }}
|
||||
</label>
|
||||
<p class="help-block">
|
||||
{{ form.ssh_auth_type.help_text|safe }}
|
||||
</p>
|
||||
{% for error in form.ssh_auth_type.errors %}
|
||||
<span class="help-block {{ form.error_css_class }}">{{ error }}</span>
|
||||
{% endfor %}
|
||||
<fieldset class="form-group border border-secondary rounded p-3">
|
||||
<div class="radio">
|
||||
<label>
|
||||
{{ form.ssh_auth_type.0.tag }}
|
||||
{{ form.ssh_auth_type.0.choice_label }}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p>
|
||||
{% blocktrans trimmed %}
|
||||
{{ box_name }} service has the following SSH client public key:
|
||||
{% endblocktrans %}
|
||||
</p>
|
||||
<pre>{{ ssh_client_public_key }}</pre>
|
||||
<p>
|
||||
{% blocktrans trimmed %}
|
||||
The public key must be added to the authorized keys list on the
|
||||
remote machine.
|
||||
{% endblocktrans %}
|
||||
</p>
|
||||
</div>
|
||||
</fieldset>
|
||||
|
||||
<fieldset class="form-group border border-secondary rounded p-3">
|
||||
<div class="radio">
|
||||
<label>
|
||||
{{ form.ssh_auth_type.0.tag }}
|
||||
{{ form.ssh_auth_type.1.choice_label }}
|
||||
</label>
|
||||
</div>
|
||||
<div class="radio">
|
||||
<label>
|
||||
{{ form.ssh_auth_type.0.tag }}
|
||||
{{ form.ssh_auth_type.0.choice_label }}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p>
|
||||
{% blocktrans trimmed %}
|
||||
{{ box_name }} service will attempt to connect using the provided
|
||||
password. If successful, then the public key will be automatically
|
||||
added to the authorized keys list, so that future connections do
|
||||
not need the password.
|
||||
The following SSH client public key must be added to the
|
||||
authorized keys list on the remote machine for {{ box_name }} to
|
||||
be able to connect to the remote machine:
|
||||
{% endblocktrans %}
|
||||
</p>
|
||||
<pre>{{ ssh_client_public_key }}</pre>
|
||||
</div>
|
||||
|
||||
<div class="form-group{% if form.ssh_password.errors %}
|
||||
has-error{% endif %}">
|
||||
<label class="control-label" for="id_ssh_password">
|
||||
{{ form.ssh_password.label }}
|
||||
</label>
|
||||
<div>
|
||||
<input type="password" name="ssh_password" class="form-control"
|
||||
id="id_ssh_password">
|
||||
{% for error in form.ssh_password.errors %}
|
||||
<span class="help-block {{ form.error_css_class }}">{{ error }}</span>
|
||||
{% endfor %}
|
||||
<p class="help-block">
|
||||
{{ form.ssh_password.help_text|safe }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
<div class="radio">
|
||||
<label>
|
||||
{{ form.ssh_auth_type.1.tag }}
|
||||
{{ form.ssh_auth_type.1.choice_label }}
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<p>
|
||||
{% blocktrans trimmed %}
|
||||
{{ box_name }} service will attempt to connect using the provided
|
||||
password. If successful, then the public key will be automatically
|
||||
added to the authorized keys list, so that future connections do
|
||||
not need the password.
|
||||
{% endblocktrans %}
|
||||
</p>
|
||||
|
||||
{% with _=form.ssh_password|add_input_classes %}
|
||||
{% include "bootstrapform/field.html" with field=form.ssh_password %}
|
||||
{% endwith %}
|
||||
</div>
|
||||
|
||||
<div class="form-group border border-primary rounded p-3">
|
||||
<div class="form-group">
|
||||
<div class="form-group{% if form.encryption.errors %}
|
||||
has-error{% endif %}">
|
||||
<label class="control-label" for="id_encryption">
|
||||
<label class="control-label fs-4 fw-medium" for="id_encryption">
|
||||
{{ form.encryption.label }}
|
||||
</label>
|
||||
<div>
|
||||
@ -134,39 +116,13 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group{% if form.encryption_passphrase.errors %}
|
||||
has-error{% endif %}">
|
||||
<label class="control-label" for="id_encryption_passphrase">
|
||||
{{ form.encryption_passphrase.label }}
|
||||
</label>
|
||||
<div>
|
||||
<input type="password" name="encryption_passphrase"
|
||||
class="form-control" id="id_encryption_passphrase">
|
||||
{% for error in form.encryption_passphrase.errors %}
|
||||
<span class="help-block {{ form.error_css_class }}">{{ error }}</span>
|
||||
{% endfor %}
|
||||
<p class="help-block">
|
||||
{{ form.encryption_passphrase.help_text|safe }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
{% with _=form.encryption_passphrase|add_input_classes %}
|
||||
{% include "bootstrapform/field.html" with field=form.encryption_passphrase %}
|
||||
{% endwith %}
|
||||
|
||||
<div class="form-group{% if form.confirm_encryption_passphrase.errors %}
|
||||
has-error{% endif %}">
|
||||
<label class="control-label" for="id_confirm_encryption_passphrase">
|
||||
{{ form.confirm_encryption_passphrase.label }}
|
||||
</label>
|
||||
<div>
|
||||
<input type="password" name="confirm_encryption_passphrase"
|
||||
class="form-control" id="id_confirm_encryption_passphrase">
|
||||
{% for error in form.confirm_encryption_passphrase.errors %}
|
||||
<span class="help-block {{ form.error_css_class }}">{{ error }}</span>
|
||||
{% endfor %}
|
||||
<p class="help-block">
|
||||
{{ form.confirm_encryption_passphrase.help_text|safe }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
{% with _=form.confirm_encryption_passphrase|add_input_classes %}
|
||||
{% include "bootstrapform/field.html" with field=form.confirm_encryption_passphrase %}
|
||||
{% endwith %}
|
||||
</div>
|
||||
|
||||
<div class="alert alert-warning d-flex align-items-center" role="alert">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user