render_box comment embeddable, misc

src/Bundle/ChillActivityBundle/Resources/views/Activity/list.html.twig

@@ -147,21 +147,23 @@
                 </div>
             </div>
 
-            {%
+            {%  if activity.comment.comment is not empty
-                if activity.comment.comment is not empty
                 or activity.persons|length > 0
                 or activity.thirdParties|length > 0
                 or activity.users|length > 0
             %}
             <div class="item-row details">
                 <div class="item-col">
-
                     {% include 'ChillActivityBundle:Activity:concernedGroups.html.twig' with {'context': context, 'with_display': 'row', 'entity': activity } %}
                 </div>
 
                 {% if activity.comment.comment is not empty %}
-                <div class="item-col comment">
+                <div class="item-col">
-                    {{ activity.comment|chill_entity_render_box( { 'limit_lines': 3, 'metadata': false } ) }}
+                    {{ activity.comment|chill_entity_render_box({
+                        'disable_markdown': false,
+                        'limit_lines': 3,
+                        'metadata': false,
+                    }) }}
                 </div>
                 {% endif %}
             </div>

src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss

@@ -223,21 +223,49 @@ table.table-bordered {
    }
 }
 
-/// chill elements of design
+/// comments quotes
 .chill-user-quote {
    border-left: 10px solid $yellow;
    margin: 1.5em 10px;
    padding: 0.5em 15px;
-   quotes: "\201C" "\201D" "\2018" "\2019";
    background-color: $gray-200;
-   blockquote {
+   color: $gray-800;
-      border-left: 0.4em solid $gray-400;
+   font-size: 90%;
-      padding-left: 0.9em;
+
-      margin-left: 0.9em;
+   // test a bottom right decoration (to be confirmed)
+   &.test {
+      position: relative;
+      &:after {
+         content: '';
+         position: absolute;
+         width: 0px; height: 0px;
+         bottom: 0; right: 0;
+         background: $white;
+         border-top: 10px solid $gray-200;
+         border-left: 10px solid $gray-200;
+         border-right: 10px solid $white;
+         border-bottom: 10px solid $white;
+      }
+   }
+
+   // ckeditor citation
+   blockquote p {
       font-style: italic;
+      padding-left: 2em;
+      quotes: "“" "„";
+      position: relative;
+      &:before {
+         content: open-quote;
+         font-size: 400%;
+         color: $gray-400;
+         position: absolute;
+         top: -25px;
+         left: 0;
+      }
    }
 }
 
+/// when there is no data
 .custom_field_no_data,
 .chill-no-data-statement {
    font-style: italic;

src/Bundle/ChillMainBundle/Resources/public/chill/scss/flex_table.scss

@@ -80,7 +80,7 @@ div.flex-table {
         &:nth-child(even) {
             background-color: $gray-200;
             .chill-user-quote {
-                background-color: $gray-100;
+                background-color: shade-color($gray-200, 5%)
             }
         }
 

src/Bundle/ChillMainBundle/Resources/public/chill/scss/render_box.scss

@@ -98,4 +98,19 @@ section.chill-entity {
             &.address-until {}
         }
     }
+
+    // used for comment-embeddable
+    &.entity-comment-embeddable {
+        width: 100%;
+        div.metadata {
+            font-size: smaller;
+            color: $gray-600;
+            span.user, span.date {
+                text-decoration: underline dotted;
+                &:hover {
+                    color: $gray-700;
+                }
+            }
+        }
+    }
 }

src/Bundle/ChillMainBundle/Resources/public/lib/entity/comment_embeddable.scss

@@ -1,6 +1 @@
-.chill-entity__comment-embeddable {
+
-    .chill-entity__comment-embeddable__metadata {
-        font-size: smaller;
-        color: var(--chill-light-gray);
-    }
-}

src/Bundle/ChillMainBundle/Resources/views/Entity/CommentEmbeddable.html.twig

@@ -1,7 +1,13 @@
-{{ opening_box|raw }}
+{#
-<div class="">
+    Template to render a comment
-    <div class="comment-embeddable_comment">
 
+    OPTIONS
+    * disable_markdown  bool
+    * limit_lines       integer|null
+    * metadata          bool
+
+#}
+{{ opening_box|raw }}
     {%- if options['limit_lines'] is not null -%}
         {% set content = comment.comment|split('\n')|slice(0, options['limit_lines'])|join('\n') %}
     {%- else -%}
@@ -14,23 +20,26 @@
         {% else %}
             {{ content|chill_markdown_to_html }}
         {% endif %}
-        </blockquote>
-    </div>
-</div>
-{% if options['metadata'] %}
-<div class="chill-entity__comment-embeddable__metadata">
-    {% if user is not empty %}
-        <span class="chill-entity__comment-embeddable__user">
-            {{ 'Last updated by'| trans }} {{ user|chill_entity_render_box(options['user']) }}
-        </span>';
-    {% endif %}
 
+        {% if options['metadata'] %}
+            <div class="metadata">
+                {% if user is not empty %}
+                    {{ 'Last updated by'| trans }}
+                    <span class="user">
+                        {{ user|chill_entity_render_box(options['user']) }}
+                    </span>
+                {% endif %}
                 {% if comment.date is not empty %}
-        <span class="chill-entity__comment-embeddable__date">
+                    {% if user is empty %}
-            {% if user is empty %}{{ 'Last updated on'|trans ~ ' ' }}{% else %}{{ 'on'|trans ~ ' ' }}{% endif %}
+                        {{ 'Last updated on'|trans ~ ' ' }}
+                    {% else %}
+                        {{ 'on'|trans ~ ' ' }}
+                    {% endif %}
+                    <span class="date">
                         {{ comment.date|format_datetime("medium", "short") }}
                     </span>
                 {% endif %}
-</div>
+            </div>
-{% endif %}
+        {% endif %}
+    </blockquote>
 {{ closing_box|raw }}