Add support for icon shadows

Signed-off-by: Roberto Rosario <roberto.rosario@mayan-edms.com>

mayan/apps/appearance/classes.py

@@ -4,6 +4,7 @@ from django.template.loader import get_template
 
 
 class IconDriver(object):
+    context = {}
     _registry = {}
 
     @classmethod
@@ -14,6 +15,17 @@ class IconDriver(object):
     def register(cls, driver_class):
         cls._registry[driver_class.name] = driver_class
 
+    def get_context(self):
+        return self.context
+
+    def render(self, extra_context=None):
+        context = self.get_context()
+        if extra_context:
+            context.update(extra_context)
+        return get_template(template_name=self.template_name).render(
+            context=context
+        )
+
 
 class FontAwesomeDriver(IconDriver):
     name = 'fontawesome'
@@ -22,10 +34,8 @@ class FontAwesomeDriver(IconDriver):
     def __init__(self, symbol):
         self.symbol = symbol
 
-    def render(self):
-        return get_template(template_name=self.template_name).render(
-            context={'symbol': self.symbol}
-        )
+    def get_context(self):
+        return {'symbol': self.symbol}
 
 
 class FontAwesomeDualDriver(IconDriver):
@@ -36,23 +46,21 @@ class FontAwesomeDualDriver(IconDriver):
         self.primary_symbol = primary_symbol
         self.secondary_symbol = secondary_symbol
 
-    def render(self):
-        return get_template(template_name=self.template_name).render(
-            context={
-                'data': (
-                    {
-                        'class': 'fas fa-circle',
-                        'transform': 'down-3 right-10',
-                        'mask': 'fas fa-{}'.format(self.primary_symbol)
-                    },
-                    {'class': 'far fa-circle', 'transform': 'down-3 right-10'},
-                    {
-                        'class': 'fas fa-{}'.format(self.secondary_symbol),
-                        'transform': 'shrink-4 down-3 right-10'
-                    },
-                )
-            }
-        )
+    def get_context(self):
+        return {
+            'data': (
+                {
+                    'class': 'fas fa-circle',
+                    'transform': 'down-3 right-10',
+                    'mask': 'fas fa-{}'.format(self.primary_symbol)
+                },
+                {'class': 'far fa-circle', 'transform': 'down-3 right-10'},
+                {
+                    'class': 'fas fa-{}'.format(self.secondary_symbol),
+                    'transform': 'shrink-4 down-3 right-10'
+                },
+            )
+        }
 
 
 class FontAwesomeCSSDriver(IconDriver):
@@ -62,10 +70,8 @@ class FontAwesomeCSSDriver(IconDriver):
     def __init__(self, css_classes):
         self.css_classes = css_classes
 
-    def render(self):
-        return get_template(template_name=self.template_name).render(
-            context={'css_classes': self.css_classes}
-        )
+    def get_context(self):
+        return {'css_classes': self.css_classes}
 
 
 class FontAwesomeMasksDriver(IconDriver):
@@ -75,23 +81,23 @@ class FontAwesomeMasksDriver(IconDriver):
     def __init__(self, data):
         self.data = data
 
-    def render(self):
-        return get_template(template_name=self.template_name).render(
-            context={'data': self.data}
-        )
+    def get_context(self):
+        return {'data': self.data}
 
 
 class FontAwesomeLayersDriver(IconDriver):
     name = 'fontawesome-layers'
     template_name = 'appearance/icons/font_awesome_layers.html'
 
-    def __init__(self, data):
+    def __init__(self, data, shadow_class=None):
         self.data = data
+        self.shadow_class = shadow_class
 
-    def render(self):
-        return get_template(template_name=self.template_name).render(
-            context={'data': self.data}
-        )
+    def get_context(self):
+        return {
+            'data': self.data,
+            'shadow_class': self.shadow_class,
+        }
 
 
 class Icon(object):

mayan/apps/appearance/templates/appearance/icons/font_awesome_layers.html

@@ -1,4 +1,7 @@
 <span class="fa-layers fa-fw" style="margin-right: 7px;">
+    {% if enable_shadow %}
+        <i class="{{ shadow_class }}" data-fa-transform="right-1 down-2" style="color:rgba(0, 0, 0, 0.3); stroke: rgba(255, 255, 255, 0.3); stroke-width: 20;"></i>
+    {% endif %}
     {% for entry in data %}
         <i class="{{ entry.class }}" data-fa-transform="{{ entry.transform }}" data-fa-mask="{{ entry.mask }}"></i>
     {% endfor %}

mayan/apps/appearance/templates/appearance/icons/font_awesome_symbol.html

@@ -1 +1,8 @@
-<i class="fa fa-{{ symbol }}" style="padding-right: 5px; width: auto;"></i>
+{% if enable_shadow %}
+    <span class="fa-layers fa-fw" >
+        <i class="fa fa-{{ symbol }}" data-fa-transform="right-1 down-2" style="color:rgba(0, 0, 0, 0.3);stroke: rgba(255, 255, 255, 0.3); stroke-width: 20;"></i>
+        <i class="fa fa-{{ symbol }}"></i>
+    </span>
+{% else %}
+    <i class="fa fa-{{ symbol }}" style="padding-right: 5px; width: auto;"></i>
+{% endif %}

mayan/apps/appearance/templatetags/appearance_tags.py

@@ -7,6 +7,11 @@ from django.utils.translation import ugettext_lazy as _
 register = Library()
 
 
+@register.simple_tag
+def appearance_icon_render(icon_class, enable_shadow=False):
+    return icon_class.render(extra_context={'enable_shadow': enable_shadow})
+
+
 @register.filter
 def get_choice_value(field):
     try:

mayan/apps/documents/icons.py

@@ -7,7 +7,7 @@ icon_document_type = Icon(
     driver_name='fontawesome-layers', data=[
         {'class': 'fas fa-circle', 'transform': 'shrink-12 up-2'},
         {'class': 'fas fa-cog', 'transform': 'shrink-6 up-2', 'mask': 'fas fa-torah'}
-    ]
+    ], shadow_class='fas fa-torah'
 )
 
 icon_menu_documents = Icon(driver_name='fontawesome', symbol='book')

mayan/apps/navigation/templates/navigation/large_button_link.html

@@ -1,6 +1,8 @@
+{% load appearance_tags %}
+
 <div class="{% if div_class %}{{ div_class }}{% else %}col-xs-12 col-sm-6 col-md-4 col-lg-3{% endif %}">
-    <a class="btn btn-default btn-lg btn-block {% if 'new_window' in link.tags %}new_window{% endif %}" href="{{ link.url }}">
-        {% if link.icon_class %}<span style="font-size: 200%;">{{ link.icon_class.render }}</span>{% endif %}
+    <a class="btn btn-primary btn-lg btn-block {% if 'new_window' in link.tags %}new_window{% endif %}" href="{{ link.url }}" style="">
+        {% if link.icon_class %}<span style="font-size: 200%;">{% appearance_icon_render link.icon_class enable_shadow=True %}</span>{% endif %}
         <br>
         {{ link.text }}
     </a>