[CARDS][Note] Removed incorrect aria attributes, polished Note card

This commit is contained in:
Eliseu Amaro 2022-02-15 11:35:48 +00:00 committed by Diogo Peralta Cordeiro
parent be0a2d27e2
commit 9d9abf8afb
Signed by: diogo
GPG Key ID: 18D2D35001FBFAB0
4 changed files with 34 additions and 20 deletions

View File

@ -321,7 +321,12 @@ embed header {
font-size: 0.937rem; font-size: 0.937rem;
background: var(--gradient-backwards); background: var(--gradient-backwards);
padding: 4px 8px; padding: 4px 8px;
border-radius: 0 0 var(--s) 0; border-radius: var(--s) 0 var(--s) var(--s);
}
.note-complementary:empty,
.note-complementary:-moz-only-whitespace {
display: none !important;
} }
.note-complementary-info a { .note-complementary-info a {

View File

@ -16,8 +16,8 @@
--shadow: 0 5px 20px -10px rgba(255,255,255,0.1)!important; --shadow: 0 5px 20px -10px rgba(255,255,255,0.1)!important;
--shadow-inset-accent: inset 0 0 0 2px var(--accent); --shadow-inset-accent: inset 0 0 0 2px var(--accent);
--background-checkerboard: repeating-conic-gradient(#ffffff66 0 90deg,#ffffff33 0 180deg) 0 0/40px 40px round; --background-checkerboard: repeating-conic-gradient(#ffffff66 0 90deg,#ffffff33 0 180deg) 0 0/40px 40px round;
--gradient: linear-gradient(5deg,var(--border) -33%,transparent 66%)!important; --gradient: linear-gradient(5deg,var(--border) -33%,transparent 66%) !important;
--gradient-backwards: linear-gradient(-5deg,var(--border) -33%,transparent 66%)!important; --gradient-backwards: linear-gradient(-5deg,var(--border) -33%,transparent 66%) !important;
} }
} }
@ -28,10 +28,10 @@
--background-card: #f0f0f0; --background-card: #f0f0f0;
--border: #C2C2C2; --border: #C2C2C2;
--accent: #a22430; --accent: #a22430;
--shadow: 0 25px 42px -10px rgba(0,0,0,0.1)!important; --shadow: 0 5px 20px -10px rgba(0,0,0,0.1)!important;
--shadow-inset-accent: inset 0 0 0 2px var(--accent); --shadow-inset-accent: inset 0 0 0 2px var(--accent);
--background-checkerboard: repeating-conic-gradient(#ffffff66 0 90deg,#ffffff33 0 180deg) 0 0/40px 40px round; --background-checkerboard: repeating-conic-gradient(#ffffff66 0 90deg,#ffffff33 0 180deg) 0 0/40px 40px round;
--gradient: linear-gradient(10deg,var(--background-hard) 0,transparent 60%)!important; --gradient: linear-gradient(10deg,var(--background-hard) 0,transparent) !important;
--gradient-backwards: linear-gradient(290deg,var(--background-hard) 0,var(--background-card) 100%)!important; --gradient-backwards: linear-gradient(290deg,var(--background-hard) 0,var(--background-card) 100%) !important;
} }
} }

View File

@ -93,8 +93,8 @@
{% block note_author %} {% block note_author %}
{# Microformat's h-card properties indicates a face icon is a "u-logo" #} {# Microformat's h-card properties indicates a face icon is a "u-logo" #}
<a href="{{ actor_url }}" class="note-author-url u-url" role="doc-credit" <a href="{{ actor_url }}" class="note-author-url u-url"
title="{% trans %} %nickname%'s profile {% endtrans %}"> title="{{ nickname }}{{ '\'s profile' | trans }}">
{% if fullname is not null %}{{ fullname }}{% else %}{{ nickname }}{% endif %} {% if fullname is not null %}{{ fullname }}{% else %}{{ nickname }}{% endif %}
</a> </a>
@ -128,16 +128,17 @@
{% endblock note_info %} {% endblock note_info %}
{% block note_complementary %} {% block note_complementary %}
{% set complementary_info_array = handle_event('AppendCardNote', { 'note': note, 'request': app.request }) %}
<aside <aside
title="{{ 'Additional note context information and actions' | trans }}" title="{{ 'Additional note context information and actions' | trans }}"
class="note-complementary" class="note-complementary">
role="complementary"> {% if complementary_info_array is not empty %}
<div class="note-complementary-info"> <div class="note-complementary-info">
{% for complementary_info in handle_event('AppendCardNote', { 'note': note, 'request': app.request }) %} {% for complementary_info in complementary_info_array %}
{% set actor_count = complementary_info['actors'] | length %} {% set actor_count = complementary_info['actors'] | length %}
{% set counter = 0 %} {% set counter = 0 %}
{% for complementary_info_actor in complementary_info['actors'] %} {% for complementary_info_actor in complementary_info['actors'] %}
<span role="doc-acknowledgments"> <span>
{% if app.user is not null %} {% if app.user is not null %}
{% if complementary_info_actor is defined and complementary_info_actor.getNickname() != app.user.nickname %} {% 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> <a href="{{ complementary_info_actor.getUrl() }}">{{ complementary_info_actor.getNickname() }}{% if actor_count > 1 and counter < actor_count - 2 %}{{ ', ' | trans }}{% endif %}</a>
@ -167,6 +168,7 @@
</span> </span>
{% endfor %} {% endfor %}
</div> </div>
{% endif %}
{{ block('note_actions', 'cards/blocks/note.html.twig') }} {{ block('note_actions', 'cards/blocks/note.html.twig') }}
</aside> </aside>
{% endblock note_complementary %} {% endblock note_complementary %}

View File

@ -8,12 +8,11 @@
{% set note_language = note.getNoteLanguageShortDisplay() %} {% set note_language = note.getNoteLanguageShortDisplay() %}
<article <article
id="{{ 'note-anchor-' ~ note.getId() }}" tabindex="0"
class="h-entry hentry note" title="{{'A note by actor' | trans}} {{ nickname }}"
lang="{{ note.getLanguageLocale() }}" id="{{ 'note-anchor-' ~ note.getId() }}"
title="{{'A note by actor' | trans}} {{ nickname }}" class="h-entry hentry note"
role="article" lang="{{ note.getLanguageLocale() }}">
tabindex="0">
{{ block('note_sidebar', 'cards/blocks/note.html.twig') }} {{ block('note_sidebar', 'cards/blocks/note.html.twig') }}
<div class="note-wrapper"> <div class="note-wrapper">
@ -21,7 +20,11 @@
<section class="e-content entry-content note-content" title="{{ 'Note\'s main content' | trans }}"> <section class="e-content entry-content note-content" title="{{ 'Note\'s main content' | trans }}">
{% if extra.parent is defined %} {% if extra.parent is defined %}
<em class="note-replies-parent" title="{{'Reply with depth' | trans}} {{ extra.depth }}" tabindex="0"> <em
tabindex="0"
class="note-replies-parent"
title="{{'This is a reply with depth: ' | trans}} {{ extra.depth }}"
aria-flowto="note-anchor-">
{{'in reply to' | trans}} {{ extra.parent | raw }} {{'in reply to' | trans}} {{ extra.parent | raw }}
</em> </em>
{% endif %} {% endif %}
@ -46,7 +49,11 @@
{% set actor_url = actor.getUrl() %} {% set actor_url = actor.getUrl() %}
{% set mention = mention(actor) %} {% set mention = mention(actor) %}
<article class="h-entry hentry note" lang={{ note.getLanguageLocale() }}> <article
tabindex="0"
title="{{'A note by actor' | trans}} {{ nickname }}"
class="h-entry hentry note"
lang={{ note.getLanguageLocale() }}>
{{ block('note_sidebar', 'cards/blocks/note.html.twig') }} {{ block('note_sidebar', 'cards/blocks/note.html.twig') }}
<div class="note-wrapper"> <div class="note-wrapper">
<header class="note-info"> <header class="note-info">