UI tweaks

templates/index.html

@@ -44,11 +44,13 @@
 <input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
 <button type="submit" class="bar-item">unboost</button>
 </form>
-        <span class="bar-item-no-hover"><a style="color:#808080;" href="{{ boost_actor.url | get_url }}">{{ boost_actor.name }}</a> boosted</span>
+        {{ utils.display_actor_box(boost_actor, after="boosted") }} 
+        {{ utils.display_in_reply_to(item.meta, item.activity.object) }}
         </div>
         {% else %}
         <p style="margin-left:65px;padding-bottom:5px;display:inline-block;">
-        <span class="bar-item-no-hover"><a style="color:#808080;" href="{{ boost_actor.url | get_url }}">{{ boost_actor.name }}</a> boosted</span>
+        {{ utils.display_actor_box(boost_actor, after="boosted") }} 
+        {{ utils.display_in_reply_to(item.meta, item.activity.object) }}
         </p>
         {% endif %}
 	{% endif %}
@@ -56,6 +58,11 @@
         {{ utils.display_note(item.meta.object, meta=item.meta) }}
         {% endif %}
 	{% elif item | has_type('Create') %}
+        {% if item.activity.object.inReplyTo %}
+        <p style="margin-left:65px;padding-bottom:5px;display:inline-block;">
+        {{ utils.display_in_reply_to(item.meta, item.activity.object) }}
+        </p>
+        {% endif %}
         {{ utils.display_note(item.activity.object, meta=item.meta, no_color=True) }}
     {% endif %}
 

templates/stream.html

@@ -134,6 +134,7 @@
     <input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
     <button type="submit" class="bar-item">ack reply</button>
     </form>
+    {{ utils.display_in_reply_to(item.meta, item.activity.object) }}
     </div>
 	
     {% endif %}
@@ -143,7 +144,9 @@
 	{% set boost_actor = item.meta.actor %}
     {% if boost_actor %}
     <div style="margin-left:70px;padding-bottom:5px;margin-bottom:15px;display:inline-block;">
-    <span class="bar-item-no-hover"><a style="color:#808080;" href="{{ boost_actor.url | get_url }}">{{ boost_actor.name or boost_actor.preferredUsername }}</a> boosted</span>
+    {{ utils.display_actor_box(boost_actor, after="boosted") }} 
+    {{ utils.display_in_reply_to(item.meta, item.activity.object) }}
+
     {% if request.path == url_for('admin.admin_notifications') %}
     {% if item.meta.notification_unread %}<span class="bar-item-no-bg"><span class="pcolor">new</span></span>{% endif %}
     <span class="bar-item-no-bg">{{ (item.activity.published or item.meta.published) | format_timeago }}</span>
@@ -152,6 +155,7 @@
     </div>
     {% endif %}
 	{% if item.meta.object %}
+
 	{{ utils.display_note(item.meta.object, meta=item.meta) }}
 	{% endif %}
 	{% endif %}
@@ -159,7 +163,8 @@
     {% if item | has_type('Like') %}
     {% set boost_actor = item.meta.actor %}
     <div style="margin-left:70px;padding-bottom:5px;margin-bottom:15px;display:inline-block;">
-    <span class="bar-item-no-hover"><a style="color:#808080;" href="{{ boost_actor.url | get_url }}">{{ boost_actor.name or boost_actor.preferredUsername }}</a> liked</span>
+    {{ utils.display_actor_box(boost_actor, after="liked") }} 
+    {{ utils.display_in_reply_to(item.meta, item.activity.object) }}
     {% if item.meta.notification_unread %}<span class="bar-item-no-bg"><span class="pcolor">new</span></span>{% endif %}
     <span class="bar-item-no-bg">{{ (item.activity.published or item.meta.published) | format_timeago }}</span>
     </div>

templates/utils.html

@@ -26,6 +26,46 @@
 {% endif %}
 {%- endmacro %}
 
+{% macro display_actor_box(actor, after=None, before=None, before_url=None) -%}
+
+{% if not actor.icon %}
+{% set icon_url = "/static/nopic.png" %}
+{% else %}
+{% set icon_url = actor.icon.url | get_actor_icon_url(50) %}
+{% endif %}
+
+        <span class="bar-item-no-hover" style="padding:0;">
+            <span style="display:flex;height:30px;line-height:30px;background: url('{{ icon_url }}') no-repeat;background-size:30px;border-top-left-radius: 2px;border-bottom-left-radius: 2px;">
+                {% if before and before_url %}
+                <span style="flex-shrink:1; padding:0 10px 0 40px;"><a href="{{before_url}}">{{before}}</a></span>
+                <span style="flex-shrink:1;padding-right:10px;">
+                <a style="color:#808080;" href="{{ actor.url | get_url }}">{{ ( actor.name or actor.preferredUsername) | clean | replace_custom_emojis(actor) | safe }}</a>
+                </span>
+                {% endif %}
+                {% if after %}
+                <span style="flex-shrink:1;padding-left:40px;">
+                <a style="color:#808080;" href="{{ actor.url | get_url }}">{{ ( actor.name or actor.preferredUsername) | clean | replace_custom_emojis(actor) | safe }}</a>
+                </span>
+                <span style="flex-shrink:1;padding:0 10px;">{{ after }}</span>
+                {% endif %}
+            </span>
+        </span>
+
+
+{%- endmacro %}
+
+{% macro display_in_reply_to(meta, obj) -%}
+
+{% if meta.in_reply_to_actor %}
+{{ display_actor_box(meta.in_reply_to_actor, before="in reply to", before_url=obj.inReplyTo) }}
+{% elif meta.in_reply_to_self %}
+<span class="bar-item-no-hover" style="padding:0;">
+<a href="{{ obj.inReplyTo }}">self reply</a>
+</span>
+{% endif %}
+
+{%- endmacro %}
+
 {% macro display_note(obj, perma=False, likes=[], shares=[], meta={}, no_color=False) -%}
 
 {% if meta.object_actor %}
@@ -74,17 +114,6 @@
 	</span>
     </aside>
 
-{% if meta.in_reply_to_actor %}
-<div style="margin:10px 0 15px 0;padding:0;">
-<a href="{{ obj.inReplyTo }}">in reply to</a> {{ display_actor_oneline(meta.in_reply_to_actor) }}
-</div>
-{% elif meta.in_reply_to_self %}
-<div style="margin:10px 0 15px 0;padding:0;">
-<a href="{{ obj.inReplyTo }}">self reply</a>
-</div>
-{% endif %}
-
-
 	{% if obj.summary %}<p class="p-summary">{{ obj.summary | clean | replace_custom_emojis(obj) | safe }}</p>{% endif %}
     {% if obj | has_type('Video') %}
     <div class="note-video">