Merge pull request #824 from gstf/font-awesome

Font Awesome support for Flask Admin

flask_admin/base.py

@@ -180,6 +180,7 @@ class BaseView(with_metaclass(AdminViewMeta, BaseViewClass)):
                 Optional icon. Possible icon types:
 
                  - `flask_admin.consts.ICON_TYPE_GLYPH` - Bootstrap glyph icon
+                 - `flask_admin.consts.ICON_TYPE_FONT_AWESOME` - Font Awesome icon
                  - `flask_admin.consts.ICON_TYPE_IMAGE` - Image relative to Flask static directory
                  - `flask_admin.consts.ICON_TYPE_IMAGE_URL` - Image with full URL
             :param menu_icon_value:

flask_admin/consts.py

 # bootstrap glyph icon
 ICON_TYPE_GLYPH = 'glyph'
+# font awesome glyph icon
+ICON_TYPE_FONT_AWESOME = 'fa'
 # image relative to Flask static folder
 ICON_TYPE_IMAGE = 'image'
 # external image

flask_admin/contrib/mongoengine/view.py

@@ -221,6 +221,7 @@ class ModelView(BaseModelView):
                 Optional icon. Possible icon types:
 
                  - `flask_admin.consts.ICON_TYPE_GLYPH` - Bootstrap glyph icon
+                 - `flask_admin.consts.ICON_TYPE_FONT_AWESOME` - Font Awesome icon
                  - `flask_admin.consts.ICON_TYPE_IMAGE` - Image relative to Flask static directory
                  - `flask_admin.consts.ICON_TYPE_IMAGE_URL` - Image with full URL
 

flask_admin/contrib/pymongo/view.py

@@ -60,6 +60,7 @@ class ModelView(BaseModelView):
                 Optional icon. Possible icon types:
 
                  - `flask_admin.consts.ICON_TYPE_GLYPH` - Bootstrap glyph icon
+                 - `flask_admin.consts.ICON_TYPE_FONT_AWESOME` - Font Awesome icon
                  - `flask_admin.consts.ICON_TYPE_IMAGE` - Image relative to Flask static directory
                  - `flask_admin.consts.ICON_TYPE_IMAGE_URL` - Image with full URL
             :param menu_icon_value:

flask_admin/contrib/sqla/view.py

@@ -266,6 +266,7 @@ class ModelView(BaseModelView):
                 Optional icon. Possible icon types:
 
                  - `flask_admin.consts.ICON_TYPE_GLYPH` - Bootstrap glyph icon
+                 - `flask_admin.consts.ICON_TYPE_FONT_AWESOME` - Font Awesome icon
                  - `flask_admin.consts.ICON_TYPE_IMAGE` - Image relative to Flask static directory
                  - `flask_admin.consts.ICON_TYPE_IMAGE_URL` - Image with full URL
             :param menu_icon_value:

flask_admin/model/base.py

@@ -557,6 +557,7 @@ class BaseModelView(BaseView, ActionsMixin):
                 Optional icon. Possible icon types:
 
                  - `flask_admin.consts.ICON_TYPE_GLYPH` - Bootstrap glyph icon
+                 - `flask_admin.consts.ICON_TYPE_FONT_AWESOME` - Font Awesome icon
                  - `flask_admin.consts.ICON_TYPE_IMAGE` - Image relative to Flask static directory
                  - `flask_admin.consts.ICON_TYPE_IMAGE_URL` - Image with full URL
             :param menu_icon_value:

flask_admin/model/typefmt.py

@@ -30,7 +30,8 @@ def bool_formatter(view, value):
             Value to check
     """
     glyph = 'ok-circle' if value else 'minus-sign'
-    return Markup('<span class="glyphicon glyphicon-%s icon-%s"></span>' % (glyph, glyph))
+    fa = 'check-circle' if value else 'minus-circle'
+    return Markup('<span class="fa fa-%s glyphicon glyphicon-%s icon-%s"></span>' % (fa, glyph, glyph))
 
 
 def list_formatter(view, values):

flask_admin/static/admin/js/form-1.0.0.js

@@ -420,9 +420,9 @@
                        // display new boolean value as an icon
                        if(response) {
                            if(value == '1') {
-                               $(this).html('<span class="glyphicon glyphicon-ok-circle icon-ok-circle"></span>');
+                               $(this).html('<span class="fa fa-check-circle glyphicon glyphicon-ok-circle icon-ok-circle"></span>');
                            } else {
-                               $(this).html('<span class="glyphicon glyphicon-minus-sign icon-minus-sign"></span>'); 
+                               $(this).html('<span class="fa fa-minus-circle glyphicon glyphicon-minus-sign icon-minus-sign"></span>');
                            }
                        }
                     }
@@ -460,10 +460,10 @@
 
             if (idx > maxId) {
                 maxId = idx;
-            }               
+            }
         });
 
-        var prefix = id + '-' + maxId;        
+        var prefix = id + '-' + maxId;
 
         // Get template
         var $template = $($el.find('> .inline-field-template').text());

flask_admin/templates/bootstrap2/admin/file/list.html

@@ -51,7 +51,7 @@
                 {% block list_row_actions scoped %}
                 {% if admin_view.can_rename and path and name != '..' %}
                 <a class="icon" href="{{ get_url('.rename', path=path) }}">
-                        <i class="icon-pencil"></i>
+                        <i class="fa fa-pencil icon-pencil"></i>
                 </a>
                 {% endif %}
                 {%- if admin_view.can_delete and path -%}
@@ -61,7 +61,7 @@
                             {{ delete_form.path(value=path) }}
                             {{ delete_form.csrf_token }}
                             <button onclick="return confirm('{{ _gettext('Are you sure you want to delete \\\'%(name)s\\\' recursively?', name=name) }}')">
-                                <i class="icon-remove"></i>
+                                <i class="fa fa-times icon-remove"></i>
                             </button>
                         </form>
                         {% endif %}
@@ -70,7 +70,7 @@
                         {{ delete_form.path(value=path) }}
                         {{ delete_form.csrf_token }}
                         <button onclick="return confirm('{{ _gettext('Are you sure you want to delete \\\'%(name)s\\\'?', name=name) }}')">
-                            <i class="icon-remove"></i>
+                            <i class="fa fa-times icon-remove"></i>
                         </button>
                     </form>
                     {% endif %}
@@ -80,7 +80,7 @@
             {% if is_dir %}
             <td colspan="2">
                 <a href="{{ get_dir_url('.index', path)|safe }}">
-                    <i class="icon-folder-close"></i> <span>{{ name }}</span>
+                    <i class="fa fa-folder-o icon-folder-close"></i> <span>{{ name }}</span>
                 </a>
             </td>
             {% else %}

flask_admin/templates/bootstrap2/admin/layout.html

@@ -4,6 +4,8 @@
   {% set icon_value = item.get_icon_value() %}
   {% if icon_type == 'glyph' %}
     <i class="{{ icon_value }}"></i>
+  {% elif icon_type == 'fa' %}
+    <i class="fa fa-{{ icon_value }}"></i>
   {% elif icon_type == 'image' %}
     <img src="{{ url_for('static', filename=icon_value) }}" alt="menu image"></img>
   {% elif icon_type == 'image-url' %}

flask_admin/templates/bootstrap2/admin/model/inline_list_base.html

@@ -12,7 +12,7 @@
                     <input type="checkbox" name="del-{{ subfield.id }}" id="del-{{ subfield.id }}" />
                     <label for="del-{{ subfield.id }}" style="display: inline">{{ _gettext('Delete?') }}</label>
                     {% else %}
-                    <a href="javascript:void(0)" class="inline-remove-field"><i class="icon-remove"></i></a>
+                    <a href="javascript:void(0)" class="inline-remove-field"><i class="fa fa-times icon-remove"></i></a>
                     {% endif %}
                 </div>
             </legend>
@@ -21,7 +21,7 @@
         </div>
         {% endfor %}
     </div>
-    
+
     {# template for new inline form fields #}
     <div class="inline-field-template hide">
         {% filter forceescape %}
@@ -29,14 +29,14 @@
             <legend>
                 New {{ field.label.text }}
                 <div class="pull-right">
-                    <a href="javascript:void(0)" class="inline-remove-field"><i class="icon-remove"></i></a>
+                    <a href="javascript:void(0)" class="inline-remove-field"><i class="fa fa-times icon-remove"></i></a>
                 </div>
             </legend>
             {{ render(template) }}
         </div>
         {% endfilter %}
     </div>
-    
+
     <a id="{{ field.id }}-button" href="javascript:void(0)" class="btn" onclick="faForm.addInlineField(this, '{{ field.id }}');">{{ _gettext('Add') }} {{ field.label.text }}</a>
 </div>
 {% endmacro %}

flask_admin/templates/bootstrap2/admin/model/layout.html

@@ -37,7 +37,7 @@
     <div class="input-append">
             <input type="text" name="search" value="{{ search }}" class="{{ input_class }}" placeholder="{{ _gettext('Search') }}">
             <a href="{{ clear_search_url }}" class="clear add-on">
-                <i class="icon-remove"></i>
+                <i class="fa fa-times icon-remove"></i>
             </a>
     </div>
     {% else %}

flask_admin/templates/bootstrap2/admin/model/list.html

@@ -67,9 +67,9 @@
                                 <a href="{{ sort_url(column, True) }}" title="{{ _gettext('Sort by %(name)s', name=name) }}">
                                     {{ name }}
                                     {% if sort_desc %}
-                                        <i class="icon-chevron-up"></i>
+                                        <i class="fa fa-chevron-up icon-chevron-up"></i>
                                     {% else %}
-                                        <i class="icon-chevron-down"></i>
+                                        <i class="fa fa-chevron-down icon-chevron-down"></i>
                                     {% endif %}
                                 </a>
                             {% else %}
@@ -79,7 +79,7 @@
                             {{ name }}
                         {% endif %}
                         {% if admin_view.column_descriptions.get(c) %}
-                            <a class="icon-question-sign"
+                            <a class="fa fa-question-circle icon-question-sign"
                                title="{{ admin_view.column_descriptions[c] }}"
                                href="javascript:void(0)" data-role="tooltip"
                             ></a>
@@ -103,7 +103,7 @@
                     {% block list_row_actions scoped %}
                         {%- if admin_view.can_edit -%}
                         <a class="icon" href="{{ get_url('.edit_view', id=get_pk_value(row), url=return_url) }}" title="{{ _gettext('Edit record') }}">
-                            <i class="icon-pencil"></i>
+                            <i class="fa fa-pencil icon-pencil"></i>
                         </a>
                         {%- endif -%}
                         {%- if admin_view.can_delete -%}
@@ -112,14 +112,14 @@
                             {{ delete_form.url(value=return_url) }}
                             {{ delete_form.csrf_token }}
                             <button onclick="return confirm('{{ _gettext('Are you sure you want to delete this record?') }}');" title="{{ _gettext('Delete record') }}">
-                                <i class="icon-trash"></i>
+                                <i class="fa fa-trash icon-trash"></i>
                             </button>
                         </form>
                         {%- endif -%}
                     {% endblock %}
                 </td>
                 {% endblock %}
-                
+
                 {% for c, name in list_columns %}
                     {% if admin_view.is_editable(c) %}
                         {% if form.csrf_token %}
@@ -171,7 +171,7 @@
                     '#filter_form', '.field-filters',
                     {{ filter_groups|tojson|safe }},
                     {{ active_filters|tojson|safe }}
-                );                
+                );
             {% endif %}
         })(jQuery);
     </script>

flask_admin/templates/bootstrap3/admin/file/list.html

@@ -51,7 +51,7 @@
                 {% block list_row_actions scoped %}
                 {% if admin_view.can_rename and path and name != '..' %}
                 <a class="icon" href="{{ get_url('.rename', path=path) }}">
-                        <i class="glyphicon glyphicon-pencil"></i>
+                        <i class="fa fa-pencil glyphicon glyphicon-pencil"></i>
                 </a>
                 {% endif %}
                 {%- if admin_view.can_delete and path -%}
@@ -61,7 +61,7 @@
                             {{ delete_form.path(value=path) }}
                             {{ delete_form.csrf_token }}
                             <button onclick="return confirm('{{ _gettext('Are you sure you want to delete \\\'%(name)s\\\' recursively?', name=name) }}')">
-                                <i class="glyphicon glyphicon-remove"></i>
+                                <i class="fa fa-times glyphicon glyphicon-remove"></i>
                             </button>
                         </form>
                         {% endif %}
@@ -70,7 +70,7 @@
                         {{ delete_form.path(value=path) }}
                         {{ delete_form.csrf_token }}
                         <button onclick="return confirm('{{ _gettext('Are you sure you want to delete \\\'%(name)s\\\'?', name=name) }}')">
-                            <i class="glyphicon glyphicon-trash"></i>
+                            <i class="fa fa-trash glyphicon glyphicon-trash"></i>
                         </button>
                     </form>
                     {% endif %}
@@ -80,7 +80,7 @@
             {% if is_dir %}
             <td colspan="2">
                 <a href="{{ get_dir_url('.index', path)|safe }}">
-                    <i class="glyphicon glyphicon-folder-close"></i> <span>{{ name }}</span>
+                    <i class="fa fa-folder-o glyphicon glyphicon-folder-close"></i> <span>{{ name }}</span>
                 </a>
             </td>
             {% else %}

flask_admin/templates/bootstrap3/admin/layout.html

@@ -4,6 +4,8 @@
   {% set icon_value = item.get_icon_value() %}
   {% if icon_type == 'glyph' %}
     <i class="glyphicon {{ icon_value }}"></i>
+  {% elif icon_type == 'fa' %}
+    <i class="fa {{ icon_value }}"></i>
   {% elif icon_type == 'image' %}
     <img src="{{ url_for('static', filename=icon_value) }}" alt="menu image"></img>
   {% elif icon_type == 'image-url' %}

flask_admin/templates/bootstrap3/admin/model/inline_list_base.html

@@ -13,7 +13,7 @@
                         <input type="checkbox" name="del-{{ subfield.id }}" id="del-{{ subfield.id }}" />
                         <label for="del-{{ subfield.id }}" style="display: inline">{{ _gettext('Delete?') }}</label>
                         {% else %}
-                        <a href="javascript:void(0)" class="inline-remove-field"><i class="glyphicon glyphicon-remove"></i></a>
+                        <a href="javascript:void(0)" class="inline-remove-field"><i class="fa fa-times glyphicon glyphicon-remove"></i></a>
                         {% endif %}
                     </div>
                 </small>
@@ -24,7 +24,7 @@
         </div>
         {% endfor %}
     </div>
-    
+
     {# template for new inline form fields #}
     <div class="inline-field-template hide">
         {% filter forceescape %}
@@ -32,7 +32,7 @@
             <legend>
                 <small>New {{ field.label.text }}</small>
                 <div class="pull-right">
-                    <a href="javascript:void(0)" class="inline-remove-field"><span class="glyphicon glyphicon-remove"></span></a>
+                    <a href="javascript:void(0)" class="inline-remove-field"><span class="fa fa-times glyphicon glyphicon-remove"></span></a>
                 </div>
             </legend>
             <div class='clearfix'></div>

flask_admin/templates/bootstrap3/admin/model/layout.html

@@ -36,7 +36,7 @@
     {% if search %}
     <div class="input-group">
         <input type="text" name="search" value="{{ search }}" class="{{ input_class }} form-control" placeholder="{{ _gettext('Search') }}">
-        <a href="{{ clear_search_url }}" class="input-group-addon clear"><span class="glyphicon glyphicon-remove"></span></a>
+        <a href="{{ clear_search_url }}" class="input-group-addon clear"><span class="fa fa-times glyphicon glyphicon-remove"></span></a>
     </div>
     {% else %}
     <div class="form-group">

flask_admin/templates/bootstrap3/admin/model/list.html

@@ -67,9 +67,9 @@
                                 <a href="{{ sort_url(column, True) }}" title="{{ _gettext('Sort by %(name)s', name=name) }}">
                                     {{ name }}
                                     {% if sort_desc %}
-                                        <span class="glyphicon glyphicon-chevron-up"></span>
+                                        <span class="fa fa-chevron-up glyphicon glyphicon-chevron-up"></span>
                                     {% else %}
-                                        <span class="glyphicon glyphicon-chevron-down"></span>
+                                        <span class="fa fa-chevron-down glyphicon glyphicon-chevron-down"></span>
                                     {% endif %}
                                 </a>
                             {% else %}
@@ -79,7 +79,7 @@
                             {{ name }}
                         {% endif %}
                         {% if admin_view.column_descriptions.get(c) %}
-                            <a class="glyphicon glyphicon-question-sign"
+                            <a class="fa fa-question-circle glyphicon glyphicon-question-sign"
                                title="{{ admin_view.column_descriptions[c] }}"
                                href="javascript:void(0)" data-role="tooltip"
                             ></a>
@@ -103,7 +103,7 @@
                     {% block list_row_actions scoped %}
                         {%- if admin_view.can_edit -%}
                         <a class="icon" href="{{ get_url('.edit_view', id=get_pk_value(row), url=return_url) }}" title="{{ _gettext('Edit record') }}">
-                            <span class="glyphicon glyphicon-pencil"></span>
+                            <span class="fa fa-pencil glyphicon glyphicon-pencil"></span>
                         </a>
                         {%- endif -%}
                         {%- if admin_view.can_delete -%}
@@ -112,7 +112,7 @@
                             {{ delete_form.url(value=return_url) }}
                             {{ delete_form.csrf_token }}
                             <button onclick="return confirm('{{ _gettext('Are you sure you want to delete this record?') }}');" title="Delete record">
-                                <span class="glyphicon glyphicon-trash"></span>
+                                <span class="fa fa-trash glyphicon glyphicon-trash"></span>
                             </button>
                         </form>
                         {%- endif -%}