[TWIG] Fix empty accessibility menu anchor, accesskey anchors placement

[CSS] Dark theme hover/focus border, settings page form visibility

components/RightPanel/RightPanel.php

@@ -0,0 +1,41 @@
+<?php
+
+declare(strict_types = 1);
+
+// {{{ License
+// This file is part of GNU social - https://www.gnu.org/software/social
+//
+// GNU social is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// GNU social is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU Affero General Public License for more details.
+//
+// You should have received a copy of the GNU Affero General Public License
+// along with GNU social.  If not, see <http://www.gnu.org/licenses/>.
+// }}}
+
+namespace Component\RightPanel;
+
+use App\Core\Event;
+use App\Core\Modules\Component;
+
+class RightPanel extends Component
+{
+    /**
+     * Output our dedicated stylesheet
+     *
+     * @param array $styles stylesheets path
+     *
+     * @return bool hook value; true means continue processing, false means stop
+     */
+    public function onEndShowStyles(array &$styles, string $route): bool
+    {
+        $styles[] = 'components/Right/assets/css/view.css';
+        return Event::next;
+    }
+}

components/RightPanel/templates/right_panel/view.html.twig

@@ -0,0 +1,35 @@
+{% block rightpanel %}
+    <label class="panel-right-icon" for="panel-right-toggle" aria-hidden="true"
+           tabindex="-1">{{ icon('notes', 'icon icon-right') | raw }}</label>
+    <input type="checkbox" id="panel-right-toggle" aria-hidden="true" tabindex="-1">
+
+    <a id="anchor-right-panel" class="anchor-hidden" title="{{ 'Press tab to access selected region!' | trans }}"></a>
+    <div class="header-panel section-panel-right accessibility-target">
+        <aside class="panel-content">
+
+            {% set blocks = handle_event('AppendRightPostingBlock', request) %}
+            {% if blocks['post_form'] is defined %}
+                <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 }}
+                        </summary>
+                    </details>
+
+                    <div class="section-form">
+                        <fieldset>
+                            {{ form(blocks['post_form']) }}
+                        </fieldset>
+                    </div>
+                </section>
+            {% endif %}
+
+            {% set current_path = app.request.get('_route') %}
+            {% for block in handle_event('AppendRightPanelBlock', {'path': current_path, 'vars': right_panel_vars | default }) %}
+                {{ block | raw }}
+            {% endfor %}
+
+        </aside>
+    </div>
+{% endblock rightpanel %}