diff --git a/lib/pleroma/web/templates/static_fe/static_fe/_attachment.html.eex b/lib/pleroma/web/templates/static_fe/static_fe/_attachment.html.eex
index 4853e7f4b..2a3c8c0ca 100644
--- a/lib/pleroma/web/templates/static_fe/static_fe/_attachment.html.eex
+++ b/lib/pleroma/web/templates/static_fe/static_fe/_attachment.html.eex
@@ -1,8 +1,10 @@
-<%= case @mediaType do %>
-<% "audio" -> %>
-
-<% "video" -> %>
-
-<% _ -> %>
-
-<% end %>
+
+ <%= case @mediaType do %>
+ <% "audio" -> %>
+
+ <% "video" -> %>
+
+ <% _ -> %>
+
+ <% end %>
+
diff --git a/lib/pleroma/web/templates/static_fe/static_fe/_notice.html.eex b/lib/pleroma/web/templates/static_fe/static_fe/_notice.html.eex
index 7393b7ee2..572025caa 100644
--- a/lib/pleroma/web/templates/static_fe/static_fe/_notice.html.eex
+++ b/lib/pleroma/web/templates/static_fe/static_fe/_notice.html.eex
@@ -36,24 +36,20 @@
<%= raw @title %>
open<% end %>>
Show content
- <%= raw @content %>
-
- <% else %>
-
+ <%= raw @content %>
+ <%= if length(@attachment) > 0 do %>
+
<%= for %{"name" => name, "url" => [url | _]} <- @attachment do %>
- <%= if @sensitive do %>
-
- <%= Gettext.gettext("sensitive media") %>
-
- <%= render("_attachment.html", %{name: name, url: url["href"],
- mediaType: fetch_media_type(url)}) %>
-
-
- <% else %>
- <%= render("_attachment.html", %{name: name, url: url["href"],
- mediaType: fetch_media_type(url)}) %>
+ <%= render("_attachment.html", %{name: name, url: url["href"],
+ mediaType: fetch_media_type(url)}) %>
<% end %>
+
+ <% end %>
+
+ <%= if @title != "" do %>
+
<% end %>
diff --git a/priv/static/static-fe/static-fe.css b/priv/static/static-fe/static-fe.css
index 15a90021e..280e603e3 100644
--- a/priv/static/static-fe/static-fe.css
+++ b/priv/static/static-fe/static-fe.css
@@ -152,6 +152,7 @@ .left-side {
.right-side {
flex: 1;
+ min-width: 0;
}
.status-heading {
@@ -419,3 +420,29 @@ .load-posts:hover {
background-color: var(--loadPostsSelected);
color: var(--loadPostsSelectedText);
}
+
+.attachments {
+ margin-top: 0.5em;
+ flex-direction: row;
+ display: flex;
+ flex-wrap: nowrap;
+ align-content: stretch;
+}
+
+.attachment {
+ border: 1px solid var(--border);
+ border-radius: 3px;
+ display: flex;
+ flex-grow: 1;
+ justify-content: center;
+ min-width: 0;
+}
+
+.attachment > * {
+ width: 100%;
+ object-fit: contain;
+}
+
+.attachment:not(:last-child) {
+ margin-right: 0.5em;
+}