Add fontawesome icons

This commit is contained in:
Sol Fisher Romanoff 2022-10-25 00:26:13 +03:00
parent ffc70472d7
commit 922b02e879
No known key found for this signature in database
GPG key ID: 9D3F2B64F2341B62
4 changed files with 56 additions and 5 deletions

View file

@ -160,7 +160,8 @@ defp represent(%Activity{object: %Object{data: data}} = activity, selected) do
sensitive: data["sensitive"],
selected: selected,
counts: get_counts(activity),
id: activity.id
id: activity.id,
visibility: Visibility.get_visibility(activity.object)
}
end

View file

@ -29,6 +29,17 @@
<%= time_ago(@published) %>
</time>
</a>
<%= if @visibility == "public" do %>
<svg class="fa-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path d="M352 256c0 22.2-1.2 43.6-3.3 64H163.3c-2.2-20.4-3.3-41.8-3.3-64s1.2-43.6 3.3-64H348.7c2.2 20.4 3.3 41.8 3.3 64zm28.8-64H503.9c5.3 20.5 8.1 41.9 8.1 64s-2.8 43.5-8.1 64H380.8c2.1-20.6 3.2-42 3.2-64s-1.1-43.4-3.2-64zm112.6-32H376.7c-10-63.9-29.8-117.4-55.3-151.6c78.3 20.7 142 77.5 171.9 151.6zm-149.1 0H167.7c6.1-36.4 15.5-68.6 27-94.7c10.5-23.6 22.2-40.7 33.5-51.5C239.4 3.2 248.7 0 256 0s16.6 3.2 27.8 13.8c11.3 10.8 23 27.9 33.5 51.5c11.6 26 21 58.2 27 94.7zm-209 0H18.6C48.6 85.9 112.2 29.1 190.6 8.4C165.1 42.6 145.3 96.1 135.3 160zM8.1 192H131.2c-2.1 20.6-3.2 42-3.2 64s1.1 43.4 3.2 64H8.1C2.8 299.5 0 278.1 0 256s2.8-43.5 8.1-64zM194.7 446.6c-11.6-26-20.9-58.2-27-94.6H344.3c-6.1 36.4-15.5 68.6-27 94.6c-10.5 23.6-22.2 40.7-33.5 51.5C272.6 508.8 263.3 512 256 512s-16.6-3.2-27.8-13.8c-11.3-10.8-23-27.9-33.5-51.5zM135.3 352c10 63.9 29.8 117.4 55.3 151.6C112.2 482.9 48.6 426.1 18.6 352H135.3zm358.1 0c-30 74.1-93.6 130.9-171.9 151.6c25.5-34.2 45.2-87.7 55.3-151.6H493.4z"/>
</svg>
<% else %>
<%= if @visibility == "unlisted" do %>
<svg class="fa-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512">
<path d="M352 144c0-44.2 35.8-80 80-80s80 35.8 80 80v48c0 17.7 14.3 32 32 32s32-14.3 32-32V144C576 64.5 511.5 0 432 0S288 64.5 288 144v48H64c-35.3 0-64 28.7-64 64V448c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V256c0-35.3-28.7-64-64-64H352V144z"/>
</svg>
<% end %>
<% end %>
</div>
</div>
<div class="status-content">
@ -54,9 +65,24 @@
</div>
<!-- <div class="emoji-reactions"></div> -->
<div class="status-actions">
<div><%= @counts.replies %></div>
<div><%= @counts.announces %></div>
<div><%= @counts.likes %></div>
<div>
<svg class="fa-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path d="M205 34.8c11.5 5.1 19 16.6 19 29.2v64H336c97.2 0 176 78.8 176 176c0 113.3-81.5 163.9-100.2 174.1c-2.5 1.4-5.3 1.9-8.1 1.9c-10.9 0-19.7-8.9-19.7-19.7c0-7.5 4.3-14.4 9.8-19.5c9.4-8.8 22.2-26.4 22.2-56.7c0-53-43-96-96-96H224v64c0 12.6-7.4 24.1-19 29.2s-25 3-34.4-5.4l-160-144C3.9 225.7 0 217.1 0 208s3.9-17.7 10.6-23.8l160-144c9.4-8.5 22.9-10.6 34.4-5.4z"/>
</svg>
<span class="action-count"><%= @counts.replies %></span>
</div>
<div>
<svg class="fa-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512">
<path d="M272 416c17.7 0 32-14.3 32-32s-14.3-32-32-32H160c-17.7 0-32-14.3-32-32V192h32c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-64-64c-12.5-12.5-32.8-12.5-45.3 0l-64 64c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8l32 0 0 128c0 53 43 96 96 96H272zM304 96c-17.7 0-32 14.3-32 32s14.3 32 32 32l112 0c17.7 0 32 14.3 32 32l0 128H416c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l64 64c12.5 12.5 32.8 12.5 45.3 0l64-64c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8l-32 0V192c0-53-43-96-96-96L304 96z"/>
</svg>
<span class="action-count"><%= @counts.announces %></span>
</div>
<div>
<svg class="fa-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512">
<path d="M287.9 0C297.1 0 305.5 5.25 309.5 13.52L378.1 154.8L531.4 177.5C540.4 178.8 547.8 185.1 550.7 193.7C553.5 202.4 551.2 211.9 544.8 218.2L433.6 328.4L459.9 483.9C461.4 492.9 457.7 502.1 450.2 507.4C442.8 512.7 432.1 513.4 424.9 509.1L287.9 435.9L150.1 509.1C142.9 513.4 133.1 512.7 125.6 507.4C118.2 502.1 114.5 492.9 115.1 483.9L142.2 328.4L31.11 218.2C24.65 211.9 22.36 202.4 25.2 193.7C28.03 185.1 35.5 178.8 44.49 177.5L197.7 154.8L266.3 13.52C270.4 5.249 278.7 0 287.9 0L287.9 0zM287.9 78.95L235.4 187.2C231.9 194.3 225.1 199.3 217.3 200.5L98.98 217.9L184.9 303C190.4 308.5 192.9 316.4 191.6 324.1L171.4 443.7L276.6 387.5C283.7 383.7 292.2 383.7 299.2 387.5L404.4 443.7L384.2 324.1C382.9 316.4 385.5 308.5 391 303L476.9 217.9L358.6 200.5C350.7 199.3 343.9 194.3 340.5 187.2L287.9 78.95z"/>
</svg>
<span class="action-count"><%= @counts.likes %></span>
</div>
</div>
</div>
</div>

View file

@ -29,6 +29,12 @@
<%= if @user.actor_type == "Service" do %>
<span class="user-role"><%= gettext("Bot") %></span>
<% end %>
<%= if @user.is_locked do %>
<span>
<svg class="fa-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
<path d="M144 144v48H304V144c0-44.2-35.8-80-80-80s-80 35.8-80 80zM80 192V144C80 64.5 144.5 0 224 0s144 64.5 144 144v48h16c35.3 0 64 28.7 64 64V448c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V256c0-35.3 28.7-64 64-64H80z"/></svg>
</span>
<% end %>
</div>
</div>
</div>

View file

@ -1,5 +1,6 @@
/* pleroma-light and pleroma-dark themes from pleroma-fe */
:root {
--icon: rgba(100, 103, 108, 1);
--alertNeutral: rgba(185, 185, 186, 0.5);
--wallpaper: rgba(11, 16, 23, 1);
--alertNeutralText: rgba(255, 255, 255, 1);
@ -171,6 +172,11 @@ .heading-left {
display: flex;
}
.heading-right {
display: flex;
align-items: center;
}
.status-container .account-name {
min-width: 1.6em;
margin-right: 0.4em;
@ -228,7 +234,8 @@ .status-actions {
}
.status-actions > * {
max-width: 4em;
flex: 1
flex: 1;
display: flex;
}
.status-summary {
@ -446,3 +453,14 @@ .attachment > * {
.attachment:not(:last-child) {
margin-right: 0.5em;
}
.fa-icon {
height: 0.875em;
margin-left: 0.5em;
margin-right: 0.3em;
fill: var(--icon);
}
.status-actions .fa-icon {
height: 1.1em;
}