[CARDS][Note] Note's actions are now inside the same div as Note's complementary info, overall footprint of replies diminished
This commit is contained in:
parent
67a2387b31
commit
f6b19d2a0f
GPG Key ID:
96DA09D4B97BC2D5
|
|
@ -143,12 +143,28 @@
|
|||
background-color: var(--background-card);
|
||||
border-radius: var(--s);
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.h-entry .embed[class*="p-"] {
|
||||
padding: unset;
|
||||
}
|
||||
|
||||
.u-in-reply-to {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.u-in-reply-to > * {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.u-in-reply-to::before {
|
||||
content: '\201C';
|
||||
font-size: 32px;
|
||||
opacity: 0.66;
|
||||
margin-right: var(--s);
|
||||
}
|
||||
|
||||
.note-replies {
|
||||
margin-left: var(--xl);
|
||||
}
|
||||
|
|
@ -258,9 +274,8 @@ embed header {
|
|||
display: flex;
|
||||
flex-direction: initial;
|
||||
justify-content: flex-end;
|
||||
padding: 4px 8px;
|
||||
background: var(--gradient-backwards);
|
||||
border-radius: 0 0 var(--s) 0;
|
||||
flex: 1;
|
||||
align-items: center;
|
||||
}
|
||||
.note-actions > li {
|
||||
display: inline-block;
|
||||
|
|
@ -274,8 +289,6 @@ embed header {
|
|||
margin: unset;
|
||||
}
|
||||
.note-actions-extra-details summary {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
opacity: 0.5;
|
||||
}
|
||||
.note-actions-extra-details[open] > summary + * > a {
|
||||
|
|
@ -287,28 +300,33 @@ embed header {
|
|||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
.note-complementary {
|
||||
background: var(--gradient) !important;
|
||||
border-left: 1px solid var(--accent);
|
||||
font-size: .937rem;
|
||||
margin-bottom: 4px;
|
||||
margin-right: var(--s);
|
||||
padding-left: var(--s);
|
||||
border-radius: 0 0 0 var(--s);
|
||||
.note-end {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.note-complementary a {
|
||||
.note-complementary {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
font-size: .937rem;
|
||||
background: var(--gradient-backwards);
|
||||
padding: 4px 8px;
|
||||
border-radius: 0 0 var(--s) 0;
|
||||
}
|
||||
|
||||
.note-complementary-info a {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.note-complementary:last-of-type {
|
||||
margin-bottom: var(--s);
|
||||
.note-complementary-info span {
|
||||
display: block;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.note-content {
|
||||
border-radius: 0 0 var(--s) var(--s);
|
||||
display: block;
|
||||
padding: 0 4px 8px 0;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.note-replies-start {
|
||||
|
|
@ -368,7 +386,7 @@ embed header {
|
|||
|
||||
.note-wrapper {
|
||||
height: inherit;
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1280px) {
|
||||
|
|
|
|||
|
|
@ -27,14 +27,13 @@
|
|||
|
||||
{% if replies is defined and replies is not empty %}
|
||||
<section class="note-replies">
|
||||
<div class="note-replies-start"
|
||||
tabindex="0">{{ 'Replies to ' | trans }}{{ nickname }}{{ '\'s note' | trans }}</div>
|
||||
<div class="note-replies-start" tabindex="0" title="{{ 'Replies to ' | trans }}{{ nickname }}{{ '\'s note' | trans }}"></div>
|
||||
<div class="u-in-reply-to replies">
|
||||
{% for conversation in replies %}
|
||||
{{ noteView.note_vanilla(conversation['note'], conversation['replies']) }}
|
||||
<hr tabindex="0" title="{{ 'End of reply' | trans }}">
|
||||
{% endfor %}
|
||||
</div>
|
||||
<hr tabindex="0" title="{{ 'End of reply' | trans }}">
|
||||
</section>
|
||||
{% endif %}
|
||||
{% endblock note_replies %}
|
||||
|
|
@ -125,39 +124,43 @@
|
|||
</span>
|
||||
{% endblock note_info %}
|
||||
|
||||
{% block note_complementary_info %}
|
||||
{% for complementary_info in handle_event('AppendCardNote', { 'note': note, 'request': app.request }) %}
|
||||
<aside title="{{ 'Note\'s complementary information' | trans }}"
|
||||
class="note-complementary">
|
||||
{% set actor_count = complementary_info['actors'] | length %}
|
||||
{% set counter = 0 %}
|
||||
{% for complementary_info_actor in complementary_info['actors'] %}
|
||||
{% if app.user is not null %}
|
||||
{% if complementary_info_actor is defined and complementary_info_actor.getNickname() != app.user.nickname %}
|
||||
<a href="{{ complementary_info_actor.getUrl() }}">{{ complementary_info_actor.getNickname() }}{% if actor_count > 1 and counter < actor_count - 2 %}{{ ', ' | trans }}{% endif %}</a>
|
||||
{% if counter == actor_count - 2 %}
|
||||
{{ ' and ' | trans }}
|
||||
{% block note_complementary %}
|
||||
<aside title="{{ 'Note\'s complementary information' | trans }}" class="note-complementary">
|
||||
<div class="note-complementary-info">
|
||||
{% for complementary_info in handle_event('AppendCardNote', { 'note': note, 'request': app.request }) %}
|
||||
{% set actor_count = complementary_info['actors'] | length %}
|
||||
{% set counter = 0 %}
|
||||
{% for complementary_info_actor in complementary_info['actors'] %}
|
||||
<span>
|
||||
{% if app.user is not null %}
|
||||
{% if complementary_info_actor is defined and complementary_info_actor.getNickname() != app.user.nickname %}
|
||||
<a href="{{ complementary_info_actor.getUrl() }}">{{ complementary_info_actor.getNickname() }}{% if actor_count > 1 and counter < actor_count - 2 %}{{ ', ' | trans }}{% endif %}</a>
|
||||
{% if counter == actor_count - 2 %}
|
||||
{{ ' and ' | trans }}
|
||||
{% endif %}
|
||||
{% set counter = counter + 1 %}
|
||||
{% endif %}
|
||||
{% set counter = counter + 1 %}
|
||||
{% endif %}
|
||||
{% else %}
|
||||
{% if complementary_info_actor is defined %}
|
||||
<a href="{{ complementary_info_actor.getUrl() }}">{{ complementary_info_actor.getNickname() }}{% if actor_count > 1 and counter < actor_count - 2 %}{{ ', ' | trans }}{% endif %}</a>
|
||||
{% if counter == actor_count - 2 %}
|
||||
{{ ' and ' | trans }}
|
||||
{% else %}
|
||||
{% if complementary_info_actor is defined %}
|
||||
<a href="{{ complementary_info_actor.getUrl() }}">{{ complementary_info_actor.getNickname() }}{% if actor_count > 1 and counter < actor_count - 2 %}{{ ', ' | trans }}{% endif %}</a>
|
||||
{% if counter == actor_count - 2 %}
|
||||
{{ ' and ' | trans }}
|
||||
{% endif %}
|
||||
{% set counter = counter + 1 %}
|
||||
{% endif %}
|
||||
{% set counter = counter + 1 %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% if complementary_info['action'] is defined and not null and counter > 0 %}
|
||||
{% if counter > 1 %}
|
||||
{{ ' have ' | trans }}
|
||||
{% else %}
|
||||
{{ ' has ' | trans }}
|
||||
{% endif %}
|
||||
{{ complementary_info['action'] ~ ' this note' | trans }}
|
||||
{% endif %}
|
||||
</span>
|
||||
{% endfor %}
|
||||
{% if complementary_info['action'] is defined and not null and counter > 0 %}
|
||||
{% if counter > 1 %}
|
||||
{{ ' have ' | trans }}
|
||||
{% else %}
|
||||
{{ ' has ' | trans }}
|
||||
{% endif %}
|
||||
{{ complementary_info['action'] ~ ' this note' | trans }}
|
||||
{% endif %}
|
||||
</aside>
|
||||
{% endfor %}
|
||||
{% endblock note_complementary_info %}
|
||||
</div>
|
||||
{{ block('note_actions', 'cards/blocks/note.html.twig') }}
|
||||
</aside>
|
||||
{% endblock note_complementary %}
|
||||
|
|
@ -21,9 +21,8 @@
|
|||
{{ block('note_attachments', 'cards/blocks/note.html.twig') }}
|
||||
{{ block('note_links', 'cards/blocks/note.html.twig') }}
|
||||
</section>
|
||||
{{ block('note_complementary_info', 'cards/blocks/note.html.twig') }}
|
||||
{{ block('note_actions', 'cards/blocks/note.html.twig') }}
|
||||
</div>
|
||||
{{ block('note_complementary', 'cards/blocks/note.html.twig') }}
|
||||
</article>
|
||||
|
||||
{{ block('note_replies', 'cards/blocks/note.html.twig') }}
|
||||
|
|
|
|||
Loading…
Reference in New Issue