GNUsocial
/
gnu-social
4
0
Fork 1
Code Issues Releases Wiki Activity

[PLUGINS][Reply][Repeat][Favourite] Base template semantic rework. Reply, repeat and favourite respective classes are now assigned in their NoteHandlerPlugin.

This commit is contained in:
Eliseu Amaro 2021-09-07 15:23:41 +01:00 committed by Hugo Sales
parent ddd2ffe26a
commit 61071a6821
Signed by: someonewithpc
GPG Key ID: 7D0C7EAFC9D835A0
9 changed files with 53 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
plugins/Favourite/Favourite.php
View File

@ -66,9 +66,10 @@ class Favourite extends NoteHandlerPlugin
$form_fav = Form::create([
['submit_favourite', SubmitType::class,
[
'label' => $is_set ? _m('Note already favourite!.') : _m('Favourite this note.'),
'label' => ' ',
'attr' => [
'class' => $is_set ? 'note-actions-set' : 'note-actions-unset',
'class' => ($is_set ? 'note-actions-set' : 'note-actions-unset') . ' button-container favourite-button-container',
'title' => $is_set ? _m('Note already favourite!') : _m('Favourite this note!'),
],
],
],

4
plugins/Repeat/Repeat.php
View File

@ -29,6 +29,7 @@ use App\Util\Exception\RedirectException;
use Symfony\Component\Form\Extension\Core\Type\HiddenType;
use Symfony\Component\Form\Extension\Core\Type\SubmitType;
use Symfony\Component\HttpFoundation\Request;
use function App\Core\I18n\_m;
class Repeat extends NoteHandlerPlugin
{
@ -51,7 +52,8 @@ class Repeat extends NoteHandlerPlugin
[
'label' => ' ',
'attr' => [
'class' => $is_set ? 'note-actions-set' : 'note-actions-unset',
'class' => ($is_set ? 'note-actions-set' : 'note-actions-unset') . ' button-container repeat-button-container',
'title' => $is_set ? _m('Note already repeated!') : _m('Repeat this note!'),
],
],
],

3
plugins/Reply/Reply.php
View File

@ -64,7 +64,8 @@ class Reply extends NoteHandlerPlugin
[
'label' => ' ',
'attr' => [
'class' => 'note-actions-unset',
'class' => 'note-actions-unset button-container reply-button-container',
'title' => 'Reply to this note!',
],
],
],

24
public/assets/css/base.css
View File

@ -300,41 +300,35 @@ summary:hover .icon-details-open {
}
.button-container {
width: 1em !important;
height: 1em !important;
}
.button-container button {
all: unset;
border: none !important;
width: inherit !important;
height: inherit !important;
width: 1em !important;
height: 1em !important;
background-size: cover !important;
margin-left: 5px;
text-indent: -9999em;
text-transform: uppercase;
}
.button-container button:hover,
.button-container button:focus {
.button-container:hover,
.button-container:focus {
border: none !important;
background: var(--bg3) !important;
}
.favourite-button-container button {
text-indent: -9999em;
text-transform: uppercase;
.favourite-button-container {
-webkit-mask-image: url("../icons/heart.svg") !important;
-o-mask-image: url("../icons/heart.svg") !important;
-moz-mask-image: url("../icons/heart.svg") !important;
mask-image: url("../icons/heart.svg") !important;
}
.reply-button-container button {
.reply-button-container {
-webkit-mask-image: url("../icons/reply.svg") !important;
-o-mask-image: url("../icons/reply.svg") !important;
-moz-mask-image: url("../icons/reply.svg") !important;
mask-image: url("../icons/reply.svg") !important;
}
.repeat-button-container button {
.repeat-button-container {
-webkit-mask-image: url("../icons/repeat.svg") !important;
-o-mask-image: url("../icons/repeat.svg") !important;
-moz-mask-image: url("../icons/repeat.svg") !important;

6
src/Twig/Runtime.php
View File

@ -118,8 +118,10 @@ class Runtime implements RuntimeExtensionInterface, EventSubscriberInterface
public function isFirefox(): bool
{
$re = '/.*(?i)\bfirefox\b.*/m';
return preg_match(pattern: $re, subject: $this->request->headers->get('User-Agent')) === 1;
$re_has_chrome = '/.*(?i)\bchrome\b.*/m';
$re_has_gecko = '/.*(?i)\bgecko\b.*/m';
return (preg_match(pattern: $re_has_chrome, subject: $this->request->headers->get('User-Agent')) !== 1)
&& (preg_match(pattern: $re_has_gecko, subject: $this->request->headers->get('User-Agent')) === 1);
}
// ----------------------------------------------------------

32
templates/base.html.twig
View File

@ -30,12 +30,11 @@
{% endfor %}
</head>
<body class="bg" aria-live="polite">
<body class="bg">
<a id="anchor-menu" class="anchor-hidden"></a>
<aside class="accessibility-menu" tabindex="0" aria-roledescription="{{ 'Learn keybindings to select each of the main page areas.' | trans }}">
<aside class="accessibility-menu" tabindex="0">
<h2>{{ 'Select page section:' | trans }}</h2>
<br>
<p>
{% if is_firefox() == true %}
<em><kbd>Alt</kbd> + <kbd>Shift</kbd> + "access key"</em>
@ -44,23 +43,24 @@
{% endif %}
</p>
<ul>
<li><a href="#anchor-menu" accesskey="m">{{ 'This menu (press \'m\' to access).' | trans }}</a></li>
<li><a href="#anchor-left-panel" accesskey="h">{{ 'Left panel (press \'h\' to access).' | trans }}</a></li>
<li><a href="#anchor-main-content" accesskey="k">{{ 'Main content (press \'k\' to access).' | trans }}</a></li>
<li><a href="#anchor-main-page" accesskey="j">{{ 'Main page (press \'j\' to access).' | trans }}</a></li>
<li><a href="#anchor-right-panel" accesskey="l">{{ 'Right panel (press \'l\' to access).' | trans }}</a></li>
</ul>
<nav>
<ul>
<li><a href="#anchor-menu" accesskey="m">{{ 'This menu, (press \'m\' to access).' | trans }}</a></li>
<li><a href="#anchor-left-panel" accesskey="h">{{ 'Left panel (press \'h\' to access).' | trans }}</a></li>
<li><a href="#anchor-main-content" accesskey="k">{{ 'Main content (press \'k\' to access).' | trans }}</a></li>
<li><a href="#anchor-main-page" accesskey="j">{{ 'Main page (press \'j\' to access).' | trans }}</a></li>
<li><a href="#anchor-right-panel" accesskey="l">{{ 'Right panel (press \'l\' to access).' | trans }}</a></li>
</ul>
</nav>
</aside>
{% block header %}
<header id='header' role="banner">
{{ block("leftpanel", "stdgrid.html.twig") }}
<a id="anchor-main-page" class="anchor-hidden"></a>
<a id='instance' href="{{ path('main_public') }}" tabindex="0" aria-roledescription="This instance name.">
<div aria-hidden="true">{{ icon('logo', 'icon icon-logo') | raw }}</div>
<h1> {{ config('site', 'name') }} </h1>
<a role="navigation" rel="help" id="anchor-main-page" class="anchor-hidden"></a>
<a id='instance' href="{{ path('main_public') }}" tabindex="0" title="{{ 'This instance\'s name. Access public timeline.' | trans }}">
<h1>{{ icon('logo', 'icon icon-logo') | raw }}{{ config('site', 'name') }} </h1>
</a>
{% if app.user %}
@ -70,8 +70,8 @@
{% endblock header %}
<div class="container">
<a id="anchor-main-content" class="anchor-hidden"></a>
<div class='content' aria-roledescription="Main content.">
<a role="navigation" rel="help" id="anchor-main-content" class="anchor-hidden"></a>
<div class='content'>
{% block nav %}{% endblock %}
{% block body %}{% endblock %}
{% block javascripts %}{% endblock javascripts %}

4
templates/network/public.html.twig
View File

@ -9,8 +9,8 @@
{% block body %}
{# Backwards compatibility with hAtom 0.1 #}
<main class="timeline" tabindex="0" role="main" aria-label={{ 'Main public timeline feed.' | trans }}>
<div class="h-feed hfeed notes" role="feed">
<main class="timeline" tabindex="0" role="feed">
<div class="h-feed hfeed notes">
{% if notes is defined and notes is not empty %}
{% for conversation in notes %}
{% include '/note/view.html.twig' with {'note': conversation['note'], 'have_user': have_user, 'replies': conversation['replies']} only %}

32
templates/note/view.html.twig
View File

@ -1,15 +1,12 @@
<article class="h-entry hentry note">
<div class="note-info" role="complementary">
<header class="note-info">
{% set nickname = note.getActorNickname() %}
{# TODO: this should link to the note's user profile? #}
<header class="note-author u-url" href="#" >
<h2 title='{{ 'This note author\'s nickname.' | trans }}' class="note-author u-url" href="#">
{# Microformat's h-card properties indicates a face icon is a "u-logo" #}
<img class="u-logo avatar" src="{{ note.getAvatarUrl() }}" alt="{{ nickname }}'s avatar" aria-hidden="true">
<label aria-roledescription={{ 'This note author nickname.' | trans }}>
{{ nickname }}
</label>
</header>
<img title='{{ 'This note author\'s avatar.' | trans }}' class="u-logo avatar" src="{{ note.getAvatarUrl() }}" alt="{{ nickname }}'s avatar" aria-hidden="true">{{ nickname }}
</h2>
{% set reply_to = note.getReplyToNickname() %}
{% if reply_to is not null and not skip_reply_to is defined %}
@ -17,33 +14,26 @@
{% endif %}
{% if app.user %}
<div class="note-actions" aria-roledescription="{{ 'Favourite, reply and recycle this note.' | trans }}">
<div class="note-actions">
{% if have_user %}
{% for current_action in get_note_actions(note) %}
{{ form_start(current_action) }}
{% if current_action.submit_favourite is defined %}
<span title="Favourite this note." class="button-container favourite-button-container"
{% if current_action.submit_favourite is defined %}{% endif %}>
{{ form_widget(current_action.submit_favourite) }}
</span>
{{ form_widget(current_action.submit_favourite) }}
{% endif %}
{% if current_action.submit_repeat is defined %}
<span title="Repeat this note." class="button-container repeat-button-container">
{{ form_widget(current_action.submit_repeat) }}
</span>
{{ form_widget(current_action.submit_repeat) }}
{% endif %}
{% if current_action.reply is defined %}
<span title="Reply to this note." class="button-container reply-button-container">
{{ form_widget(current_action.reply) }}
</span>
{{ form_widget(current_action.reply) }}
{% endif %}
{{ form_end(current_action) }}
{% endfor %}
{% endif %}
</div>
{% endif %}
</div>
<div class="e-content entry-content note-content" aria-roledescription="{{ 'The note content.' | trans }}">
</header>
<div class="e-content entry-content note-content" title="{{ 'This note\'s content.' | trans }}">
{% block markdown %}
{% apply markdown_to_html %}
{{ note.getContent() }}
@ -61,7 +51,7 @@
{% endfor %}
</div>
{% endif %}
<div class="note-links">
<div class="note-links" title="{{ 'Shared links in this note.' | trans }}">
{% for link in note.getLinks() %}
{% for block in handle_event('ViewLink', {'link': link, 'note': note}) %}
{{ block | raw }}

6
templates/sidepanel/right/right.html.twig
View File

@ -6,10 +6,10 @@
<aside class="panel-content">
{% if post_form is defined %}
<section class="section-widget" role="complementary" aria-label={{ 'Create a new note.' | trans }}>
<details class="section-title-details">
<section class="section-widget" title={{ 'Create a new note.' | trans }}>
<details class="section-title-details" title={{ 'Expand if you want to access more options.' | trans }}>
<summary class="section-title-summary">
{{ "Create a note" | trans }} {{ icon('arrow-down', 'icon icon-details-open') | raw }}
{{ "Create a note" | trans }}{{ icon('arrow-down', 'icon icon-details-open') | raw }}
</summary>
{% for tab in tabs %}