mirror of https://github.com/zulip/zulip.git
portico: Make backend validation errors similar to frontend.
The backend errors are currently displayed to the right side of the input field. This is different from the frontend validation errors which are displayed at the bottom of the input field (and also looks really bad). Also frontend validation uses <p> instead of <div> to display errors so I have changed this also to make both uniform.
This commit is contained in:
parent
9461f490c8
commit
faf5c0cd2d
|
@ -42,14 +42,13 @@ Form is validated both client-side using jquery-validate (see signup.js) and ser
|
||||||
<input id="id_full_name" class="required" type="text" name="full_name"
|
<input id="id_full_name" class="required" type="text" name="full_name"
|
||||||
value="{% if full_name %}{{ full_name }}{% elif form.full_name.value() %}{{ form.full_name.value() }}{% endif %}"
|
value="{% if full_name %}{{ full_name }}{% elif form.full_name.value() %}{{ form.full_name.value() }}{% endif %}"
|
||||||
maxlength={{ MAX_NAME_LENGTH }} required />
|
maxlength={{ MAX_NAME_LENGTH }} required />
|
||||||
|
<label for="id_full_name" class="inline-block label-title">{{ _('Full name') }}</label>
|
||||||
{% if form.full_name.errors %}
|
{% if form.full_name.errors %}
|
||||||
{% for error in form.full_name.errors %}
|
{% for error in form.full_name.errors %}
|
||||||
<div class="help-inline text-error">{{ error }}</div>
|
<p class="help-inline text-error">{{ error }}</p>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
<label for="id_full_name" class="inline-block label-title">{{ _('Full name') }}</label>
|
|
||||||
<div class="required"></div>
|
|
||||||
<img class="valid" src="/static/images/checkbox-valid.svg" alt="{{ _('Valid') }}" />
|
<img class="valid" src="/static/images/checkbox-valid.svg" alt="{{ _('Valid') }}" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -75,9 +74,9 @@ Form is validated both client-side using jquery-validate (see signup.js) and ser
|
||||||
</span>
|
</span>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if form.password.errors %}
|
{% if form.password.errors %}
|
||||||
{% for error in form.password.errors %}
|
{% for error in form.password.errors %}
|
||||||
<div class="help-inline text-error">{{ error }}</div>
|
<p class="help-inline text-error">{{ error }}</p>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
<div class="progress" id="pw_strength" title="{{ _('Password strength') }}">
|
<div class="progress" id="pw_strength" title="{{ _('Password strength') }}">
|
||||||
|
@ -93,15 +92,15 @@ Form is validated both client-side using jquery-validate (see signup.js) and ser
|
||||||
placeholder="Acme"
|
placeholder="Acme"
|
||||||
value="{% if form.realm_name.value() %}{{ form.realm_name.value() }}{% endif %}"
|
value="{% if form.realm_name.value() %}{{ form.realm_name.value() }}{% endif %}"
|
||||||
name="realm_name" maxlength={{ MAX_REALM_NAME_LENGTH }} required />
|
name="realm_name" maxlength={{ MAX_REALM_NAME_LENGTH }} required />
|
||||||
{% if form.realm_name.errors %}
|
|
||||||
{% for error in form.realm_name.errors %}
|
|
||||||
<div class="help-inline text-error">{{ error }}</div>
|
|
||||||
{% endfor %}
|
|
||||||
{% endif %}
|
|
||||||
<div class="required"></div>
|
<div class="required"></div>
|
||||||
<img class="valid" src="/static/images/checkbox-valid.svg" alt="{{ _('Valid') }}" />
|
<img class="valid" src="/static/images/checkbox-valid.svg" alt="{{ _('Valid') }}" />
|
||||||
</div>
|
</div>
|
||||||
<label for="id_team_name" class="inline-block label-title">{{ _('Organization name') }}</label>
|
<label for="id_team_name" class="inline-block label-title">{{ _('Organization name') }}</label>
|
||||||
|
{% if form.realm_name.errors %}
|
||||||
|
{% for error in form.realm_name.errors %}
|
||||||
|
<p class="help-inline text-error">{{ error }}</p>
|
||||||
|
{% endfor %}
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
<div class="help-box margin-top">
|
<div class="help-box margin-top">
|
||||||
{{ _('This can be changed later on the settings page.') }}
|
{{ _('This can be changed later on the settings page.') }}
|
||||||
|
@ -128,11 +127,11 @@ Form is validated both client-side using jquery-validate (see signup.js) and ser
|
||||||
{% if realms_have_subdomains %}
|
{% if realms_have_subdomains %}
|
||||||
<div class="inline-block external-host"> .{{ external_host }}</div>
|
<div class="inline-block external-host"> .{{ external_host }}</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if form.realm_subdomain.errors %}
|
{% if form.realm_subdomain.errors %}
|
||||||
{% for error in form.realm_subdomain.errors %}
|
{% for error in form.realm_subdomain.errors %}
|
||||||
<div class="help-inline text-error">{{ error }}</div>
|
<p class="help-inline text-error">{{ error }}</p>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
<div class="help-box margin-top">
|
<div class="help-box margin-top">
|
||||||
{% if realms_have_subdomains %}
|
{% if realms_have_subdomains %}
|
||||||
|
|
Loading…
Reference in New Issue