Admin improvements and design tweaks

app/templates/admin_inbox.html

@@ -4,17 +4,26 @@
 
 {{ utils.display_box_filters("admin_inbox") }}
 
+{% macro actor_action(inbox_object, text) %}
+    <div class="actor-action">
+        <a href="{{ url_for("admin_profile") }}?actor_id={{ inbox_object.actor.ap_id }}">{{ inbox_object.actor.display_name }}</a> {{ text }}
+        <span>{{ inbox_object.ap_published_at | timeago }}</span>
+    </div>
+
+{% endmacro %}
+
 {% for inbox_object in inbox %}
 {% if inbox_object.ap_type == "Announce" %}
+    {{ actor_action(inbox_object, "shared one of your post") }}
     {{ utils.display_object(inbox_object.relates_to_anybox_object) }}
 {% elif inbox_object.ap_type in ["Article", "Note", "Video"] %}
 {{ utils.display_object(inbox_object) }}
 {% elif inbox_object.ap_type == "Follow" %}
-    <div class="actor-action">
-        {{ inbox_object.actor.display_name }} followed you
-        <span>{{ inbox_object.ap_published_at | timeago }}</span>
-    </div>
+    {{ actor_action(inbox_object, "followed you") }}
     {{ utils.display_actor(inbox_object.actor, actors_metadata) }}
+{% elif inbox_object.ap_type == "Like" %}
+    {{ actor_action(inbox_object, "liked one of your post") }}
+    {{ utils.display_object(inbox_object.relates_to_anybox_object) }}
 {% else %}
     <p>
     Implement {{ inbox_object.ap_type }}

app/templates/admin_new.html

@@ -7,7 +7,7 @@
 {{ utils.display_object(in_reply_to_object) }}
 {% endif %}
 
-<form action="{{ request.url_for("admin_actions_new") }}" enctype="multipart/form-data" method="POST">
+<form class="form" action="{{ request.url_for("admin_actions_new") }}" enctype="multipart/form-data" method="POST">
     {{ utils.embed_csrf_token() }}
     {{ utils.embed_redirect_url() }}
     <p>
@@ -24,12 +24,12 @@
     <span class="ji"><img src="{{ emoji.icon.url }}" alt="{{ emoji.name }}" title="{{ emoji.name }}" class="custom-emoji"></span>
     {% endfor %}
 
-    <textarea name="content" rows="10" cols="50" autofocus="autofocus" designMode="on" style="font-size:1.2em;width:95%;">{{ content }}</textarea>
+    <textarea name="content" rows="10" cols="50" autofocus="autofocus" designMode="on" placeholder="Hey!" style="font-size:1.2em;width:95%;">{{ content }}</textarea>
     <p>
-        <input type="text" name="content_warning" placeholder="content warning (will mark the post as sensitive)" style="width:300px;">
+        <input type="text" name="content_warning" placeholder="content warning (will mark the post as sensitive)" style="width:95%;">
     </p>
     <p>
-        <input type="checkbox" name="is_sensitive" id="is_sensitive"> <label for="is_sensitive">Mark attachment(s) as sentive</label>
+        <input type="checkbox" name="is_sensitive" id="is_sensitive"> <label for="is_sensitive">Mark attachment(s) as sensitive</label>
     </p>
     <input type="hidden" name="in_reply_to" value="{{ request.query_params.in_reply_to }}">
     <p>

app/templates/admin_outbox.html

@@ -16,7 +16,6 @@
         <div class="actor-action">You followed</div>
         {{ utils.display_actor(outbox_object.relates_to_actor, actors_metadata) }}
     {% elif outbox_object.ap_type in ["Article", "Note", "Video"] %}
-        {% if outbox_object.is_deleted %}Deleted{% endif %}
         {{ utils.display_object(outbox_object) }}
     {% else %}
         Implement {{ outbox_object.ap_type }}

app/templates/lookup.html

@@ -4,7 +4,7 @@
 
     <p>Interact with an ActivityPub object via its URL or look for a user using <i>@user@domain.tld</i></p>
 
-    <form action="{{ url_for("get_lookup") }}" method="GET">
+    <form class="form" action="{{ url_for("get_lookup") }}" method="GET">
         <input type="text" name="query" value="{{ query if query else "" }}">
         <input type="submit" value="Lookup">
     </form>

app/templates/remote_follow.html

@@ -4,7 +4,7 @@
 {% include "header.html" %}
 
 <h2>Remotely follow {{ local_actor.display_name }}</h2>
-<form action="{{ url_for("post_remote_follow") }}" method="POST">
+<form class="form" action="{{ url_for("post_remote_follow") }}" method="POST">
     <input type="hidden" name="csrf_token" value="{{remote_follow_csrf_token}}">
     <input type="text" name="profile" placeholder="you@instance.tld">
     <input type="submit" value="Follow">

app/templates/utils.html

@@ -11,7 +11,7 @@
     {{ embed_csrf_token() }}
     {{ embed_redirect_url() }}
     <input type="hidden" name="ap_actor_id" value="{{ actor.ap_id }}">
-    <input type="submit" value="Follow">
+    <input type="submit" value="follow">
 </form>
 {% endmacro %}
 
@@ -20,7 +20,7 @@
     {{ embed_csrf_token() }}
     {{ embed_redirect_url() }}
     <input type="hidden" name="ap_object_id" value="{{ ap_object_id }}">
-    <input type="submit" value="Like">
+    <input type="submit" value="like">
 </form>
 {% endmacro %}
 
@@ -29,7 +29,7 @@
     {{ embed_csrf_token() }}
     {{ embed_redirect_url() }}
     <input type="hidden" name="ap_object_id" value="{{ ap_object_id }}">
-    <input type="submit" value="Bookmark">
+    <input type="submit" value="bookmark">
 </form>
 {% endmacro %}
 
@@ -38,7 +38,7 @@
     {{ embed_csrf_token() }}
     {{ embed_redirect_url() }}
     <input type="hidden" name="ap_object_id" value="{{ ap_object_id }}">
-    <input type="submit" value="Unbookmark">
+    <input type="submit" value="unbookmark">
 </form>
 {% endmacro %}
 
@@ -47,7 +47,7 @@
     {{ embed_csrf_token() }}
     {{ embed_redirect_url() }}
     <input type="hidden" name="ap_object_id" value="{{ ap_object_id }}">
-    <input type="submit" value="Pin">
+    <input type="submit" value="pin">
 </form>
 {% endmacro %}
 
@@ -56,7 +56,7 @@
     {{ embed_csrf_token() }}
     {{ embed_redirect_url() }}
     <input type="hidden" name="ap_object_id" value="{{ ap_object_id }}">
-    <input type="submit" value="Unpin">
+    <input type="submit" value="unpin">
 </form>
 {% endmacro %}
 
@@ -65,7 +65,7 @@
     {{ embed_csrf_token() }}
     {{ embed_redirect_url() }}
     <input type="hidden" name="ap_object_id" value="{{ ap_object_id }}">
-    <input type="submit" value="Delete">
+    <input type="submit" value="delete">
 </form>
 {% endmacro %}
 
@@ -74,7 +74,7 @@
     {{ embed_csrf_token() }}
     {{ embed_redirect_url() }}
     <input type="hidden" name="ap_object_id" value="{{ ap_object_id }}">
-    <input type="submit" value="Share" {% if disabled %}title="Cannot share non-public content" disabled{% endif %}>
+    <input type="submit" value="share" {% if disabled %}title="Cannot share non-public content" disabled{% endif %}>
 </form>
 {% endmacro %}
 
@@ -111,36 +111,40 @@
 {% macro admin_reply_button(ap_object_id) %}
 <form action="/admin/new"  method="GET">
 <input type="hidden" name="in_reply_to" value="{{ ap_object_id }}">
-<button type="submit">Reply</button>
+<button type="submit">reply</button>
 </form> 
 {% endmacro %}
 
 {% macro admin_profile_button(ap_actor_id) %}
 <form action="{{ url_for("admin_profile") }}"  method="GET">
 <input type="hidden" name="actor_id" value="{{ ap_actor_id }}">
-<button type="submit">Profile</button>
+<button type="submit">profile</button>
 </form> 
 {% endmacro %}
 
 {% macro admin_expand_button(ap_object_id) %}
 <form action="{{ url_for("admin_object") }}"  method="GET">
 <input type="hidden" name="ap_id" value="{{ ap_object_id }}">
-<button type="submit">Expand</button>
+<button type="submit">expand</button>
 </form> 
 {% endmacro %}
 
 {% macro display_box_filters(route) %}
-<p>Filter by
+<nav class="flexbox">
+<ul>
+    <li>Filter by</li>
 {% for ap_type in ["Note", "Like", "Announce", "Follow"] %}
-<a style="margin-right:12px;" href="{{ url_for(route) }}?filter_by={{ ap_type }}">
-    {% if request.query_params.filter_by == ap_type %}
-    <strong>{{ ap_type }}</strong>
-    {% else %}
-    {{ ap_type }}
-    {% endif %}</a>
-{% endfor %}.
-{% if request.query_params.filter_by %}<a href="{{ url_for(route) }}">Reset filter</a>{% endif %}</p>
-</p>
+    <li><a href="{{ url_for(route) }}?filter_by={{ ap_type }}" {% if request.query_params.filter_by == ap_type %}class="active"{% endif %}>
+        {{ ap_type }}
+        </a>
+    </li>
+{% endfor %}
+{% if request.query_params.filter_by %}
+    <li>
+        <a href="{{ url_for(route) }}">Reset filter</a>
+    </li>
+{% endif %}
+</nav>
 {% endmacro %}
 
 {% macro display_actor(actor, actors_metadata) %}
@@ -156,11 +160,11 @@
 </div>
 {% if is_admin and metadata %}
 <div>
-    <nav class="flexbox">
+    <nav class="flexbox actor-metadata">
     <ul>
             {% if metadata.is_following %}
                 <li>already following</li>
-                <li>{{ admin_undo_button(metadata.outbox_follow_ap_id, "Unfollow")}}</li>
+                <li>{{ admin_undo_button(metadata.outbox_follow_ap_id, "unfollow")}}</li>
             {% elif metadata.is_follow_request_sent %}
                 <li>follow request sent</li>
             {% else %}
@@ -289,9 +293,9 @@
         <strong>{{ object.actor.display_name }}</strong>
         <a href="{{ object.actor.url}}" class="actor-handle p-author h-card">{{ object.actor.handle }}</a>
         <span class="activity-date" title="{{ object.ap_published_at.isoformat() }}">
-            {{ object.visibility.value }}
             <a href="{{ object.url }}" class="u-url u-uid"><time class="dt-published" datetime="{{ object.ap_published_at }}">{{ object.ap_published_at | timeago }}</time></a>
         </span>
+        {% if is_admin %}<span class="object-visibility">{{ object.visibility.value }}</span>{% endif %}
         {% if object.summary %}
         <p class="p-summary">{{ object.summary | clean_html(object) | safe }}</p>
         {% endif %}
@@ -314,72 +318,74 @@
     {{ display_attachments(object) }}
   </div>
 
-  <div class="activity-bar">
+  <nav class="flexbox activity-bar">
+    <ul>
     {% if object.is_from_outbox %}
-    <div class="bar-item">
+    <li>
         <div class="comment-count">{{ object.likes_count }} like{{ object.likes_count | pluralize }}</div>
-    </div>
+    </li>
     
-    <div class="bar-item">
+    <li>
         <div class="retweet-count">{{ object.announces_count }} share{{ object.announces_count | pluralize }}</div>
-    </div>
+    </li>
 
-    <div class="bar-item">
+    <li>
         <div class="retweet-count">{{ object.replies_count }} repl{{ object.replies_count | pluralize("y", "ies") }}</div>
-    </div>
+    </li>
 
     {% if is_admin %}
-    <div class="bar-item">
+    <li>
         {{ admin_delete_button(object.ap_id) }}
-    </div>
-    <div class="bar-item">
+    </li>
+    <li>
         {{ admin_reply_button(object.ap_id) }}
-    </div>
-    <div class="bar-item">
+    </li>
+    <li>
         {% if object.is_pinned %}
             {{ admin_unpin_button(object.ap_id) }}
         {% else %}
             {{ admin_pin_button(object.ap_id) }}
         {% endif %}
-    </div>
+    </li>
     {% endif %}
     {% endif %}
 
     {% if object.is_from_inbox %}
-            <div class="bar-item">
+            <li>
             {% if object.liked_via_outbox_object_ap_id %}
-                {{ admin_undo_button(object.liked_via_outbox_object_ap_id, "Unlike") }}
+                {{ admin_undo_button(object.liked_via_outbox_object_ap_id, "unlike") }}
             {% else %}
                 {{ admin_like_button(object.ap_id) }}
             {% endif %}
-            </div>
-            <div class="bar-item">
+            </li>
+            <li>
             {% if object.is_bookmarked %}
                 {{ admin_unbookmark_button(object.ap_id) }}
             {% else %}
                 {{ admin_bookmark_button(object.ap_id) }}
             {% endif %}
-            </div>
-            <div class="bar-item">
+            </li>
+            <li>
             {% if object.announced_via_outbox_object_ap_id %}
-                {{ admin_undo_button(object.liked_via_outbox_object_ap_id, "Unshare") }}
+                {{ admin_undo_button(object.liked_via_outbox_object_ap_id, "unshare") }}
             {% else %}
                 {{ admin_announce_button(object.ap_id, disabled=object.visibility not in [visibility_enum.PUBLIC, visibility_enum.UNLISTED]) }}
             {% endif %}
-            </div>
-            <div class="bar-item">
+            </li>
+            <li>
                 {{ admin_reply_button(object.ap_id) }}
-            </div>
-            <div class="bar-item">
+            </li>
+            <li>
                 {{ admin_profile_button(object.actor.ap_id) }}
-            </div>
-            <div class="bar-item">
+            </li>
+            <li>
                 {{ admin_expand_button(object.ap_id) }}
-            </div>
+            </li>
 
 
     {% endif %} 
-  </div>
+    </ul>
+    </nav>
 </div>
 {% endif %}
 {% endmacro %}