Tweak small notifications more
FossilOrigin-Name: 9df6d19e067310f606cc0503f189584ef85186a49d506fbe869a41b3a1fd30d6
This commit is contained in:
nekobit
parent
399fe70f08
commit
37f23ec3a2
|
|
@ -311,7 +311,8 @@ table.ui-table td
|
|||
}
|
||||
|
||||
|
||||
.menu.menu-compact .btn-menu
|
||||
.menu.menu-compact .btn-menu,
|
||||
.status-compact .menu-container .menu .btn-menu
|
||||
{
|
||||
font-size: 11px;
|
||||
}
|
||||
|
|
@ -1112,9 +1113,9 @@ input[type=checkbox].hidden:not(:checked) + .reply-form
|
|||
font-size: 14px;
|
||||
}
|
||||
|
||||
.status-compact .status.status-notification
|
||||
.status-compact.status.status-notification
|
||||
{
|
||||
padding: 7px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.status-compact .pfp-td img
|
||||
|
|
@ -1128,31 +1129,66 @@ input[type=checkbox].hidden:not(:checked) + .reply-form
|
|||
position: absolute;
|
||||
background-color: #eaecf0;
|
||||
border-radius: 50%;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border: 1px solid #cacaca;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
padding: 3px;
|
||||
top: 17px;
|
||||
left: -17px;
|
||||
top: 15px;
|
||||
left: -15px;
|
||||
z-index: 8;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.status-compact .action-icon svg
|
||||
{
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
stroke: #40455a;
|
||||
/* Little fix */
|
||||
position: relative;
|
||||
top: -1px;
|
||||
}
|
||||
|
||||
/* .status .notification-text-group-with-icon .username */
|
||||
/* { */
|
||||
/* /\* UNDO *\/ */
|
||||
/* vertical-align: unset; */
|
||||
/* } */
|
||||
.status-compact .poster-stats .alignend
|
||||
{
|
||||
background-color: rgb(234, 236, 240);
|
||||
/* Hack - Fix the right padding regarding the icon being a little wider than it should */
|
||||
padding: 1px 0px 1px 5px;
|
||||
}
|
||||
|
||||
.status-compact .menu-container .menu
|
||||
{
|
||||
margin-left: -80px;
|
||||
}
|
||||
|
||||
.status-compact.notification-unread::before
|
||||
{
|
||||
content:"";
|
||||
position: absolute;
|
||||
z-index: 0;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: linear-gradient(135deg, rgba(255,0,0,1) 0%, rgba(0,0,0,0) 50%, rgba(0,0,0,0) 100%);
|
||||
}
|
||||
|
||||
.status-compact .in-reply-to-id
|
||||
{
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.status-compact .in-reply-to-icon
|
||||
{
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
/* Pixel perfect... */
|
||||
top: -2px;
|
||||
}
|
||||
|
||||
.status-compact .status-buttons
|
||||
{
|
||||
float: initial;
|
||||
}
|
||||
|
||||
.status .status-content
|
||||
{
|
||||
|
|
|
|||
|
|
@ -43,7 +43,7 @@
|
|||
<form class="searchbox-container" action="$prefix/search" method="get">
|
||||
<span class="menu-container search-menu-dropdown">
|
||||
[% icon('search-menu') %]
|
||||
<div class="menu menu-options menu-compact">
|
||||
<div class="menu menu-search menu-compact">
|
||||
<ul>
|
||||
<li>
|
||||
<label>
|
||||
|
|
|
|||
|
|
@ -23,12 +23,14 @@
|
|||
<table class="status-table ui-table">
|
||||
<tr>
|
||||
<td class="pfp-td {{%s:is_cat}} {{%s:is_bun}}">
|
||||
<img src="[% status.account.avatar %]" loading="lazy">
|
||||
<img src="[% compact && interacted_with ?
|
||||
boost.account.avatar || notif.account.avatar : status.account.avatar %]" loading="lazy">
|
||||
</td>
|
||||
<td class="status-info">
|
||||
<div class="poster-stats">
|
||||
<span class="username">
|
||||
[% format_username(status.account) %]
|
||||
[% format_username(compact && interacted_with ?
|
||||
boost || notif.account : status.account) %]
|
||||
</span>
|
||||
|
||||
[% IF interacted_with && compact %]
|
||||
|
|
@ -88,14 +90,16 @@
|
|||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<label for="status-toggle-[% status.id %]-[% unique_toggle_id %]" class="status-view"></label>
|
||||
[% UNLESS compact %]
|
||||
<label for="status-toggle-[% status.id %]-[% unique_toggle_id %]" class="status-view"></label>
|
||||
[% END %]
|
||||
</span>
|
||||
</div>
|
||||
<div class="status-data">
|
||||
[%# Note: The id may actually (99.5% of the time) be the acct %]
|
||||
[% IF status.in_reply_to_id %]
|
||||
<span class="in-reply-to">
|
||||
<svg class="in-reply-to-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M14 9l6 6-6 6"/><path d="M4 4v7a4 4 0 0 0 4 4h11"/></svg> <a class="in-reply-to-id" href="$prefix/status/[% status.in_reply_to_id %]#[% status.in_reply_to_id %]"> <span class="in-reply-to-text">In reply to</span> <span class="acct">[% status.pleroma.in_reply_to_account_acct || status.in_reply_to_account_id %]</span></a>
|
||||
<svg class="in-reply-to-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M14 9l6 6-6 6"/><path d="M4 4v7a4 4 0 0 0 4 4h11"/></svg> <a class="in-reply-to-id" href="$prefix/status/[% status.in_reply_to_id %]#[% status.in_reply_to_id %]"> [% UNLESS compact %]<span class="in-reply-to-text">In reply to</span>[% END %] <span class="acct">[% status.pleroma.in_reply_to_account_acct || status.in_reply_to_account_id %]</span></a>
|
||||
</span>
|
||||
[% END %]
|
||||
<span class="status-content">
|
||||
|
|
@ -132,7 +136,7 @@
|
|||
<input class="itype" type="hidden" name="itype" value="[% IF status.favourited %]un[% END %]like">
|
||||
<label class="pointer statbtn like-btn[% IF status.favourited %] interacted[% END %]">
|
||||
[% icon('like') %]
|
||||
[% IF status.favourites_count %]
|
||||
[% IF status.favourites_count && !compact %]
|
||||
<span class="count">[% status.favourites_count %]</span>
|
||||
[% END %]
|
||||
<input class="hidden" type="submit" value="Like">
|
||||
|
|
@ -142,7 +146,7 @@
|
|||
<input class="itype" type="hidden" name="itype" value="[% IF status.reblogged %]un[% END %]repeat">
|
||||
<label class="repeat-btn pointer statbtn[% IF status.reblogged %] interacted[% END %]">
|
||||
[% icon('repeat') %]
|
||||
[% IF status.reblogs_count %]
|
||||
[% IF status.reblogs_count && !compact %]
|
||||
<span class="count">[% status.reblogs_count %]</span>
|
||||
[% END %]
|
||||
<input class="hidden" type="submit" value="Repeat">
|
||||
|
|
@ -167,19 +171,21 @@
|
|||
</div>
|
||||
[% END %]
|
||||
[%# Put these at the end, incase someone wants to move status icons to the beginning (this makes it easier %]
|
||||
<a target="_parent" href="$prefix/status/[% status.id %]#[% status.id %]" class="pointer statbtn view-btn">
|
||||
[% icon('expand') %]
|
||||
</a>
|
||||
<span class="status-meta">
|
||||
<a href="#[% status.id %]" title="[% time_to_str(status.created_at) %]" class="time">[%- rel_to_str(status.created_at) -%]</a>
|
||||
[% IF status.application && status.application.name && !notif %]
|
||||
[% IF status.application.url %]
|
||||
<a class="application-name" href="[% status.application.url %]">[% status.application.name %]</a>
|
||||
[% ELSE %]
|
||||
<span class="application-name">[% status.application.name %]</span>
|
||||
[% UNLESS compact %]
|
||||
<a target="_parent" href="$prefix/status/[% status.id %]#[% status.id %]" class="pointer statbtn view-btn">
|
||||
[% icon('expand') %]
|
||||
</a>
|
||||
<span class="status-meta">
|
||||
<a href="#[% status.id %]" title="[% time_to_str(status.created_at) %]" class="time">[%- rel_to_str(status.created_at) -%]</a>
|
||||
[% IF status.application && status.application.name && !notif %]
|
||||
[% IF status.application.url %]
|
||||
<a class="application-name" href="[% status.application.url %]">[% status.application.name %]</a>
|
||||
[% ELSE %]
|
||||
<span class="application-name">[% status.application.name %]</span>
|
||||
[% END %]
|
||||
[% END %]
|
||||
[% END %]
|
||||
</span>
|
||||
</span>
|
||||
[% END %]
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
|
|
|
|||
Loading…
Reference in New Issue