tabs => spaces
This commit is contained in:
Sol Fisher Romanoff
parent
35613d9c86
commit
3289b410b3
GPG Key ID:
4D8B07C18F31ACBD
|
|
@ -161,7 +161,7 @@ defp represent(%Activity{object: %Object{data: data}} = activity, selected) do
|
|||
selected: selected,
|
||||
counts: get_counts(activity),
|
||||
id: activity.id,
|
||||
visibility: Visibility.get_visibility(activity.object)
|
||||
visibility: Visibility.get_visibility(activity.object)
|
||||
}
|
||||
end
|
||||
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
<link rel="stylesheet" href="/static-fe/static-fe.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="background-image"></div>
|
||||
<div class="background-image"></div>
|
||||
<nav>
|
||||
<div class="inner-nav">
|
||||
<a class="site-brand" href="/">
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
<div class="status-heading">
|
||||
<div class="heading-left">
|
||||
<h4 class="username">
|
||||
<%= raw Formatter.emojify(@user.name, @user.emoji) %>
|
||||
<%= raw Formatter.emojify(@user.name, @user.emoji) %>
|
||||
</h4>
|
||||
<a href="<%= (@user.uri || @user.ap_id) %>" class="account-name">
|
||||
<%= @user.nickname %>
|
||||
|
|
@ -29,17 +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 %>
|
||||
<%= 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">
|
||||
|
|
@ -49,16 +49,16 @@
|
|||
<summary>Show content</summary>
|
||||
<% end %>
|
||||
<div class="status-body">
|
||||
<%= raw @content %>
|
||||
<%= if length(@attachment) > 0 do %>
|
||||
<div class="attachments">
|
||||
<%= for %{"name" => name, "url" => [url | _]} <- @attachment do %>
|
||||
<%= render("_attachment.html", %{name: name, url: url["href"],
|
||||
mediaType: fetch_media_type(url)}) %>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<%= raw @content %>
|
||||
<%= if length(@attachment) > 0 do %>
|
||||
<div class="attachments">
|
||||
<%= for %{"name" => name, "url" => [url | _]} <- @attachment do %>
|
||||
<%= render("_attachment.html", %{name: name, url: url["href"],
|
||||
mediaType: fetch_media_type(url)}) %>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<%= if @title != "" do %>
|
||||
</details>
|
||||
<% end %>
|
||||
|
|
@ -66,23 +66,23 @@
|
|||
<!-- <div class="emoji-reactions"></div> -->
|
||||
<div class="status-actions">
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
|
|
|
|||
|
|
@ -20,21 +20,21 @@
|
|||
</div>
|
||||
<div class="bottom-line">
|
||||
<%= link "@#{@user.nickname}", to: (@user.uri || @user.ap_id), class: "account-name" %>
|
||||
<%= if @user.is_admin && @user.show_role do %>
|
||||
<span class="user-role">Admin</span>
|
||||
<% end %>
|
||||
<%= if @user.is_moderator && @user.show_role do %>
|
||||
<span class="user-role">Moderator</span>
|
||||
<% end %>
|
||||
<%= if @user.actor_type == "Service" do %>
|
||||
<span class="user-role">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 %>
|
||||
<%= if @user.is_admin && @user.show_role do %>
|
||||
<span class="user-role">Admin</span>
|
||||
<% end %>
|
||||
<%= if @user.is_moderator && @user.show_role do %>
|
||||
<span class="user-role">Moderator</span>
|
||||
<% end %>
|
||||
<%= if @user.actor_type == "Service" do %>
|
||||
<span class="user-role">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>
|
||||
|
|
|
|||
|
|
@ -2,10 +2,10 @@
|
|||
:root {
|
||||
--icon: rgba(100, 103, 108, 1);
|
||||
--alertNeutral: rgba(185, 185, 186, 0.5);
|
||||
--wallpaper: rgba(11, 16, 23, 1);
|
||||
--wallpaper: rgba(11, 16, 23, 1);
|
||||
--alertNeutralText: rgba(255, 255, 255, 1);
|
||||
--avatarShadow: 0px 1px 8px 0px rgba(0, 0, 0, 0.7);
|
||||
--loadPostsSelected: rgba(23, 34, 46, 1);
|
||||
--loadPostsSelected: rgba(23, 34, 46, 1);
|
||||
--loadPostsSelectedText: rgba(185, 185, 186, 1);
|
||||
--profileBg: rgba(7, 12, 17, 1);
|
||||
--profileTint: rgba(15, 22, 30, 0.5);
|
||||
|
|
@ -34,7 +34,7 @@ :root {
|
|||
|
||||
html {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
body {
|
||||
|
|
@ -46,7 +46,7 @@ body {
|
|||
}
|
||||
|
||||
.background-image {
|
||||
position: fixed;
|
||||
position: fixed;
|
||||
height: 100%;
|
||||
top: 3.5em;
|
||||
z-index: -1000;
|
||||
|
|
@ -54,7 +54,7 @@ .background-image {
|
|||
right: -20px;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-color: var(--wallpaper);
|
||||
background-color: var(--wallpaper);
|
||||
background-image: var(--background-image);
|
||||
background-position: 50%;
|
||||
}
|
||||
|
|
@ -65,13 +65,13 @@ a {
|
|||
}
|
||||
|
||||
nav {
|
||||
position: sticky;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 3.5em;
|
||||
background-color: var(--topBar);
|
||||
box-shadow: var(--topBarShadow);
|
||||
z-index: 2000;
|
||||
z-index: 2000;
|
||||
}
|
||||
|
||||
.inner-nav {
|
||||
|
|
@ -153,7 +153,7 @@ .left-side {
|
|||
|
||||
.right-side {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.status-heading {
|
||||
|
|
@ -173,7 +173,7 @@ .heading-left {
|
|||
}
|
||||
|
||||
.heading-right {
|
||||
display: flex;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
|
|
@ -235,7 +235,7 @@ .status-actions {
|
|||
.status-actions > * {
|
||||
max-width: 4em;
|
||||
flex: 1;
|
||||
display: flex;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.status-summary {
|
||||
|
|
@ -310,7 +310,7 @@ .button-default {
|
|||
|
||||
.button-default:hover {
|
||||
box-shadow: var(--btnHoverShadow);
|
||||
cursor: pointer;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.user-bio {
|
||||
|
|
@ -402,19 +402,19 @@ .profile .status-container {
|
|||
}
|
||||
|
||||
.user-role {
|
||||
color: var(--alertNeutralText);
|
||||
background-color: var(--alertNeutral);
|
||||
margin: 0 0.35em;
|
||||
padding: 0 0.25em;
|
||||
border-radius: 2px;
|
||||
color: var(--alertNeutralText);
|
||||
background-color: var(--alertNeutral);
|
||||
margin: 0 0.35em;
|
||||
padding: 0 0.25em;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.bottom-line {
|
||||
display: flex;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.load-posts {
|
||||
display: block;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
height: 3.5em;
|
||||
line-height: 3.5em;
|
||||
|
|
@ -424,43 +424,43 @@ .load-posts {
|
|||
}
|
||||
|
||||
.load-posts:hover {
|
||||
background-color: var(--loadPostsSelected);
|
||||
background-color: var(--loadPostsSelected);
|
||||
color: var(--loadPostsSelectedText);
|
||||
}
|
||||
|
||||
.attachments {
|
||||
margin-top: 0.5em;
|
||||
flex-direction: row;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
align-content: stretch;
|
||||
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;
|
||||
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;
|
||||
width: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.attachment:not(:last-child) {
|
||||
margin-right: 0.5em;
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
|
||||
.fa-icon {
|
||||
height: 0.875em;
|
||||
margin-left: 0.5em;
|
||||
margin-right: 0.3em;
|
||||
fill: var(--icon);
|
||||
height: 0.875em;
|
||||
margin-left: 0.5em;
|
||||
margin-right: 0.3em;
|
||||
fill: var(--icon);
|
||||
}
|
||||
|
||||
.status-actions .fa-icon {
|
||||
height: 1.1em;
|
||||
height: 1.1em;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue