From ed55b9c7069e7f6d53c12ab068e708567a9baeb6 Mon Sep 17 00:00:00 2001 From: Niklan Date: Mon, 30 Sep 2024 20:23:27 +0500 Subject: [PATCH] WIP on new theme --- .../components/content/comment/comment.css | 3 ++ .../laszlo/components/ui/icon/icons/edit.svg | 1 + .../laszlo/components/ui/icon/icons/reply.svg | 1 + .../laszlo/components/ui/icon/icons/trash.svg | 1 + app/Drupal/laszlo/laszlo.theme | 8 ++++ .../laszlo/src/Hook/Theme/PreprocessLinks.php | 30 +++++++++++++ .../content/comment/links--comment.html.twig | 43 +++++++++++++------ 7 files changed, 74 insertions(+), 13 deletions(-) create mode 100644 app/Drupal/laszlo/components/ui/icon/icons/edit.svg create mode 100644 app/Drupal/laszlo/components/ui/icon/icons/reply.svg create mode 100644 app/Drupal/laszlo/components/ui/icon/icons/trash.svg create mode 100644 app/Drupal/laszlo/src/Hook/Theme/PreprocessLinks.php diff --git a/app/Drupal/laszlo/components/content/comment/comment.css b/app/Drupal/laszlo/components/content/comment/comment.css index cbf78189..302a1b55 100644 --- a/app/Drupal/laszlo/components/content/comment/comment.css +++ b/app/Drupal/laszlo/components/content/comment/comment.css @@ -2,6 +2,9 @@ padding: var(--spacing-6); border-radius: var(--spacing-2); background: var(--color-surface-container-low); + display: flex; + flex-direction: column; + gap: var(--spacing-4); } .comment__body { diff --git a/app/Drupal/laszlo/components/ui/icon/icons/edit.svg b/app/Drupal/laszlo/components/ui/icon/icons/edit.svg new file mode 100644 index 00000000..53692861 --- /dev/null +++ b/app/Drupal/laszlo/components/ui/icon/icons/edit.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/Drupal/laszlo/components/ui/icon/icons/reply.svg b/app/Drupal/laszlo/components/ui/icon/icons/reply.svg new file mode 100644 index 00000000..6e0d3136 --- /dev/null +++ b/app/Drupal/laszlo/components/ui/icon/icons/reply.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/Drupal/laszlo/components/ui/icon/icons/trash.svg b/app/Drupal/laszlo/components/ui/icon/icons/trash.svg new file mode 100644 index 00000000..b1270ae2 --- /dev/null +++ b/app/Drupal/laszlo/components/ui/icon/icons/trash.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/Drupal/laszlo/laszlo.theme b/app/Drupal/laszlo/laszlo.theme index 392a1583..c65f084d 100644 --- a/app/Drupal/laszlo/laszlo.theme +++ b/app/Drupal/laszlo/laszlo.theme @@ -7,6 +7,7 @@ use Drupal\laszlo\Hook\Theme\PreprocessComment; use Drupal\laszlo\Hook\Theme\PreprocessInput; use Drupal\laszlo\Hook\Theme\PreprocessLaszloPageFooter; use Drupal\laszlo\Hook\Theme\PreprocessLaszloPageHeader; +use Drupal\laszlo\Hook\Theme\PreprocessLinks; use Drupal\laszlo\Hook\Theme\PreprocessNode; use Drupal\laszlo\Hook\Theme\PreprocessPage; use Drupal\laszlo\Hook\Theme\ThemeSuggestionsTaxonomyTermAlter; @@ -81,4 +82,11 @@ function laszlo_theme_suggestions_taxonomy_term_alter(array &$suggestions, array */ function laszlo_preprocess_comment(array &$variables): void { \Drupal::classResolver(PreprocessComment::class)($variables); +} + +/** + * Implements hook_preprocess_HOOK(). + */ +function laszlo_preprocess_links(array &$variables): void { + \Drupal::classResolver(PreprocessLinks::class)($variables); } \ No newline at end of file diff --git a/app/Drupal/laszlo/src/Hook/Theme/PreprocessLinks.php b/app/Drupal/laszlo/src/Hook/Theme/PreprocessLinks.php new file mode 100644 index 00000000..3fd214b2 --- /dev/null +++ b/app/Drupal/laszlo/src/Hook/Theme/PreprocessLinks.php @@ -0,0 +1,30 @@ + NULL, + 'links__comment' => $this->preprocessComment($variables), + }; + } + + private function preprocessComment(array &$variables): void { + $links_to_simplify = ['comment-delete', 'comment-edit', 'comment-reply']; + + foreach ($links_to_simplify as $link_to_simplify) { + if (array_key_exists($link_to_simplify, $variables['links'])) { + $key = \str_replace('-', '_', $link_to_simplify); + $variables[$key] = [ + 'label' => $variables['links'][$link_to_simplify]['text'], + 'url' => $variables['links'][$link_to_simplify]['link']['#url']->toString(), + ]; + } + } + } + +} diff --git a/app/Drupal/laszlo/templates/content/comment/links--comment.html.twig b/app/Drupal/laszlo/templates/content/comment/links--comment.html.twig index 4a369cbe..95ffd5cd 100644 --- a/app/Drupal/laszlo/templates/content/comment/links--comment.html.twig +++ b/app/Drupal/laszlo/templates/content/comment/links--comment.html.twig @@ -1,13 +1,30 @@ - - {%- for item in links -%} - - {%- if item.link -%} - {{ item.link }} - {%- elseif item.text_attributes -%} - {{ item.text }} - {%- else -%} - {{ item.text }} - {%- endif -%} - - {%- endfor -%} - \ No newline at end of file +{% if comment_reply %} + {{ _self.action(comment_reply.label, comment_reply.url, 'reply') }} +{% endif %} +{% if comment_edit %} + {{ _self.action(comment_edit.label, comment_edit.url, 'edit') }} +{% endif %} +{% if comment_delete %} + {{ _self.action(comment_delete.label, comment_delete.url, 'trash', 'danger') }} +{% endif %} + +{% macro action(label, href, icon, color = 'primary') %} + {% embed 'laszlo:button' with { + attributes: create_attribute({ + 'class': ['comment-action'], + }), + variant: 'text', + color, + href, + label, + icon, + size: 'small', + } only %} + {% block start_icon %} + {% include 'laszlo:icon' with { icon } only %} + {% endblock %} + {% block children %} + {{ label }} + {% endblock %} + {% endembed %} +{% endmacro %} \ No newline at end of file