I am using Flask-security and I have not been able to integrate Flask-bootstrap in order to customize the user interface of the login, register, and other pages.
The project is hosted here: https://github.com/fbenavides69/control-escolar
I have installed via pip the packages and can render the login, register and other pages, yet for some reason, I can not get them to render user bootstrap. I have followed the recommendations on c/p the security pages under the templates directory in the application, to override the look and feel, yet have not had any success.
Can someone please point me to what I am missing?
Here is the code for the login_user.html:
{% extends "layout.html" %}
{% block body %}
{{super()}}
{% include "navbar.html" %}
{% block content %}
{{super()}}
{% from "security/_macros.html" import render_field_with_errors, render_field %}
{% from "security/_form_macros.html" import render_field %}
<div class="container">
{% include "security/_messages.html" %}
<h1>{{ _('Login') }}</h1>
<form action="{{ url_for_security('login') }}" method="POST" name="login_user_form">
{{ login_user_form.hidden_tag() }}
{{ render_field_with_errors(login_user_form.email) }}
{{ render_field_with_errors(login_user_form.password) }}
{{ render_field_with_errors(login_user_form.remember) }}
{{ render_field(login_user_form.next) }}
{{ render_field(login_user_form.submit) }}
</form>
{% include "security/_menu.html" %}
</div>
{% endblock content %}
{% endblock body %}
Here is the layout.html:
{% extends "bootstrap/base.html" %}
{% block html_attribs %}
lang="sp"
{% endblock %}
{% block metas %}
<meta charset="utf-8">
{% endblock %}
Here is the file structure under which the templates are stored:
application
+-site
+-templates
+-security
+- login_user.html
+- register_user.html
Here the code for the init file:
''' Flask Application Factory
Blueprint Flask application using the factory pattern,
with configuration setup and blueprint module registration
'''
from flask import Flask
from flask_bootstrap import Bootstrap
from flask_security import Security
from flask_security import SQLAlchemyUserDatastore
from flask_debugtoolbar import DebugToolbarExtension
from flask_admin import Admin
from flask_admin.contrib.sqla import ModelView
from .models import db
from .models import User
from .models import Role
from .admin import admin
def create_app():
''' create_app
input:
None
output:
app -- flask web application instance
Read configuration values in the following order:
1) default, values which can be overwritten later
2) intance, for your eyes only not stored in repo values
3) environment, selectable values from:
- development
- stagging
- production
Setup web interface with Bootstrap framework
'''
# Initialize app
app = Flask(__name__, instance_relative_config=True)
# Load default config values
app.config.from_object('config.default')
# Load instance config values not stored in repo
app.config.from_pyfile('config.py')
# Load environment config values
app.config.from_envvar('APP_CONFIG_FILE')
# Create database connection
db.init_app(app)
# Instantiate Admin section
admin.init_app(app)
# Initialize bootstrap
Bootstrap(app)
# Setup Flask-Security
security = Security(app, SQLAlchemyUserDatastore(db, User, Role))
# Debug = True to enable the toolbar
toolbar = DebugToolbarExtension(app)
# Load blueprint modules
from application.site.routes import mod as site
from application.api.routes import mod as api
# Register blueprint modules for use
app.register_blueprint(site)
app.register_blueprint(api, url_prefix='/api')
return app
