add day of event to calendar icon :)

features/events/templates/events/_preview.html

 {% extends 'content/_preview.html' %}
 
 {% block content_type %}
-    <i class="sg sg-content-type-event"></i>
     <span>{% if not association.public %}Interne {% endif %}Veranstaltung</span>
+    <i class="sg sg-content-type-event" data-day="{{ association.container.time|date:'d' }}"></i>
 {% endblock %}
 
 {% block content_preview_image %}

features/events/templates/events/detail.html

@@ -3,8 +3,8 @@
 {% block menu %}{% menu 'event' association.entity %}{% endblock %}
 
 {% block content_type %}
-    <i class="sg sg-content-type-event"></i>
     <span>{% if not association.public %}Interne {% endif %}Veranstaltung</span>
+    <i class="sg sg-content-type-event" data-day="{{ association.container.time|date:'d' }}"></i>
 {% endblock %}
 
 {% block user_content_header %}

res/css/components/icons.less

@@ -131,12 +131,12 @@
 
 // content type icons
 .sg-icon(content-type-article, @fa-var-file-text-o);
-.sg-icon(content-type-event, @fa-var-calendar-o);
+.sg-icon(content-type-event, @fa-var-calendar-o, @extensions: @ruleset-calendar-icon);
 .sg-icon(content-type-gallery, @fa-var-picture-o);
 .sg-icon(content-type-gestalt, @fa-var-user);
 .sg-icon(content-type-poll, @fa-var-thumbs-o-up);
 .sg-icon(article, @fa-var-file-text-o);
-.sg-icon(event, @fa-var-calendar-o);
+.sg-icon(event, @fa-var-calendar-o, @extensions: @ruleset-calendar-icon);
 .sg-icon(gallery, @fa-var-picture-o);
 .sg-icon(conversations, @fa-var-comments-o);
 .sg-icon(gestalt, @fa-var-user);

res/css/definitions/variables.less

@@ -60,3 +60,18 @@
 @input-border: @gray-light;
 @input-border-focus: @brand-primary;
 @input-border-width: @component-border-width;
+
+@ruleset-calendar-icon: {
+    position: relative;
+
+    &[data-day]::before {
+        content: attr(data-day);
+        font-family: var(--font-default);
+        font-size: .5em;
+        font-weight: bold;
+        position: absolute;
+        left: 50%;
+        top: 67%;
+        transform: translate(-50%, -50%);
+    }
+};