Skip to content

F
flask-admin
Unverified Commit 4c443713 authored by Serge S. Koval's avatar Serge S. Koval Committed by GitHub
Browse files
Options

Merge pull request #2012 from michaelbukachi/bootstrap4 

fix: Correct navbar styling issue
parents c5f44b10 012ec957
Hide whitespace changes
Inline Side-by-side
Showing with 62 additions and 57 deletions
examples/bootstrap4/app.py
View file @ 4c443713
...@@ -12,7 +12,7 @@ app = Flask(__name__) ...@@ -12,7 +12,7 @@ app = Flask(__name__)
# Create dummy secrey key so we can use sessions # Create dummy secrey key so we can use sessions
app.config['SECRET_KEY'] = '123456790' app.config['SECRET_KEY'] = '123456790'
app.config['FLASK_ADMIN_SWATCH'] = 'Flatly' app.config['FLASK_ADMIN_SWATCH'] = 'flatly'
# Create in-memory database # Create in-memory database
app.config['DATABASE_FILE'] = 'sample_db.sqlite' app.config['DATABASE_FILE'] = 'sample_db.sqlite'
...@@ -48,6 +48,8 @@ class CustomView(ModelView): ...@@ -48,6 +48,8 @@ class CustomView(ModelView):
class UserAdmin(CustomView): class UserAdmin(CustomView):
column_searchable_list = ('name',) column_searchable_list = ('name',)
column_filters = ('name', 'email') column_filters = ('name', 'email')
can_export = True
export_types = ['csv', 'xlsx']
# Flask views # Flask views
...@@ -62,8 +64,8 @@ def index(): ...@@ -62,8 +64,8 @@ def index():
admin = admin.Admin(app, 'Example: Bootstrap4', template_mode='bootstrap4') admin = admin.Admin(app, 'Example: Bootstrap4', template_mode='bootstrap4')
# Add views # Add views
admin.add_view(UserAdmin(User, db.session)) admin.add_view(UserAdmin(User, db.session, category='Menu'))
admin.add_view(CustomView(Page, db.session)) admin.add_view(CustomView(Page, db.session, category='Menu'))
def build_sample_db(): def build_sample_db():
......
flask_admin/templates/bootstrap4/admin/base.html
View file @ 4c443713
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
<body> <body>
{% block page_body %} {% block page_body %}
<div class="container{% if config.get('FLASK_ADMIN_FLUID_LAYOUT', False) %}-fluid{% endif %}"> <div class="container{% if config.get('FLASK_ADMIN_FLUID_LAYOUT', False) %}-fluid{% endif %}">
<nav class="navbar navbar-expand-lg navbar-dark bg-primary" role="navigation"> <nav class="navbar navbar-expand-lg navbar-dark bg-dark mb-2" role="navigation">
<!-- Brand and toggle get grouped for better mobile display --> <!-- Brand and toggle get grouped for better mobile display -->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#admin-navbar-collapse" <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#admin-navbar-collapse"
aria-controls="admin-navbar-collapse" aria-expanded="false" aria-label="Toggle navigation"> aria-controls="admin-navbar-collapse" aria-expanded="false" aria-label="Toggle navigation">
......
flask_admin/templates/bootstrap4/admin/layout.html
View file @ 4c443713
{% macro menu_icon(item) -%} {% macro menu_icon(item) -%}
{% set icon_type = item.get_icon_type() %} {% set icon_type = item.get_icon_type() %}
{%- if icon_type %} {%- if icon_type %}
{% set icon_value = item.get_icon_value() %} {% set icon_value = item.get_icon_value() %}
{% if icon_type == 'glyph' %} {% if icon_type == 'glyph' %}
<i class="glyphicon {{ icon_value }}"></i> <i class="glyphicon {{ icon_value }}"></i>
{% elif icon_type == 'fa' %} {% elif icon_type == 'fa' %}
<i class="fa {{ icon_value }}"></i> <i class="fa {{ icon_value }}"></i>
{% elif icon_type == 'image' %} {% elif icon_type == 'image' %}
<img src="{{ url_for('static', filename=icon_value) }}" alt="menu image"> <img src="{{ url_for('static', filename=icon_value) }}" alt="menu image">
{% elif icon_type == 'image-url' %} {% elif icon_type == 'image-url' %}
<img src="{{ icon_value }}" alt="menu image"> <img src="{{ icon_value }}" alt="menu image">
{% endif %}
{% endif %} {% endif %}
{% endif %}
{%- endmacro %} {%- endmacro %}
{% macro menu(menu_root=None) %} {% macro menu(menu_root=None) %}
{% if menu_root is none %}{% set menu_root = admin_view.admin.menu() %}{% endif %} {% if menu_root is none %}{% set menu_root = admin_view.admin.menu() %}{% endif %}
...@@ -21,49 +21,52 @@ ...@@ -21,49 +21,52 @@
{%- if children %} {%- if children %}
{% set class_name = item.get_class_name() or '' %} {% set class_name = item.get_class_name() or '' %}
{%- if item.is_active(admin_view) %} {%- if item.is_active(admin_view) %}
<li class="active dropdown{% if class_name %} {{class_name}}{% endif %}"> <li class="active dropdown{% if class_name %} {{ class_name }}{% endif %}">
{% else -%} {% else -%}
<li class="dropdown{% if class_name %} {{class_name}}{% endif %}"> <li class="dropdown{% if class_name %} {{ class_name }}{% endif %}">
{%- endif %} {%- endif %}
<a class="dropdown-toggle nav-link" data-toggle="dropdown" href="javascript:void(0)"> <a class="dropdown-toggle nav-link" data-toggle="dropdown" href="javascript:void(0)">
{% if item.class_name %}<span class="{{ item.class_name }}"></span> {% endif %} {% if item.class_name %}<span class="{{ item.class_name }}"></span> {% endif %}
{{ menu_icon(item) }}{{ item.name }} {{ menu_icon(item) }}{{ item.name }}
{%- if 'dropdown-submenu' in class_name -%} {%- if 'dropdown-submenu' in class_name -%}
<i class="glyphicon glyphicon-chevron-right small"></i> <i class="glyphicon glyphicon-chevron-right small"></i>
{%- else -%} {%- else -%}
<i class="glyphicon glyphicon-chevron-down small"></i> <i class="glyphicon glyphicon-chevron-down small"></i>
{%- endif -%} {%- endif -%}
</a> </a>
<ul class="dropdown-menu"> <ul class="dropdown-menu">
{%- for child in children -%} {%- for child in children -%}
{%- if child.is_category() -%} {%- if child.is_category() -%}
{{ menu(menu_root=[child]) }} {{ menu(menu_root=[child]) }}
{% else %} {% else %}
{% set class_name = child.get_class_name() %} {% set class_name = child.get_class_name() %}
<li{% if class_name %} class="{{ class_name }}"{% endif %}>
{%- if child.is_active(admin_view) %} {%- if child.is_active(admin_view) %}
<li class="active{% if class_name %} {{class_name}}{% endif %}"> <a class="dropdown-item active" href="{{ child.get_url() }}"{% if child.target %}
target="{{ child.target }}"{% endif %}>
{{ menu_icon(child) }}{{ child.name }}</a>
{% else %} {% else %}
<li{% if class_name %} class="{{class_name}}"{% endif %}> <a class="dropdown-item" href="{{ child.get_url() }}"{% if child.target %}
target="{{ child.target }}"{% endif %}>
{{ menu_icon(child) }}{{ child.name }}</a>
{%- endif %} {%- endif %}
<a class="nav-link" href="{{ child.get_url() }}"{% if child.target %} </li>
target="{{ child.target }}"{% endif %}> {%- endif %}
{{ menu_icon(child) }}{{ child.name }}</a> {%- endfor %}
</li> </ul>
{%- endif %} </li>
{%- endfor %}
</ul>
</li>
{% endif %} {% endif %}
{%- else %} {%- else %}
{%- if item.is_accessible() and item.is_visible() -%} {%- if item.is_accessible() and item.is_visible() -%}
{% set class_name = item.get_class_name() %} {% set class_name = item.get_class_name() %}
{%- if item.is_active(admin_view) %} {%- if item.is_active(admin_view) %}
<li class="active{% if class_name %} {{class_name}}{% endif %}"> <li class="active{% if class_name %} {{ class_name }}{% endif %}">
{%- else %} {%- else %}
<li{% if class_name %} class="{{class_name}}"{% endif %}> <li{% if class_name %} class="{{ class_name }}"{% endif %}>
{%- endif %} {%- endif %}
<a class="nav-link" href="{{ item.get_url() }}"{% if item.target %} target="{{ item.target }}"{% endif %}>{{ menu_icon(item) }}{{ item.name }}</a> <a class="nav-link" href="{{ item.get_url() }}"{% if item.target %} target="{{ item.target }}"{% endif %}>
</li> {{ menu_icon(item) }}{{ item.name }}</a>
</li>
{%- endif -%} {%- endif -%}
{% endif -%} {% endif -%}
{% endfor %} {% endfor %}
...@@ -86,15 +89,15 @@ ...@@ -86,15 +89,15 @@
{% if messages %} {% if messages %}
{% for category, m in messages %} {% for category, m in messages %}
{% if category %} {% if category %}
{# alert-error changed to alert-danger in bootstrap 3, mapping is for backwards compatibility #} {# alert-error changed to alert-danger in bootstrap 3, mapping is for backwards compatibility #}
{% set mapping = {'message': 'info', 'error': 'danger'} %} {% set mapping = {'message': 'info', 'error': 'danger'} %}
<div class="alert alert-{{ mapping.get(category, category) }} alert-dismissable"> <div class="alert alert-{{ mapping.get(category, category) }} alert-dismissable">
{% else %} {% else %}
<div class="alert alert-dismissable"> <div class="alert alert-dismissable">
{% endif %} {% endif %}
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button> <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
{{ m }} {{ m }}
</div> </div>
{% endfor %} {% endfor %}
{% endif %} {% endif %}
{% endwith %} {% endwith %}
......
flask_admin/templates/bootstrap4/admin/model/layout.html
View file @ 4c443713
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
</li> </li>
{% else %} {% else %}
<li> <li>
<a href="{{ get_url('.export', export_type=admin_view.export_types[0], **request.args) }}" <a class="nav-link" href="{{ get_url('.export', export_type=admin_view.export_types[0], **request.args) }}"
title="{{ _gettext('Export') }}">{{ _gettext('Export') }}</a> title="{{ _gettext('Export') }}">{{ _gettext('Export') }}</a>
</li> </li>
{% endif %} {% endif %}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment