[PLUGINS][AttachmentCollections] Fix template

[PLUGINS][AttachmentShowRelated] Fix template

[CSS] Fix section-subtitle-details children padding issues

[COMPONENTS][Posting] Remove unnecessary colon

Overall polish of existing plugins templates
This commit is contained in:
Eliseu Amaro 2021-12-25 17:31:16 +00:00
parent ce3b677833
commit 7891461d36
Signed by: eliseuamaro
GPG Key ID: 96DA09D4B97BC2D5
8 changed files with 109 additions and 78 deletions

View File

@ -103,7 +103,7 @@ class Posting extends Component
$form_params[] = ['visibility', ChoiceType::class, ['label' => _m('Visibility:'), 'multiple' => false, 'expanded' => false, 'data' => 'public', 'choices' => [_m('Public') => 'public', _m('Instance') => 'instance', _m('Private') => 'private']]]; $form_params[] = ['visibility', ChoiceType::class, ['label' => _m('Visibility:'), 'multiple' => false, 'expanded' => false, 'data' => 'public', 'choices' => [_m('Public') => 'public', _m('Instance') => 'instance', _m('Private') => 'private']]];
$form_params[] = ['content', TextareaType::class, ['label' => _m('Content:'), 'data' => $initial_content, 'attr' => ['placeholder' => _m($placeholder)], 'constraints' => [new Length(['max' => Common::config('site', 'text_limit')])]]]; $form_params[] = ['content', TextareaType::class, ['label' => _m('Content:'), 'data' => $initial_content, 'attr' => ['placeholder' => _m($placeholder)], 'constraints' => [new Length(['max' => Common::config('site', 'text_limit')])]]];
$form_params[] = ['attachments', FileType::class, ['label' => _m('Attachments:'), 'multiple' => true, 'required' => false, 'invalid_message' => _m('Attachment not valid.')]]; $form_params[] = ['attachments', FileType::class, ['label' => _m('Attachments:'), 'multiple' => true, 'required' => false, 'invalid_message' => _m('Attachment not valid.')]];
$form_params[] = FormFields::language($actor, $context_actor, label: _m('Note language:'), help: _m('The selected language will be federated and added as a lang attribute, preferred language can be set up in settings')); $form_params[] = FormFields::language($actor, $context_actor, label: _m('Note language'), help: _m('The selected language will be federated and added as a lang attribute, preferred language can be set up in settings'));
if (\count($available_content_types) > 1) { if (\count($available_content_types) > 1) {
$form_params[] = ['content_type', ChoiceType::class, $form_params[] = ['content_type', ChoiceType::class,

View File

@ -23,6 +23,7 @@ declare(strict_types = 1);
* *
* @package GNUsocial * @package GNUsocial
* @category Plugin * @category Plugin
*
* @author Phablulo <phablulo@gmail.com> * @author Phablulo <phablulo@gmail.com>
* @copyright 2018-2019, 2021 Free Software Foundation, Inc http://www.fsf.org * @copyright 2018-2019, 2021 Free Software Foundation, Inc http://www.fsf.org
* @license https://www.gnu.org/licenses/agpl.html GNU AGPL v3 or later * @license https://www.gnu.org/licenses/agpl.html GNU AGPL v3 or later
@ -30,25 +31,25 @@ declare(strict_types = 1);
namespace Plugin\AttachmentCollections; namespace Plugin\AttachmentCollections;
use App\Core\Form;
use App\Core\Event;
use App\Core\DB\DB; use App\Core\DB\DB;
use App\Util\Common; use App\Core\Event;
use App\Entity\Feed; use App\Core\Form;
use App\Util\Nickname;
use App\Util\Formatting;
use App\Entity\LocalUser;
use App\Core\Router\Router;
use App\Core\Modules\Plugin;
use function App\Core\I18n\_m; use function App\Core\I18n\_m;
use App\Core\Modules\Plugin;
use App\Core\Router\RouteLoader; use App\Core\Router\RouteLoader;
use Symfony\Component\HttpFoundation\Request; use App\Core\Router\Router;
use App\Entity\Feed;
use App\Entity\LocalUser;
use App\Util\Common;
use App\Util\Formatting;
use App\Util\Nickname;
use Plugin\AttachmentCollections\Controller as C; use Plugin\AttachmentCollections\Controller as C;
use Plugin\AttachmentCollections\Entity\Collection; use Plugin\AttachmentCollections\Entity\Collection;
use Plugin\AttachmentCollections\Entity\CollectionEntry; use Plugin\AttachmentCollections\Entity\CollectionEntry;
use Symfony\Component\Form\Extension\Core\Type\TextType;
use Symfony\Component\Form\Extension\Core\Type\SubmitType;
use Symfony\Component\Form\Extension\Core\Type\ChoiceType; use Symfony\Component\Form\Extension\Core\Type\ChoiceType;
use Symfony\Component\Form\Extension\Core\Type\SubmitType;
use Symfony\Component\Form\Extension\Core\Type\TextType;
use Symfony\Component\HttpFoundation\Request;
class AttachmentCollections extends Plugin class AttachmentCollections extends Plugin
{ {
@ -56,21 +57,25 @@ class AttachmentCollections extends Plugin
{ {
// View all collections by actor id and nickname // View all collections by actor id and nickname
$r->connect( $r->connect(
id: 'collections_view_by_actor_id', uri_path: '/actor/{id<\d+>}/collections', id: 'collections_view_by_actor_id',
target: [C\Controller::class, 'collectionsViewByActorId'] uri_path: '/actor/{id<\d+>}/collections',
target: [C\Controller::class, 'collectionsViewByActorId'],
); );
$r->connect( $r->connect(
id: 'collections_view_by_nickname', uri_path: '/@{nickname<' . Nickname::DISPLAY_FMT . '>}/collections', id: 'collections_view_by_nickname',
target: [C\Controller::class, 'collectionsByActorNickname'] uri_path: '/@{nickname<' . Nickname::DISPLAY_FMT . '>}/collections',
target: [C\Controller::class, 'collectionsByActorNickname'],
); );
// View notes from a collection by actor id and nickname // View notes from a collection by actor id and nickname
$r->connect( $r->connect(
id: 'collection_notes_view_by_actor_id', uri_path: '/actor/{id<\d+>}/collections/{cid<\d+>}', id: 'collection_notes_view_by_actor_id',
target: [C\Controller::class, 'collectionNotesViewByActorId'] uri_path: '/actor/{id<\d+>}/collections/{cid<\d+>}',
target: [C\Controller::class, 'collectionNotesViewByActorId'],
); );
$r->connect( $r->connect(
id: 'collection_notes_view_by_nickname', uri_path: '/@{nickname<' . Nickname::DISPLAY_FMT . '>}/collections/{cid<\d+>}', id: 'collection_notes_view_by_nickname',
target: [C\Controller::class, 'collectionNotesByNickname'] uri_path: '/@{nickname<' . Nickname::DISPLAY_FMT . '>}/collections/{cid<\d+>}',
target: [C\Controller::class, 'collectionNotesByNickname'],
); );
return Event::next; return Event::next;
} }
@ -92,13 +97,17 @@ class AttachmentCollections extends Plugin
*/ */
public function onAppendRightPanelBlock($vars, Request $request, &$res): bool public function onAppendRightPanelBlock($vars, Request $request, &$res): bool
{ {
if ($vars['path'] !== 'attachment_show') return Event::next; if ($vars['path'] !== 'attachment_show') {
return Event::next;
}
$user = Common::user(); $user = Common::user();
if (\is_null($user)) return Event::next; if (\is_null($user)) {
return Event::next;
}
$colls = DB::dql( $colls = DB::dql(
'select coll from Plugin\AttachmentCollections\Entity\Collection coll where coll.actor_id = :id', 'select coll from Plugin\AttachmentCollections\Entity\Collection coll where coll.actor_id = :id',
['id' => $user->getId()] ['id' => $user->getId()],
); );
// add to collection form // add to collection form
@ -112,9 +121,9 @@ class AttachmentCollections extends Plugin
. 'inner join attachment_collection collection ' . 'inner join attachment_collection collection '
. 'with collection.id = entry.collection_id ' . 'with collection.id = entry.collection_id '
. 'where entry.attachment_id = :aid and collection.actor_id = :id', . 'where entry.attachment_id = :aid and collection.actor_id = :id',
['aid' => $attachment_id, 'id' => $user->getId()] ['aid' => $attachment_id, 'id' => $user->getId()],
); );
$already_selected = \array_map(fn ($x) => $x['collection_id'], $already_selected); $already_selected = array_map(fn ($x) => $x['collection_id'], $already_selected);
$add_form = Form::create([ $add_form = Form::create([
['collections', ChoiceType::class, [ ['collections', ChoiceType::class, [
'choices' => $choices, 'choices' => $choices,
@ -125,7 +134,7 @@ class AttachmentCollections extends Plugin
return ['selected' => 'selected']; return ['selected' => 'selected'];
} }
return []; return [];
} },
]], ]],
['add', SubmitType::class, [ ['add', SubmitType::class, [
'label' => _m('Add to collections'), 'label' => _m('Add to collections'),
@ -135,12 +144,11 @@ class AttachmentCollections extends Plugin
]], ]],
]); ]);
$add_form->handleRequest($request); $add_form->handleRequest($request);
if ($add_form->isSubmitted() && $add_form->isValid()) { if ($add_form->isSubmitted() && $add_form->isValid()) {
$collections = $add_form->getData()['collections']; $collections = $add_form->getData()['collections'];
$removed = \array_filter($already_selected, fn ($x) => !\in_array($x, $collections)); $removed = array_filter($already_selected, fn ($x) => !\in_array($x, $collections));
$added = \array_filter($collections, fn ($x) => !\in_array($x, $already_selected)); $added = array_filter($collections, fn ($x) => !\in_array($x, $already_selected));
if (\count($removed)) { if (\count($removed)) {
DB::dql( DB::dql(
'delete from Plugin\AttachmentCollections\Entity\CollectionEntry entry ' 'delete from Plugin\AttachmentCollections\Entity\CollectionEntry entry '
@ -150,10 +158,10 @@ class AttachmentCollections extends Plugin
// prevent user from deleting something (s)he doesn't own: // prevent user from deleting something (s)he doesn't own:
. 'and collection.actor_id = :id' . 'and collection.actor_id = :id'
. ')', . ')',
['aid' => $attachment_id, 'id' => $user->getId(), 'ids' => $removed] ['aid' => $attachment_id, 'id' => $user->getId(), 'ids' => $removed],
); );
} }
$collection_ids = \array_map(fn ($x) => $x->getId(), $colls); $collection_ids = array_map(fn ($x) => $x->getId(), $colls);
foreach ($added as $cid) { foreach ($added as $cid) {
// prevent user from putting something in a collection (s)he doesn't own: // prevent user from putting something in a collection (s)he doesn't own:
if (\in_array($cid, $collection_ids)) { if (\in_array($cid, $collection_ids)) {
@ -168,10 +176,10 @@ class AttachmentCollections extends Plugin
// add to new collection form // add to new collection form
$create_form = Form::create([ $create_form = Form::create([
['name', TextType::class, [ ['name', TextType::class, [
'label' => _m('Collection name'), 'label' => _m('Add to a new collection'),
'attr' => [ 'attr' => [
'placeholder' => _m('Name'), 'placeholder' => _m('New collection name'),
'required' => 'required' 'required' => 'required',
], ],
'data' => '', 'data' => '',
]], ]],
@ -198,14 +206,13 @@ class AttachmentCollections extends Plugin
DB::flush(); DB::flush();
} }
$res[] = Formatting::twigRenderFile( $res[] = Formatting::twigRenderFile(
'AttachmentCollections/widget.html.twig', 'AttachmentCollections/widget.html.twig',
[ [
'colls' => $colls, 'colls' => $colls,
'add_form' => $add_form->createView(), 'add_form' => $add_form->createView(),
'create_form' => $create_form->createView(), 'create_form' => $create_form->createView(),
] ],
); );
return Event::next; return Event::next;
} }

View File

@ -1,17 +1,21 @@
<section class="section-widget section-widget-padded attachment-collections"> <section class="section-widget attachment-collections">
<details class="section-widget-title-details" title="Expand if you want to access more options."> <details class="section-widget-title-details" title="Expand if you want to access more options.">
<summary class="section-title-summary"> <summary class="section-title-summary">
<h2>{% trans %}Add to collection{% endtrans %}</h2> <h2>{% trans %}Add to collection{% endtrans %}</h2>
{{ icon('arrow-down', 'icon icon-details-open') | raw }} {{ icon('arrow-down', 'icon icon-details-open') | raw }}
</summary> </summary>
<fieldset class="section-form">
{{ form(add_form) }} {{ form(add_form) }}
<br/> </fieldset>
<details class="section-widget-subtitle-details" title="Expand if you want to access more options.">
<details class="section-widget-subtitle-details section-padding" title="Expand if you want to access more options.">
<summary class="section-subtitle-summary"> <summary class="section-subtitle-summary">
<h3>{% trans %}More options{% endtrans %}</h3> <strong>{% trans %}Other options{% endtrans %}</strong>
{{ icon('arrow-down', 'icon icon-details-close') | raw }} {{ icon('arrow-down', 'icon icon-details-close') | raw }}
</summary> </summary>
<fieldset class="section-form">
{{ form(create_form) }} {{ form(create_form) }}
</fieldset>
</details> </details>
</details> </details>
</section> </section>

View File

@ -2,7 +2,9 @@
<section class="section-widget section-padding"> <section class="section-widget section-padding">
<div class="section-title"> <div class="section-title">
<h2 class="heading-no-margin">
{{ 'Notes related' | trans }} {{ 'Notes related' | trans }}
</h2>
</div> </div>
{% for note in related_notes %} {% for note in related_notes %}

View File

@ -1,6 +1,8 @@
<section class="section-widget section-widget-padded"> <section class="section-widget section-padding">
<div class="section-title"> <div class="section-title">
{{ 'Tags for this attachment' | trans }} <h2 class="heading-no-margin">
{{ 'Attachment tags' | trans }}
</h2>
</div> </div>
{% for tag in related_tags %} {% for tag in related_tags %}

View File

@ -4,6 +4,9 @@
@import url("widgets/buttons.css"); @import url("widgets/buttons.css");
@import url("widgets/sections.css"); @import url("widgets/sections.css");
html {
scroll-margin-top: var(--xxl);
}
@media(prefers-color-scheme:dark) { @media(prefers-color-scheme:dark) {
select:not([multiple]) { select:not([multiple]) {
@ -53,8 +56,8 @@
top: var(--s); top: var(--s);
left: var(--s); left: var(--s);
} }
html { .heading-no-margin {
scroll-margin-top: var(--xxl); margin-bottom: initial;
} }
.page-header { .page-header {
z-index: 1; z-index: 1;

View File

@ -109,7 +109,7 @@ textarea {
padding: 6px 8px !important; padding: 6px 8px !important;
border-radius: var(--s); border-radius: var(--s);
border: 2px solid var(--border) !important; border: 2px solid var(--border) !important;
width: inherit; width: auto;
max-width: border-box !important; max-width: border-box !important;
} }
button, button,

View File

@ -42,6 +42,9 @@
margin-right: 5px; margin-right: 5px;
border-radius: 2px; border-radius: 2px;
} }
.section-title {
font-weight: 700;
}
.section-widget { .section-widget {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -66,32 +69,34 @@
margin-left: unset; margin-left: unset;
} }
.section-widget-button-like { .section-widget-button-like {
border-radius: var(--s); font-family: 'Poppins', sans-serif;
padding: 6px 10px;
margin-top: 6px;
cursor: pointer;
float: right;
align-self: end;
font-family: 'Open Sans',sans-serif;
font-weight: 700; font-weight: 700;
} display: block;
.section-widget-subtitle-details :not(summary,svg,strong) { width: max-content;
border-radius: var(--s); align-self: end;
background: var(--gradient); background: var(--gradient);
padding: 6px 10px; padding: 6px 8px;
border-radius: var(--s);
border: 2px solid var(--border);
} }
.section-widget-title-details summary{ .section-widget-title-details summary{
font-weight: 700; padding: 6px 12px;
}
.section-widget-subtitle-details summary {
padding: 2px 8px;
}
.section-widget-subtitle-summary + * {
border-radius: var(--s);
background: var(--gradient);
padding: 2px 8px;
} }
.section-widget-subtitle-details summary { .section-widget-subtitle-details summary {
border: 2px solid var(--border); border: 2px solid var(--border);
margin-bottom: var(--s);
} }
.section-widget-title-details summary, .section-widget-title-details summary,
.section-widget-subtitle-details summary { .section-widget-subtitle-details summary {
align-items: center; align-items: center;
border-radius: var(--s); border-radius: var(--s);
padding: 6px 10px;
background: var(--gradient) !important; background: var(--gradient) !important;
} }
.section-widget-subtitle-details[open] svg, .section-widget-subtitle-details[open] svg,
@ -108,6 +113,9 @@
.section-title-summary { .section-title-summary {
display: flex; display: flex;
} }
.section-subtitle-summary ~ [class|="form-row"] {
padding: var(--s);
}
.section-subtitle-summary strong, .section-subtitle-summary strong,
.section-title-summary h2 { .section-title-summary h2 {
margin-right: auto; margin-right: auto;
@ -133,12 +141,17 @@
font-weight: bold; font-weight: bold;
} }
.form-row { .form-row {
display: flex;
flex-direction: column;
margin-bottom: var(--s); margin-bottom: var(--s);
} }
.form-row-widget { .form-row-widget {
display: block; display: block;
width: 100%; width: 100%;
} }
.form-row-help {
margin-bottom: unset;
}
textarea.form-row-widget { textarea.form-row-widget {
height: 7rem; height: 7rem;
resize: vertical; resize: vertical;