PR#3301: Fix formatting on login, create user and password change pages - pagure

pagure

#3301 Fix formatting on login, create user and password change pages

Merged 5 years ago by pingou. Opened 5 years ago by ryanlerch.

ryanlerch/pagure login-pages into master

Fix formatting on login, create user and password change pages

Ryan Lerch • 5 years ago

262695e

pagure/templates/_formhelper.html

file modified

+7 -2

		`@@ -12,7 +12,7 @@`
		`</div>`
		`{% endmacro %}`

		`- {% macro render_bootstrap_field(field, field_description="", formclass="") %}`
		`+ {% macro render_bootstrap_field(field, field_description="", formclass="", rightlink=None) %}`
		`<fieldset class="form-group {% if field.errors %}has-error{% endif %} {% if formclass %}issue-metadata-form{% endif %}">`
		`{% set formclasses = "form-control"%}`
		`{% if field.errors %} {% set formclasses = formclasses + " form-control-error" %} {% endif %}`
		`@@ -30,7 +30,12 @@`
		`<small class="text-muted">{{ field_description }}</small>`
		`{% endif %}`
		`{% else %}`
		`- <strong>{{ field.label }}</strong>`
		`+ <div>`
		`+ <strong>{{ field.label }}</strong>`
		`+ {% if rightlink %}`
		`+ <div class="float-right"><a href="{{rightlink['url']}}">{{rightlink['text']}}</a>`
		`+ {% endif %}`
		`+ </div>`
		`{{ field(class_=formclasses)\|safe }}`
		`<div>`
		`{% if field_description %}`

pagure/templates/login/login.html

file modified

+14 -27

		`@@ -8,33 +8,20 @@`

		`<div class="container">`
		`<div class="row">`
		`- <div class="col-md-8 col-md-offset-2">`
		`- <div class="card m-t-3">`
		`- <div class="card-header">`
		`- <strong>Login</strong>`
		`- </div>`
		`- <div class="card-block">`
		`- <form action="{{ url_for('ui_ns.do_login') }}" method="post">`
		`- <input type="hidden" value="{{ next_url }}" name="next_url" />`
		`- {{ render_bootstrap_field(form.username) }}`
		`- {{ render_bootstrap_field(form.password) }}`
		`- <input class="btn btn-primary" type="submit" value="Login">`
		`- <input type="button" value="Cancel" class="btn btn-default" onclick="history.back();">`
		`- {{ form.csrf_token }}`
		`- </form>`
		`- </div>`
		`- <div class="card-block">`
		`- <p>`
		`- If you do not have already an account: <a href="{{`
		`- url_for('ui_ns.new_user') }}">`
		`- Create one!</a>`
		`- </p>`
		`- <p>`
		`- <a href="{{ url_for('ui_ns.lost_password') }}">`
		`- Forgot your password?</a>`
		`- </p>`
		`-`
		`- </div>`
		`+ <div class="col-md-4 mx-auto pt-5">`
		`+ <h4 class="text-center font-weight-bold mb-4">Login</h4>`
		`+ <form action="{{ url_for('ui_ns.do_login') }}" method="post">`
		`+ <input type="hidden" value="{{ next_url }}" name="next_url" />`
		`+ {{ render_bootstrap_field(form.username) }}`
		`+ {{ render_bootstrap_field(form.password,`
		`+ rightlink={'url': url_for('ui_ns.lost_password'), 'text': 'Forgot?' }) }}`
		`+ <input class="btn btn-primary btn-block mt-4" type="submit" value="Login">`
		`+ {{ form.csrf_token }}`
		`+ </form>`
		`+ <div>`
		`+ <a class="btn btn-link btn-block" href="{{url_for('ui_ns.new_user') }}">`
		`+ Create a new account`
		`+ </a>`
		`</div>`
		`</div>`
		`</div>`

pagure/templates/login/password_change.html

file modified

+7 -14

		`@@ -8,20 +8,13 @@`

		`<div class="container">`
		`<div class="row">`
		`- <div class="col-md-8 col-md-offset-2">`
		`- <div class="card m-t-3">`
		`- <div class="card-header">`
		`- <strong>Lost password</strong>`
		`- </div>`
		`- <div class="card-block">`
		`- <form action="{{ url_for('ui_ns.lost_password') }}" method="post">`
		`- {{ render_bootstrap_field(form.username) }}`
		`- <input class="btn btn-primary" type="submit" value="Send email">`
		`- <input type="button" value="Cancel" class="btn btn-default" onclick="history.back();">`
		`- {{ form.csrf_token }}`
		`- </form>`
		`- </div>`
		`- </div>`
		`+ <div class="col-md-6 mx-auto pt-5">`
		`+ <h4 class="text-center font-weight-bold mb-4">Reset Password</h4>`
		`+ <form action="{{ url_for('ui_ns.lost_password') }}" method="post">`
		`+ {{ render_bootstrap_field(form.username) }}`
		`+ <input class="btn btn-primary btn-block mt-4" type="submit" value="Send reset email">`
		`+ {{ form.csrf_token }}`
		`+ </form>`
		`</div>`
		`</div>`
		`</div>`

pagure/templates/login/password_recover.html

file modified

+10 -18

		`@@ -8,24 +8,16 @@`

		`<div class="container">`
		`<div class="row">`
		`- <div class="col-md-8 col-md-offset-2">`
		`- <div class="card m-t-3">`
		`- <div class="card-header">`
		`- <strong>Change password</strong>`
		`- </div>`
		`- <div class="card-block">`
		`- <form action="{{ url_for('ui_ns.change_password')}}" method="post">`
		`- {{ render_bootstrap_field(form.old_password) }}`
		`- {{ render_bootstrap_field(form.password) }}`
		`- {{ render_bootstrap_field(form.confirm_password) }}`
		`- {{ form.csrf_token }}`
		`- <input class="btn btn-primary" type="submit" value="Update"`
		`- title="Update description">`
		`- <input type="button" value="Cancel" class="btn btn-default"`
		`- onclick="history.back();">`
		`- </form>`
		`- </div>`
		`- </div>`
		`+ <div class="col-md-6 mx-auto pt-5">`
		`+ <h4 class="text-center font-weight-bold mb-4">Change Password</h4>`
		`+ <form action="{{ url_for('ui_ns.change_password')}}" method="post">`
		`+ {{ render_bootstrap_field(form.old_password) }}`
		`+ {{ render_bootstrap_field(form.password) }}`
		`+ {{ render_bootstrap_field(form.confirm_password) }}`
		`+ {{ form.csrf_token }}`
		`+ <input class="btn btn-primary btn-block mt-4" type="submit" value="Update"`
		`+ title="Update description">`
		`+ </form>`
		`</div>`
		`</div>`
		`</div>`

pagure/templates/login/user_new.html

file modified

+16 -23

		`@@ -7,29 +7,22 @@`
		`{% block content %}`
		`<div class="container">`
		`<div class="row">`
		`- <div class="col-md-8 col-md-offset-2">`
		`- <div class="card m-t-3">`
		`- <div class="card-header">`
		`- <strong>Create new User</strong>`
		`- </div>`
		`- <div class="card-block">`
		`- <form action="{{ url_for('ui_ns.new_user') }}" method="post">`
		`- {{ render_bootstrap_field(`
		`- form.user, field_description="username of the user") }}`
		`- {{ render_bootstrap_field(`
		`- form.fullname, field_description="full name of the user") }}`
		`- {{ render_bootstrap_field(`
		`- form.email_address, field_description="email address of the user") }}`
		`- {{ render_bootstrap_field(`
		`- form.password, field_description="password of the user") }}`
		`- {{ render_bootstrap_field(`
		`- form.confirm_password, field_description="confirm the password") }}`
		`- <input class="btn btn-primary" type="submit" value="Create" title="Update description">`
		`- <input type="button" value="Cancel" class="btn btn-default" onclick="history.back();">`
		`- {{ form.csrf_token }}`
		`- </form>`
		`- </div>`
		`- </div>`
		`+ <div class="col-md-6 mx-auto pt-5">`
		`+ <h4 class="text-center font-weight-bold mb-4">Create new account</h4>`
		`+ <form action="{{ url_for('ui_ns.new_user') }}" method="post">`
		`+ {{ render_bootstrap_field(`
		`+ form.user) }}`
		`+ {{ render_bootstrap_field(`
		`+ form.fullname) }}`
		`+ {{ render_bootstrap_field(`
		`+ form.email_address) }}`
		`+ {{ render_bootstrap_field(`
		`+ form.password) }}`
		`+ {{ render_bootstrap_field(`
		`+ form.confirm_password) }}`
		`+ <input class="btn btn-primary btn-block mt-4" type="submit" value="Create" title="Update description">`
		`+ {{ form.csrf_token }}`
		`+ </form>`
		`</div>`
		`</div>`
		`</div>`

ryanlerch commented 5 years ago

The new UI change left the pages for user management on instances
that dont use external auth looking a bit sad. This fixes up the
formatting of the following pages: