+
+
+ {{ content|without('field_top_images', 'field_teaser', 'field_area', 'field_department', 'field_type', 'field_content_sections') }}
+
+
+ {{ content.field_aside_block }}
+
+ Sagittis mattis scelerisque habitasse elit etiam lobortis accumsan. Dignissim ac sapien potenti ipsum nam penatibus leo. Facilisi potenti laoreet et scelerisque sem felis rutrum.
+BODY, + 'format' => 'filtered_html', + ]); + $paragraph->save(); + + $node = Node::create([ + 'type' => 'dialogue', + 'title' => 'Test Dialogue - proposals full', + 'status' => TRUE, + 'field_teaser' => 'Test teaser', + 'field_area' => [ + $this->getReference('area:Hele kommunen'), + ], + 'field_top_images' => [ + $this->getReference('media:Large1'), + $this->getReference('media:Large2'), + $this->getReference('media:Large3'), + ], + 'field_type' => [ + $this->getReference('type:Klima'), + ], + 'field_dialogue_proposal_category' => [ + $this->getReference('dialogue_proposal_categories:Grønne pladser'), + $this->getReference('dialogue_proposal_categories:Regnvandsopsamling'), + $this->getReference('dialogue_proposal_categories:Parkeringspladser for elbiler'), + $this->getReference('dialogue_proposal_categories:Vedvarende Energi'), + ], + 'field_dialogue_proposal_config' => [ + ['value' => 'public_proposals'], + ['value' => 'use_image_on_proposals'], + ['value' => 'use_map_on_proposals'], + ], + 'field_dialogue_proposal_location' => [ + 'type' => 'point', + 'data' => '{"type":"Feature","properties":[],"geometry":{"type":"Point","coordinates":[10.2118737466156,56.15312642194584]}}', + 'point' => '{"type":"FeatureCollection","crs":{"type":"name","properties":{"name":"urn:ogc:def:crs:EPSG::4326"}},"features":[{"type":"Feature","properties":{},"geometry":{"type":"Point","coordinates":[10.2118737466156,56.15312642194584]}}]}', + ], + 'field_dialogue_proposal_zoom' => 11, + 'field_content_sections' => [ + 'target_id' => $paragraph->id(), + 'target_revision_id' => $paragraph->getRevisionId(), + ], + ]); + + $node->save(); + $this->addReference('node:dialogue:Test Dialogue - proposals full', $node); + + $node = Node::create([ + 'type' => 'dialogue', + 'title' => 'Test Dialogue - proposals simple, private', + 'status' => TRUE, + 'field_teaser' => 'Test teaser', + 'field_area' => [ + $this->getReference('area:Hele kommunen'), + ], + 'field_top_images' => [ + $this->getReference('media:Large1'), + $this->getReference('media:Large2'), + $this->getReference('media:Large3'), + ], + 'field_type' => [ + $this->getReference('type:Klima'), + ], + 'field_dialogue_proposal_category' => [ + $this->getReference('dialogue_proposal_categories:Grønne pladser'), + $this->getReference('dialogue_proposal_categories:Biodiversitet Initiativer'), + $this->getReference('dialogue_proposal_categories:Cykelstier'), + $this->getReference('dialogue_proposal_categories:Regnvandsopsamling'), + $this->getReference('dialogue_proposal_categories:Parkeringspladser for elbiler'), + $this->getReference('dialogue_proposal_categories:Bæredygtig Belysning'), + $this->getReference('dialogue_proposal_categories:Energi Effektivisering'), + $this->getReference('dialogue_proposal_categories:Grønne Materialer'), + $this->getReference('dialogue_proposal_categories:Affaldshåndtering'), + $this->getReference('dialogue_proposal_categories:Vedvarende Energi'), + ], + 'field_dialogue_proposal_config' => [], + 'field_content_sections' => [ + 'target_id' => $paragraph->id(), + 'target_revision_id' => $paragraph->getRevisionId(), + ], + ]); + + $node->save(); + $this->addReference('node:dialogue:Test Dialogue - proposals simple, private', $node); + } + + /** + * {@inheritdoc} + */ + public function getDependencies() { + return [ + MediaFixture::class, + ParagraphFixture::class, + TermDialogueProposalCategoryFixture::class, + ]; + } + + /** + * {@inheritdoc} + */ + public function getGroups() { + return ['node']; + } + +} diff --git a/web/modules/custom/hoeringsportal_dialogue/modules/hoeringsportal_dialogue_fixtures/src/Fixture/DialogueLandingPageFixture.php b/web/modules/custom/hoeringsportal_dialogue/modules/hoeringsportal_dialogue_fixtures/src/Fixture/DialogueLandingPageFixture.php new file mode 100644 index 000000000..ddd1a1edd --- /dev/null +++ b/web/modules/custom/hoeringsportal_dialogue/modules/hoeringsportal_dialogue_fixtures/src/Fixture/DialogueLandingPageFixture.php @@ -0,0 +1,61 @@ + 'landing_page', + 'title' => 'Tidlig inddragelse', + 'field_teaser' => [ + 'value' => <<<'BODY' +I Aarhus ønsker vi lorem ipsum dolor sit amet, consectetur adipiscing elit. Sagittis mattis scelerisque habitasse elit etiam lobortis accumsan. Dignissim ac sapien potenti ipsum nam penatibus leo. +BODY + ], + 'field_media_image_single' => ['target_id' => $this->getReference('media:Large1')->id()], + 'field_section' => [ + [ + 'target_id' => $this->getReference('paragraph:content_list:all_early_inclusion')->id(), + 'target_revision_id' => $this->getReference('paragraph:content_list:all_early_inclusion')->getRevisionId(), + ], + ], + ]); + $entity->save(); + $this->addReference('node:landing_page:Dialogue proposals', $entity); + } + + /** + * {@inheritdoc} + */ + public function getDependencies() { + return [ + MediaFixture::class, + ParagraphFixture::class, + ]; + } + + /** + * {@inheritdoc} + */ + public function getGroups() { + return ['node']; + } + +} diff --git a/web/modules/custom/hoeringsportal_dialogue/modules/hoeringsportal_dialogue_fixtures/src/Fixture/DialogueProposalFixture.php b/web/modules/custom/hoeringsportal_dialogue/modules/hoeringsportal_dialogue_fixtures/src/Fixture/DialogueProposalFixture.php new file mode 100644 index 000000000..68c60d3eb --- /dev/null +++ b/web/modules/custom/hoeringsportal_dialogue/modules/hoeringsportal_dialogue_fixtures/src/Fixture/DialogueProposalFixture.php @@ -0,0 +1,159 @@ + 'dialogue_proposal', + 'title' => 'Titel på mit forslag', + 'status' => TRUE, + 'field_dialogue_proposal_descr' => 'Kort beskrivelse af sit amet, consectetur adipiscing elit. Sagittis mattis scelerisque habitasse elit etiam lobortis accumsan Sagittis mattis scelerisque habitasse elit etiam lobortis accumsan. +Dignissim ac sapien potenti ipsum nam penatibus leo. Facilisi potenti laoreet et scelerisque sem felis rutrum.', + 'field_dialogue_proposal_category' => [ + $this->getReference('dialogue_proposal_categories:Grønne pladser'), + $this->getReference('dialogue_proposal_categories:Cykelstier'), + $this->getReference('dialogue_proposal_categories:Regnvandsopsamling'), + $this->getReference('dialogue_proposal_categories:Bæredygtig Belysning'), + $this->getReference('dialogue_proposal_categories:Affaldshåndtering'), + ], + 'field_dialogue' => $this->getReference('node:dialogue:Test Dialogue - proposals full'), + 'field_image_upload' => ['target_id' => $this->getReference('file:large1.jpg')->id()], + 'field_location' => [ + 'type' => 'point', + 'data' => '{"type":"Feature","properties":[],"geometry":{"type":"Point","coordinates":[10.2118737466156,56.15312642194584]}}', + 'point' => '{"type":"FeatureCollection","crs":{"type":"name","properties":{"name":"urn:ogc:def:crs:EPSG::4326"}},"features":[{"type":"Feature","properties":{},"geometry":{"type":"Point","coordinates":[10.2118737466156,56.15312642194584]}}]}', + ], + ]); + + $node->save(); + $this->addReference('node:dialogue_proposal:Titel på mit forslag', $node); + + $node = Node::create([ + 'type' => 'dialogue_proposal', + 'title' => 'Inspiration fra Tyskland', + 'status' => TRUE, + 'field_dialogue_proposal_descr' => 'I Tyskland har jeg set af sit amet, consectetur adipiscing elit. Sagittis mattis scelerisque habitasse elit etiam lobortis accumsan. +Dignissim ac sapien potenti ipsum nam penatibus leo. Facilisi potenti laoreet et scelerisque sem felis rutrum.', + 'field_dialogue_proposal_category' => [ + $this->getReference('dialogue_proposal_categories:Grønne pladser'), + $this->getReference('dialogue_proposal_categories:Biodiversitet Initiativer'), + $this->getReference('dialogue_proposal_categories:Cykelstier'), + $this->getReference('dialogue_proposal_categories:Regnvandsopsamling'), + $this->getReference('dialogue_proposal_categories:Bæredygtig Belysning'), + $this->getReference('dialogue_proposal_categories:Affaldshåndtering'), + ], + 'field_dialogue' => $this->getReference('node:dialogue:Test Dialogue - proposals full'), + 'field_image_upload' => ['target_id' => $this->getReference('file:trafic.jpg')->id()], + 'field_location' => [ + 'type' => 'point', + 'data' => '{"type":"Feature","properties":[],"geometry":{"type":"Point","coordinates":[10.2118737466156,56.15312642194584]}}', + 'point' => '{"type":"FeatureCollection","crs":{"type":"name","properties":{"name":"urn:ogc:def:crs:EPSG::4326"}},"features":[{"type":"Feature","properties":{},"geometry":{"type":"Point","coordinates":[10.2118737466156,56.15312642194584]}}]}', + ], + ]); + + $node->save(); + $this->addReference('node:dialogue_proposal:Inspiration fra Tyskland', $node); + + $node = Node::create([ + 'type' => 'dialogue_proposal', + 'title' => 'Test Dialogue proposal 1', + 'status' => TRUE, + 'field_dialogue_proposal_descr' => 'I Tyskland har jeg set af sit amet, consectetur adipiscing elit. Sagittis mattis scelerisque habitasse elit etiam lobortis accumsan. +Dignissim ac sapien potenti ipsum nam penatibus leo. Facilisi potenti laoreet et scelerisque sem felis rutrum.', + 'field_dialogue_proposal_category' => [ + $this->getReference('dialogue_proposal_categories:Grønne pladser'), + $this->getReference('dialogue_proposal_categories:Biodiversitet Initiativer'), + $this->getReference('dialogue_proposal_categories:Cykelstier'), + $this->getReference('dialogue_proposal_categories:Regnvandsopsamling'), + $this->getReference('dialogue_proposal_categories:Bæredygtig Belysning'), + $this->getReference('dialogue_proposal_categories:Affaldshåndtering'), + ], + 'field_dialogue' => $this->getReference('node:dialogue:Test Dialogue - proposals full'), + 'field_image_upload' => ['target_id' => $this->getReference('file:large2.jpg')->id()], + 'field_location' => [ + 'type' => 'point', + 'data' => '{"type":"Feature","properties":[],"geometry":{"type":"Point","coordinates":[10.2118737466156,56.15312642194584]}}', + 'point' => '{"type":"FeatureCollection","crs":{"type":"name","properties":{"name":"urn:ogc:def:crs:EPSG::4326"}},"features":[{"type":"Feature","properties":{},"geometry":{"type":"Point","coordinates":[10.2118737466156,56.15312642194584]}}]}', + ], + ]); + + $node->save(); + $this->addReference('node:dialogue_proposal:Test Dialogue proposal 1', $node); + + $node = Node::create([ + 'type' => 'dialogue_proposal', + 'title' => 'Test Dialogue proposal full', + 'status' => TRUE, + 'field_dialogue_proposal_descr' => 'I Tyskland har jeg set af sit amet, consectetur adipiscing elit. Sagittis mattis scelerisque habitasse elit etiam lobortis accumsan. +Dignissim ac sapien potenti ipsum nam penatibus leo. Facilisi potenti laoreet et scelerisque sem felis rutrum.', + 'field_dialogue_proposal_category' => [ + $this->getReference('dialogue_proposal_categories:Grønne pladser'), + $this->getReference('dialogue_proposal_categories:Biodiversitet Initiativer'), + ], + 'field_dialogue' => $this->getReference('node:dialogue:Test Dialogue - proposals full'), + 'field_image_upload' => ['target_id' => $this->getReference('file:large3.jpg')->id()], + 'field_location' => [ + 'type' => 'point', + 'data' => '{"type":"Feature","properties":[],"geometry":{"type":"Point","coordinates":[10.2118737466156,56.15312642194584]}}', + 'point' => '{"type":"FeatureCollection","crs":{"type":"name","properties":{"name":"urn:ogc:def:crs:EPSG::4326"}},"features":[{"type":"Feature","properties":{},"geometry":{"type":"Point","coordinates":[10.2118737466156,56.15312642194584]}}]}', + ], + ]); + + $node->save(); + $this->addReference('node:dialogue_proposal:Test Dialogue proposal full', $node); + + $node = Node::create([ + 'type' => 'dialogue_proposal', + 'title' => 'Test Dialogue proposal simple', + 'status' => TRUE, + 'field_dialogue_proposal_descr' => 'I Tyskland har jeg set af sit amet, consectetur adipiscing elit. Sagittis mattis scelerisque habitasse elit etiam lobortis accumsan. +Dignissim ac sapien potenti ipsum nam penatibus leo. Facilisi potenti laoreet et scelerisque sem felis rutrum.', + 'field_dialogue_proposal_category' => [ + $this->getReference('dialogue_proposal_categories:Grønne pladser'), + $this->getReference('dialogue_proposal_categories:Biodiversitet Initiativer'), + $this->getReference('dialogue_proposal_categories:Cykelstier'), + $this->getReference('dialogue_proposal_categories:Regnvandsopsamling'), + $this->getReference('dialogue_proposal_categories:Bæredygtig Belysning'), + $this->getReference('dialogue_proposal_categories:Affaldshåndtering'), + ], + 'field_dialogue' => $this->getReference('node:dialogue:Test Dialogue - proposals simple, private'), + ]); + + $node->save(); + $this->addReference('node:dialogue_proposal:Test Dialogue proposal simple', $node); + } + + /** + * {@inheritdoc} + */ + public function getDependencies() { + return [ + TermDialogueProposalCategoryFixture::class, + DialogueFixture::class, + ]; + } + + /** + * {@inheritdoc} + */ + public function getGroups() { + return ['node']; + } + +} diff --git a/web/modules/custom/hoeringsportal_dialogue/src/Helper/DialogueHelper.php b/web/modules/custom/hoeringsportal_dialogue/src/Helper/DialogueHelper.php new file mode 100644 index 000000000..529a055c4 --- /dev/null +++ b/web/modules/custom/hoeringsportal_dialogue/src/Helper/DialogueHelper.php @@ -0,0 +1,226 @@ +getParentNode(); + $config = $this->getProposalConfig($parentNode); + + if (!in_array('public_proposals', $config)) { + return AccessResult::forbiddenIf($account->isAnonymous()); + } + + // Refuse to allow dialogue proposal creation if the parent dialogue is + // not set or not a dialogue. + return AccessResult::forbiddenIf(!$parentNode || !($parentNode->bundle() === 'dialogue')); + } + + return AccessResult::neutral(); + } + + /** + * Implements presave for dialogue proposal creation. + * + * @param \Drupal\Core\Entity\EntityInterface $entity + * An entity to presave. + */ + public function dialogueProposalPresave(EntityInterface $entity): void { + if ($this::DIALOGUE_PROPOSAL_TYPE === $entity->bundle()) { + $parentNode = $this->getParentNode(); + if ($parentNode) { + /**** @var \Drupal\node\Entity\Node $entity */ + $entity->set('field_dialogue', ['target_id' => $parentNode->id()]); + } + } + } + + /** + * Changes to the dialogue proposal form. + * + * @param array $form + * The form. + * @param \Drupal\Core\Form\FormStateInterface $form_state + * The state of the form. + */ + public function dialogueProposalFormAlter(array &$form, FormStateInterface $form_state): void { + // Disable form cache to prevent serialization error on file upload. + $form_state->disableCache(); + + foreach ($form as $key => $formPart) { + if (is_array($formPart) && isset($formPart['widget'])) { + $this->modifyRequired($form, $key, $formPart['widget']); + } + } + + $form['options']['#access'] = FALSE; + $form['advanced']['#access'] = FALSE; + $form['revision_log']['#access'] = FALSE; + $form['revision']['#access'] = FALSE; + $form['meta']['#access'] = FALSE; + + $form['field_image_upload']['widget']['#attributes']['drop_zone'] = TRUE; + $form['field_image_upload']['#drop_zone'] = TRUE; + $form['field_image_upload']['widget'][0]['value']['#attributes']['drop_zone'] = TRUE; + $form['field_dialogue_proposal_descr']['widget'][0]['value']['#description_display'] = 'before'; + $form['field_dialogue_proposal_category']['widget']['#description_position'] = 'top'; + $form['field_location']['widget'][0]['type']['#access'] = FALSE; + $form['field_location']['widget'][0]['geojson']['#access'] = FALSE; + $form['field_location']['widget'][0]['localplanids']['#access'] = FALSE; + $form['actions']['submit']['#submit'][] = [$this, 'formAlterSubmit']; + $form['actions']['submit']['#value'] = t('Send your proposal'); + $form['field_dialogue']['#access'] = FALSE; + + /** @var \Drupal\node\Entity\Node $parent */ + $parent = $this->getParentNode(); + + if ($parent) { + $config = $this->getProposalConfig($parent); + + if (!in_array('use_image_on_proposals', $config)) { + $form['field_image_upload']['#access'] = FALSE; + } + + if (!in_array('use_map_on_proposals', $config)) { + $form['field_location']['#access'] = FALSE; + } + + $parentLocationSelection = $parent->get('field_dialogue_proposal_location')->getValue(); + + $parentPoint = json_decode($parentLocationSelection[0]['point'] ?? ''); + $coordinates = $parentPoint->features[0]->geometry->coordinates ?? NULL; + + $parentZoomSelection = $parent->get('field_dialogue_proposal_zoom')->getValue(); + $form['field_location']['widget'][0]['point-widget']['#attributes']['data-map-config'] = json_encode([ + 'x' => $coordinates[0] ?? NULL, + 'y' => $coordinates[1] ?? NULL, + 'zoomLevel' => $parentZoomSelection[0]['value'] ?? 11, + ]); + } + + } + + /** + * Custom submit handler for dialog proposal form. + * + * @param array $form + * The form. + * @param \Drupal\Core\Form\FormStateInterface $form_state + * The state of the form. + */ + public function formAlterSubmit(array &$form, FormStateInterface $form_state): void { + $parentNode = $this->getParentNode(); + + if ($parentNode) { + $form_state->setRedirect('entity.node.canonical', ['node' => $parentNode->id()]); + } + } + + /** + * Get parent node. + * + * @return \Drupal\Core\Entity\EntityInterface|null + * The parent node. + */ + private function getParentNode(): ?EntityInterface { + try { + $parentId = $this->requestStack->getCurrentRequest()->query->get('dialogue'); + if ($parentId && is_numeric($parentId)) { + return $this->entityTypeManager->getStorage('node')->load($parentId); + } + } + catch (\Exception $e) { + return NULL; + } + + return NULL; + } + + /** + * Get proposal config related to dialogue. + * + * @param \Drupal\Core\Entity\EntityInterface $parent + * The parent node. + * + * @return array + * the proposal config. + */ + private function getProposalConfig(EntityInterface $parent): array { + /** @var \Drupal\node\NodeInterface $parent */ + $parentConfig = $parent->get('field_dialogue_proposal_config')->getValue(); + + return array_map(static fn(array $value) => $value['value'], $parentConfig); + } + + /** + * Change display of required fields. + * + * @param array $form + * The full form. + * @param string $key + * The form field. + * @param array $widget + * The form widget to change. + */ + private function modifyRequired(array &$form, string $key, array $widget): void { + if (!isset($widget['#required']) || !$widget['#required']) { + if (isset($widget['#title'])) { + $widget['#title'] = $widget['#title'] . '(' . $this->t('optional') . ')'; + } + if (isset($widget[0]['#title'])) { + $widget[0]['#title'] = $widget[0]['#title'] . '(' . $this->t('optional') . ')'; + } + } + + $form[$key]['widget'] = $widget; + } + +} diff --git a/web/modules/custom/hoeringsportal_dialogue/src/Theme/ThemeDialogueNegotiator.php b/web/modules/custom/hoeringsportal_dialogue/src/Theme/ThemeDialogueNegotiator.php new file mode 100644 index 000000000..74e74d284 --- /dev/null +++ b/web/modules/custom/hoeringsportal_dialogue/src/Theme/ThemeDialogueNegotiator.php @@ -0,0 +1,38 @@ +getRouteName() && DialogueHelper::DIALOGUE_PROPOSAL_TYPE === $route_match->getParameter('node_type')->id()) { + return TRUE; + } + + return FALSE; + } + + /** + * Determine the active theme. + * + * @param \Drupal\Core\Routing\RouteMatchInterface $route_match + * The route. + * + * @return string + * Machine name of theme. + */ + public function determineActiveTheme(RouteMatchInterface $route_match): string { + return 'hoeringsportal'; + } + +} diff --git a/web/modules/custom/hoeringsportal_forms/hoeringsportal_forms.module b/web/modules/custom/hoeringsportal_forms/hoeringsportal_forms.module index 796324d8c..124a6883a 100644 --- a/web/modules/custom/hoeringsportal_forms/hoeringsportal_forms.module +++ b/web/modules/custom/hoeringsportal_forms/hoeringsportal_forms.module @@ -28,6 +28,9 @@ function hoeringsportal_forms_theme_suggestions_alter(array &$suggestions, array if ($variables['form']['#form_id'] == 'node_public_meeting_form' || $variables['form']['#form_id'] == 'node_public_meeting_edit_form') { $suggestions[] = $hook . '__hoeringsportal_public_meeting'; } + if ($variables['form']['#form_id'] == 'node_dialogue_form' || $variables['form']['#form_id'] == 'node_dialogue_edit_form') { + $suggestions[] = $hook . '__hoeringsportal_dialogue'; + } } return $suggestions; @@ -52,6 +55,9 @@ function hoeringsportal_forms_theme($existing, $type, $theme, $path) { 'node_edit_form__hoeringsportal_public_meeting' => [ 'render element' => 'form', ], + 'node_edit_form__hoeringsportal_dialogue' => [ + 'render element' => 'form', + ], ]; } diff --git a/web/modules/custom/hoeringsportal_forms/templates/node-edit-form--hoeringsportal-dialogue.html.twig b/web/modules/custom/hoeringsportal_forms/templates/node-edit-form--hoeringsportal-dialogue.html.twig new file mode 100644 index 000000000..255534ff9 --- /dev/null +++ b/web/modules/custom/hoeringsportal_forms/templates/node-edit-form--hoeringsportal-dialogue.html.twig @@ -0,0 +1,15 @@ +{% extends '@claro/node-edit-form.html.twig' %} + +{% block main %} + {{ form|without('advanced', 'group_information', 'group_system_settings', 'actions') }} +{% endblock %} + +{% block secondary %} + {{ form.advanced }} + {{ form.group_information }} + {{ form.group_system_settings }} +{% endblock %} + +{% block footer %} + {{ form.actions }} +{% endblock %} diff --git a/web/themes/custom/hoeringsportal/assets/css/_base.scss b/web/themes/custom/hoeringsportal/assets/css/_base.scss index 5f7a9eb85..cb5bbd529 100644 --- a/web/themes/custom/hoeringsportal/assets/css/_base.scss +++ b/web/themes/custom/hoeringsportal/assets/css/_base.scss @@ -42,3 +42,16 @@ a { .text-decoration-underline { text-decoration: underline; } + +.text-decoration-none { + text-decoration: none; +} + +.ui-dialog-titlebar { + background-color: $white; + border: 0; +} + +.ui-button-icon { + background-color: $white; +} diff --git a/web/themes/custom/hoeringsportal/assets/css/_bootstrap-custom.scss b/web/themes/custom/hoeringsportal/assets/css/_bootstrap-custom.scss index 7ba900071..0516dc850 100755 --- a/web/themes/custom/hoeringsportal/assets/css/_bootstrap-custom.scss +++ b/web/themes/custom/hoeringsportal/assets/css/_bootstrap-custom.scss @@ -52,9 +52,13 @@ $red: #d32f2f; $red-light: #f2c0c0; $color-white: $white; $color-petroleum-100: oklch(98% 0.017 196.88); +$color-petroleum-200: oklch(90% 0.017 196.88); +$color-petroleum-800: oklch(43% 0.063 196.55); +$color-petroleum-900: oklch(30% 0.0406 197.75); $color-peach-100: oklch(94% 0.02 56.12); $color-peach-200: oklch(90% 0.02 56.12); $color-peach-600: oklch(50% 0.02 56.12); +$color-blue-100: oklch(0.9429 0.01 212.52); $color-stone-100: oklch(96% 0 0); $color-stone-600: oklch(46% 0 0); diff --git a/web/themes/custom/hoeringsportal/assets/css/hoeringsportal.scss b/web/themes/custom/hoeringsportal/assets/css/hoeringsportal.scss index 22bae29d4..79fe25e4e 100755 --- a/web/themes/custom/hoeringsportal/assets/css/hoeringsportal.scss +++ b/web/themes/custom/hoeringsportal/assets/css/hoeringsportal.scss @@ -1,7 +1,7 @@ @import "custom-variables", "bootstrap-custom", "layout/aside", "layout/page-map", "layout/page-project", "base", "module/nav", "module/hero", "module/btn", "module/card", "module/footer", "module/content", - "module/drupal", "module/underline", "module/timeline", + "module/drupal", "module/underline", "module/timeline", "module/dialogue", "module/status-messages", "module/campaign", "module/splash", "module/lead", "module/line-clamp", "module/page-teaser", "module/responsive-image-as-background", "module/social-sharing-buttons", @@ -10,7 +10,7 @@ "module/paragraph-content-promotion", "module/paragraph-files", "module/paragraph-link", "module/info_box", "module/search", "module/search-page", "module/newsletter", "module/proposal", - "module/animation", "module/header-v2", + "module/animation", "module/header-v2", "module/animated-svg", "../../node_modules/slick-carousel/slick/slick"; // We have an issue similar to https://www.drupal.org/project/bootstrap_barrio/issues/3228330#comment-14770789 diff --git a/web/themes/custom/hoeringsportal/assets/css/module/_animated-svg.scss b/web/themes/custom/hoeringsportal/assets/css/module/_animated-svg.scss new file mode 100644 index 000000000..03a01b138 --- /dev/null +++ b/web/themes/custom/hoeringsportal/assets/css/module/_animated-svg.scss @@ -0,0 +1,102 @@ +a:has(svg) { + /* prettier-ignore */ + --ease-spring-lazy: linear(0, 0.008 1.1%, 0.034 2.3%, 0.134 4.9%, 0.264 7.3%, 0.683 14.3%, 0.797 16.5%, 0.89 18.6%, 0.967 20.7%, 1.027 22.8%, 1.073 25%, 1.104 27.3%, 1.123 30.6%, 1.119 34.3%, 1.018 49.5%, 0.988 58.6%, 0.985 65.2%, 1 84.5%, 1); + /* prettier-ignore */ + --ease-spring-glide: linear(0, 0.012 0.9%, 0.05 2%, 0.411 9.2%, 0.517 11.8%, 0.611 14.6%, 0.694 17.7%, 0.765 21.1%, 0.824 24.8%, 0.872 28.9%, 0.91 33.4%, 0.939 38.4%, 0.977 50.9%, 0.994 68.4%, 1); + --path-fill-color: white; + --path-stroke-color: var(--bs-secondary); + --sp2: 4px; + + display: flex; + gap: var(--sp2); + text-decoration: none; + + svg { + /* Comment */ + g.comment { + path { + transform-origin: bottom left; + stroke-width: 1.5px; + transition: stroke 200ms var(--ease-spring-glide); + } + } + + /* Reply */ + g.reply { + path { + transform-origin: center right; + stroke-width: 1.5px; + transition: stroke 200ms var(--ease-spring-glide); + } + } + + /* Thumbs up */ + g.thumbs-up { + path { + stroke-width: 1.5px; + stroke: var(--bs-secondary); + } + + path:first-of-type { + transform-origin: center left; + transition: fill 200ms var(--ease-spring-glide); + } + } + } + + /* Hover on */ + &:hover { + /* Comment hover */ + g.comment { + path { + animation: pop 400ms var(--ease-spring-lazy); + transition: fill 200ms 300ms var(--ease-spring-lazy); + fill: var(--bs-primary); + stroke: var(--bs-secondary); + } + } + + /* Reply hover */ + g.reply { + path { + animation: stretchX 400ms var(--ease-spring-lazy); + transition: fill 200ms 300ms var(--ease-spring-lazy); + fill: var(--bs-primary); + stroke: var(--bs-secondary); + } + } + + /* Thumbs-up hover */ + g.thumbs-up { + path:last-child { + transition: fill 200ms 200ms var(--ease-spring-lazy); + fill: var(--bs-primary); + } + path:first-of-type { + transform: rotate(-3deg); + transition: transform 200ms var(--ease-spring-lazy); + } + } + } +} + +/* Click on with thumbs-up svg */ +.liked a:has(svg) { + g.thumbs-up { + path:first-of-type { + animation: rotatePop 500ms var(--ease-spring-lazy); + } + path:last-child { + fill: var(--bs-primary); + } + } +} + +/* Thumbs-up already set*/ +.action-unflag a:has(svg) { + g.thumbs-up { + path:last-child { + fill: var(--bs-primary); + } + } +} diff --git a/web/themes/custom/hoeringsportal/assets/css/module/_animation.scss b/web/themes/custom/hoeringsportal/assets/css/module/_animation.scss index 0fc9ec220..82dcaa1ca 100644 --- a/web/themes/custom/hoeringsportal/assets/css/module/_animation.scss +++ b/web/themes/custom/hoeringsportal/assets/css/module/_animation.scss @@ -9,3 +9,42 @@ width: initial; } } + +@keyframes rotate { + to { + transform: rotate(-5deg); + } +} + +@keyframes pop { + 50% { + transform: scale(0.9); + } + 75% { + transform: scale(1.1); + } + 100% { + transform: scale(1); + } +} + +@keyframes rotatePop { + 50% { + transform: rotate(10deg) translateX(-1px); + } + 75% { + transform: scale(1.2) rotate(-10deg) translateX(-2px); + } + 100% { + transform: scale(1); + } +} + +@keyframes stretchX { + 50% { + transform: scaleX(1.1); + } + 100% { + transform: scaleX(1); + } +} diff --git a/web/themes/custom/hoeringsportal/assets/css/module/_btn.scss b/web/themes/custom/hoeringsportal/assets/css/module/_btn.scss index 4fe0e528e..a8480ffcc 100755 --- a/web/themes/custom/hoeringsportal/assets/css/module/_btn.scss +++ b/web/themes/custom/hoeringsportal/assets/css/module/_btn.scss @@ -18,3 +18,90 @@ } } } + +.btn-sm { + @extend .btn-sm; + + padding: $spacer * 0.5 $spacer * 0.75; + + &.btn-primary { + position: relative; + border: 0; + color: $white; + + &::after { + content: ""; + position: absolute; + bottom: 0; + left: 0; + height: 2px; + width: 100%; + background-color: transparent; + } + } +} + +.btn-toggle { + background: $color-petroleum-800; + border: none; + border-radius: 4px; + padding: 0; + cursor: pointer; + + &:has(input.btn-check:checked) { + background: $color-petroleum-900; + } + + input.btn-check { + &:checked + .toggle-badge { + color: white; + background-color: $color-petroleum-800; + border: 1px solid $color-petroleum-800; + transform: translateY(-2px); + + &:hover { + background-color: $color-petroleum-800; + } + } + } + + label.toggle-badge { + display: block; + background: white; + border-radius: 4px; + font-weight: 400; + font-size: $font-size-small; + border: 1px solid $color-petroleum-800; + color: $color-petroleum-800; + padding: 8px 12px; + margin-bottom: 0; + + @media (prefers-reduced-motion: no-preference) { + transition: + transform 300ms cubic-bezier(0.3, 0.7, 0.4, 1), + background-color 0.1s ease-in; + } + } + + &:hover label.toggle-badge { + color: $color-petroleum-800; + background-color: $color-petroleum-100; + border: 1px solid $color-petroleum-800; + + @media (prefers-reduced-motion: no-preference) { + transform: translateY(-2px); + transition: + transform 200ms cubic-bezier(0.3, 0.7, 0.4, 1.5), + background-color 0.2s ease-out; + } + } + + &:active label.toggle-badge { + @media (prefers-reduced-motion: no-preference) { + transform: translateY(-2px); + transition: + transform 34ms, + background-color 0.2s ease-out; + } + } +} diff --git a/web/themes/custom/hoeringsportal/assets/css/module/_card.scss b/web/themes/custom/hoeringsportal/assets/css/module/_card.scss index dcb561f6a..11128a01a 100755 --- a/web/themes/custom/hoeringsportal/assets/css/module/_card.scss +++ b/web/themes/custom/hoeringsportal/assets/css/module/_card.scss @@ -24,6 +24,10 @@ color: $primary; } + .text-dialogue { + color: $petroleum; + } + text-decoration: none; height: 100%; transition: box-shadow var(--transition-duration-in) diff --git a/web/themes/custom/hoeringsportal/assets/css/module/_dialogue.scss b/web/themes/custom/hoeringsportal/assets/css/module/_dialogue.scss new file mode 100644 index 000000000..0da7a8eb1 --- /dev/null +++ b/web/themes/custom/hoeringsportal/assets/css/module/_dialogue.scss @@ -0,0 +1,147 @@ +.proposal-layout { + max-width: 840px !important; +} + +.breadcrumb { + color: $color-petroleum-800; + + a { + color: inherit; + text-decoration: none; + } +} + +.flag-wrapper { + .flag a { + color: inherit; + text-decoration: none; + } + + .ajax-progress-throbber { + display: none; + } +} + +.node-dialogue-proposal-form { + .fieldset-legend { + font-size: 1rem; + font-weight: bold; + } + + label, + legend { + font-weight: 700; + margin-bottom: 0.5rem; + + span.optional { + margin-left: 0.5rem; + font-weight: normal; + } + } + + .form-required:after { + content: ""; + margin-bottom: 0.5rem; + } + + .image-widget { + @extend .d-flex; + @extend .flex-wrap; + + img { + margin-right: 4rem; + } + + .form-item { + @extend .flex-grow-1; + flex-basis: 50%; + } + + .file--image { + display: none; + } + + .js-form-submit { + flex-basis: 100%; + } + + .drop-message { + padding: 1rem; + } + + .button { + @extend .btn; + @extend .btn-primary; + + padding: 0.25rem 0.5rem; + font-size: 0.875rem; + border-radius: 0.2rem; + position: inherit; + + &:after { + display: none; + } + } + } + #edit-field-dialogue-proposal-category--wrapper .fieldset-wrapper { + display: flex; + flex-direction: column; + gap: $spacer; + + .form-checkboxes { + display: flex; + flex-wrap: wrap; + gap: $spacer; + order: 2; + } + .description { + order: 1; + } + } +} + +.dialogue-proposals { + font-size: $font-size-small; + + .card-text { + line-clamp: 3; + text-overflow: ellipsis; + -webkit-line-clamp: 3; + display: -webkit-box; + -webkit-box-orient: vertical; + height: 65px; + overflow: hidden; + } + + a { + color: inherit; + text-decoration: none; + } +} + +.proposal-category-items { + .badge { + border: 1px solid $color-petroleum-800; + color: $color-petroleum-800; + } +} + +.dialogue-proposal { + img { + height: auto; + width: 100%; + } + + #map { + height: 300px !important; + } + + .comments .indented { + border-left: 2px dashed $gray-600; + padding-left: 2em; + } + + .comments .comment-time { + color: $gray-600; + } +} diff --git a/web/themes/custom/hoeringsportal/assets/css/module/_header-v2.scss b/web/themes/custom/hoeringsportal/assets/css/module/_header-v2.scss index 4c08656e4..316cbc9be 100644 --- a/web/themes/custom/hoeringsportal/assets/css/module/_header-v2.scss +++ b/web/themes/custom/hoeringsportal/assets/css/module/_header-v2.scss @@ -2,19 +2,29 @@ .image-wrapper { max-height: 80vh; overflow: hidden; + } - img { - object-fit: cover; - width: 100%; - height: auto; - } + .image-wrapper-half { + max-height: 40vh; + overflow: hidden; + } + + img { + object-fit: cover; + width: 100%; + height: auto; } .content-wrapper { padding-top: $spacer * 2; padding-bottom: $spacer * 2; - background-color: $color-peach-100; - border-bottom: 5px solid $color-peach-200; + + background-color: $color-petroleum-100; + border-bottom: 5px solid $color-petroleum-200; + + .text-background-match { + color: $petroleum; + } @include media-breakpoint-up(md) { padding-top: $spacer * 5; @@ -26,6 +36,41 @@ margin-top: -$spacer * 5; } } + + .type { + color: $petroleum; + } + + .tags { + color: $color-petroleum-800; + overflow: hidden; + text-overflow: ellipsis; + height: 1.5rem; + white-space: nowrap; + background: none; + border: none; + font: inherit; + cursor: pointer; + outline: inherit; + text-align: left; + max-width: 50%; + + &:focus { + overflow: auto; + text-overflow: ellipsis; + height: auto; + white-space: wrap; + } + } + + &.type-project { + background-color: $color-peach-100; + border-bottom: 5px solid $color-peach-200; + + .text-background-match { + color: $color-peach-600; + } + } } h1 { diff --git a/web/themes/custom/hoeringsportal/assets/css/module/_image-fade.scss b/web/themes/custom/hoeringsportal/assets/css/module/_image-fade.scss new file mode 100644 index 000000000..30f9925e4 --- /dev/null +++ b/web/themes/custom/hoeringsportal/assets/css/module/_image-fade.scss @@ -0,0 +1,21 @@ +.image-fade { + height: 80vh; + overflow: hidden; +} + +.image-slide { + border: none; + opacity: 0; + position: absolute; + top: 0; + left: 0; + -webkit-transition: opacity 3s linear; + -moz-transition: opacity 3s linear; + -o-transition: opacity 3s linear; + transition: opacity 3s linear; + height: 100% !important; +} + +.show { + opacity: 1; +} diff --git a/web/themes/custom/hoeringsportal/assets/js/animated-svg.js b/web/themes/custom/hoeringsportal/assets/js/animated-svg.js new file mode 100644 index 000000000..ec06784bb --- /dev/null +++ b/web/themes/custom/hoeringsportal/assets/js/animated-svg.js @@ -0,0 +1,26 @@ +document.addEventListener( + "click", + function (e) { + // Find the closest tag that's inside .flag-wrapper + const link = e.target.closest(".flag-wrapper"); + + if (link) { + // Find the child div with the flag classes + const flagDiv = link.querySelector(".flag"); + + // Only add animation if action-unflag does NOT exist + if (flagDiv && !flagDiv.classList.contains("action-unflag")) { + e.preventDefault(); + link.classList.add("liked"); + + // Cleanup class after animation + window.setTimeout(() => { + link.classList.remove("liked"); + }, 400); + } else { + e.preventDefault(); + } + } + }, + true, +); diff --git a/web/themes/custom/hoeringsportal/assets/js/hoeringsportal.js b/web/themes/custom/hoeringsportal/assets/js/hoeringsportal.js index e446d2d89..341ace62d 100755 --- a/web/themes/custom/hoeringsportal/assets/js/hoeringsportal.js +++ b/web/themes/custom/hoeringsportal/assets/js/hoeringsportal.js @@ -17,6 +17,9 @@ require("slick-carousel"); require("./slick-slider-config.js"); require("./filter-collapse.js"); require("./icons.js"); +require("./modify-dialogue-form.js"); +require("./modify-dialogue-proposal-comments.js"); +require("./animated-svg.js"); // Enable popovers. $(function () { diff --git a/web/themes/custom/hoeringsportal/assets/js/icons.js b/web/themes/custom/hoeringsportal/assets/js/icons.js index d7e70e723..e5b20cccc 100644 --- a/web/themes/custom/hoeringsportal/assets/js/icons.js +++ b/web/themes/custom/hoeringsportal/assets/js/icons.js @@ -31,6 +31,7 @@ import { faClock, faLocationDot, faComments, + faThumbsUp, } from "@fortawesome/free-solid-svg-icons"; // Import icons from the free brands package @@ -71,6 +72,7 @@ library.add( faCalendarDay, faClock, faLocationDot, + faThumbsUp, // Brand faDigg, faEvernote, @@ -84,4 +86,9 @@ library.add( faXTwitter, faTriangleExclamation, ); -dom.i2svg(); + +Drupal.behaviors.iconToSvg = { + attach: function (context, settings) { + dom.i2svg(); + }, +}; diff --git a/web/themes/custom/hoeringsportal/assets/js/image-fade.js b/web/themes/custom/hoeringsportal/assets/js/image-fade.js new file mode 100644 index 000000000..27cac1122 --- /dev/null +++ b/web/themes/custom/hoeringsportal/assets/js/image-fade.js @@ -0,0 +1,27 @@ +require("../css/module/_image-fade.scss"); + +let imgFadeSelector = document.querySelector(".image-fade"); +let firstImage = document.getElementById("img-0"); + +if (imgFadeSelector && firstImage) { + setInterval(nextImage, imgFadeSelector.dataset.imageDuration ?? 15000); + firstImage.classList.add("show"); +} + +let curImage = 0; +let numImages = document.querySelectorAll(".image-fade img").length; + +function nextImage() { + // Hide old image + document.getElementById("img-" + curImage).classList.toggle("show"); + + // Compute next image + curImage++; + if (curImage > numImages - 1) { + // Reset to first image + curImage = 0; + } + + // Show next image + document.getElementById("img-" + curImage).classList.toggle("show"); +} diff --git a/web/themes/custom/hoeringsportal/assets/js/modify-dialogue-form.js b/web/themes/custom/hoeringsportal/assets/js/modify-dialogue-form.js new file mode 100644 index 000000000..dab4c522f --- /dev/null +++ b/web/themes/custom/hoeringsportal/assets/js/modify-dialogue-form.js @@ -0,0 +1,17 @@ +Drupal.behaviors.modifyDialogueForm = { + attach: function (context, settings) { + once("modifyDialogueForm", ".file-resup", context).forEach( + function (element) { + let imageDescription = document.querySelector( + ".field--name-field-image-upload .form-item > .description", + ); + let dropArea = document.querySelector( + ".field--name-field-image-upload .form-item .file-resup-wrapper .drop-message", + ); + + imageDescription.classList.toggle("d-block"); + dropArea.append(imageDescription); + }, + ); + }, +}; diff --git a/web/themes/custom/hoeringsportal/assets/js/modify-dialogue-proposal-comments.js b/web/themes/custom/hoeringsportal/assets/js/modify-dialogue-proposal-comments.js new file mode 100644 index 000000000..55b4d3cc4 --- /dev/null +++ b/web/themes/custom/hoeringsportal/assets/js/modify-dialogue-proposal-comments.js @@ -0,0 +1,12 @@ +Drupal.behaviors.modifyDialogueProposalComments = { + attach: function (context, settings) { + once( + "modifyDialogueProposalComments", + ".comments .indented", + context, + ).forEach(function (element) { + let prev = element.previousElementSibling; + prev.append(element); + }); + }, +}; diff --git a/web/themes/custom/hoeringsportal/hoeringsportal.libraries.yml b/web/themes/custom/hoeringsportal/hoeringsportal.libraries.yml index fa439f930..841fac361 100755 --- a/web/themes/custom/hoeringsportal/hoeringsportal.libraries.yml +++ b/web/themes/custom/hoeringsportal/hoeringsportal.libraries.yml @@ -1,14 +1,29 @@ global-styling: - version: VERSION css: theme: build/hoeringsportal.css: {} bottom-scripts: - version: VERSION js: build/hoeringsportal.js: { scope: bottom, preprocess: false } build/runtime.js: { scope: bottom, preprocess: false } dependencies: - core/jquery - core/drupal + +image-fade: + version: VERSION + js: + build/image-fade.js: { scope: bottom, preprocess: false } + css: + theme: + build/image-fade.css: {} + +map-display: + version: VERSION + css: + theme: + build/show-map.css: {} + js: + build/show-map.js: { preprocess: false } + build/runtime.js: { preprocess: false } diff --git a/web/themes/custom/hoeringsportal/hoeringsportal.theme b/web/themes/custom/hoeringsportal/hoeringsportal.theme index 9c3fe0d22..eb7eeaba5 100755 --- a/web/themes/custom/hoeringsportal/hoeringsportal.theme +++ b/web/themes/custom/hoeringsportal/hoeringsportal.theme @@ -176,6 +176,20 @@ function hoeringsportal_theme_suggestions_container_alter(array &$suggestions, a $suggestions[] = 'container__' . str_replace('-', '_', $variables['element']['#type']); } +/** + * Implements hook_theme_suggestions_HOOK_alter(). + */ +function hoeringsportal_theme_suggestions_views_exposed_form_block_alter(array &$suggestions, array $variables) { + $suggestions[] = 'views_exposed_form__' . str_replace('-', '_', $variables['form']['#id']); +} + +/** + * Implements hook_theme_suggestions_HOOK_alter(). + */ +function hoeringsportal_theme_suggestions_views_exposed_form_alter(array &$suggestions, array $variables) { + $suggestions[] = 'views_exposed_form__' . str_replace('-', '_', $variables['form']['#id']); +} + /** * Implements hook_preprocess_html(). */ diff --git a/web/themes/custom/hoeringsportal/templates/animated-svg/icon-deltag-comment.svg.html.twig b/web/themes/custom/hoeringsportal/templates/animated-svg/icon-deltag-comment.svg.html.twig new file mode 100644 index 000000000..ce2b3bee3 --- /dev/null +++ b/web/themes/custom/hoeringsportal/templates/animated-svg/icon-deltag-comment.svg.html.twig @@ -0,0 +1,6 @@ + diff --git a/web/themes/custom/hoeringsportal/templates/animated-svg/icon-deltag-reply.svg.html.twig b/web/themes/custom/hoeringsportal/templates/animated-svg/icon-deltag-reply.svg.html.twig new file mode 100644 index 000000000..566e290d7 --- /dev/null +++ b/web/themes/custom/hoeringsportal/templates/animated-svg/icon-deltag-reply.svg.html.twig @@ -0,0 +1,6 @@ + diff --git a/web/themes/custom/hoeringsportal/templates/animated-svg/icon-deltag-thumbs-up.svg.html.twig b/web/themes/custom/hoeringsportal/templates/animated-svg/icon-deltag-thumbs-up.svg.html.twig new file mode 100644 index 000000000..d6735f137 --- /dev/null +++ b/web/themes/custom/hoeringsportal/templates/animated-svg/icon-deltag-thumbs-up.svg.html.twig @@ -0,0 +1,7 @@ + diff --git a/web/themes/custom/hoeringsportal/templates/comment/comment.html.twig b/web/themes/custom/hoeringsportal/templates/comment/comment.html.twig new file mode 100644 index 000000000..3b2fe1af4 --- /dev/null +++ b/web/themes/custom/hoeringsportal/templates/comment/comment.html.twig @@ -0,0 +1,85 @@ +{# +/** + * @file + * Default theme implementation for comments. + * + * Available variables: + * - author: (optional) Comment author. Can be a link or plain text. + * - content: The content-related items for the comment display. Use + * {{ content }} to print them all, or print a subset such as + * {{ content.field_example }}. Use the following code to temporarily suppress + * the printing of a given child element: + * @code + * {{ content|without('field_example') }} + * @endcode + * - created: (optional) Formatted date and time for when the comment was + * created. Preprocess functions can reformat it by calling + * DateFormatter::format() with the desired parameters on the + * 'comment.created' variable. + * - changed: (optional) Formatted date and time for when the comment was last + * changed. Preprocess functions can reformat it by calling + * DateFormatter::format() with the desired parameters on the + * 'comment.changed' variable. + * - permalink: Comment permalink. + * - submitted: (optional) Submission information created from author and + * created during template_preprocess_comment(). + * - user_picture: (optional) The comment author's profile picture. + * - status: Comment status. Possible values are: + * unpublished, published, or preview. + * - title: (optional) Comment title, linked to the comment. + * - attributes: HTML attributes for the containing element. + * The attributes.class may contain one or more of the following classes: + * - comment: The current template type; for instance, 'theming hook'. + * - by-anonymous: Comment by an unregistered user. + * - by-{entity-type}-author: Comment by the author of the parent entity, + * eg. by-node-author. + * - preview: When previewing a new or edited comment. + * The following applies only to viewers who are registered users: + * - unpublished: An unpublished comment visible only to administrators. + * - title_prefix: Additional output populated by modules, intended to be + * displayed in front of the main title tag that appears in the template. + * - title_suffix: Additional output populated by modules, intended to be + * displayed after the main title tag that appears in the template. + * - content_attributes: List of classes for the styling of the comment content. + * - title_attributes: Same as attributes, except applied to the main title + * tag that appears in the template. + * - threaded: A flag indicating whether the comments are threaded or not. + * + * These variables are provided to give context about the parent comment (if + * any, optional): + * - parent_comment: Full parent comment entity (if any). + * - parent_author: Equivalent to author for the parent comment. + * - parent_created: Equivalent to created for the parent comment. + * - parent_changed: Equivalent to changed for the parent comment. + * - parent_title: Equivalent to title for the parent comment. + * - parent_permalink: Equivalent to permalink for the parent comment. + * - parent: A text string of parent comment submission information created from + * 'parent_author' and 'parent_created' during template_preprocess_comment(). + * This information is presented to help screen readers follow lengthy + * discussion threads. You can hide this from sighted users using the class + * visually-hidden. + * + * These two variables are provided for context: + * - comment: Full comment object. + * - commented_entity: Entity the comments are attached to. + * + * @see template_preprocess_comment() + * + * @ingroup themeable + */ +#} +
+
+ {{ comment.created.value|time_diff }}
+ {{ content|without('flag_support_comment') }}
+
+
+ {% endif %}
+
+
diff --git a/web/themes/custom/hoeringsportal/templates/comment/field--comment.html.twig b/web/themes/custom/hoeringsportal/templates/comment/field--comment.html.twig
new file mode 100644
index 000000000..571f45410
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/comment/field--comment.html.twig
@@ -0,0 +1,44 @@
+{#
+/**
+ * @file
+ * Default theme override for comment fields.
+ *
+ * Available variables:
+ * - attributes: HTML attributes for the containing element.
+ * - label_hidden: Whether to show the field label or not.
+ * - title_attributes: HTML attributes for the title.
+ * - label: The label for the field.
+ * - title_prefix: Additional output populated by modules, intended to be
+ * displayed in front of the main title tag that appears in the template.
+ * - title_suffix: Additional title output populated by modules, intended to
+ * be displayed after the main title tag that appears in the template.
+ * - comments: List of comments rendered through comment.html.twig.
+ * - content_attributes: HTML attributes for the form title.
+ * - comment_form: The 'Add new comment' form.
+ * - comment_display_mode: Is the comments are threaded.
+ * - comment_type: The comment type bundle ID for the comment field.
+ * - entity_type: The entity type to which the field belongs.
+ * - field_name: The name of the field.
+ * - field_type: The type of the field.
+ * - label_display: The display settings for the label.
+ *
+ * @see template_preprocess_field()
+ * @see comment_preprocess_field()
+ */
+#}
+{{ content.flag_support_comment }}
+
+
+ {{ comments }}
+
+
diff --git a/web/themes/custom/hoeringsportal/templates/components/base-card.html.twig b/web/themes/custom/hoeringsportal/templates/components/base-card.html.twig
index 7bba0aa75..5a55bf89d 100644
--- a/web/themes/custom/hoeringsportal/templates/components/base-card.html.twig
+++ b/web/themes/custom/hoeringsportal/templates/components/base-card.html.twig
@@ -22,12 +22,16 @@
{% elseif node_type == 'citizen_proposal' %}
{% set node_type_class = 'text-citizen-proposal' %}
{% set node_type_text = 'Citizen proposal'|t %}
+{% elseif node_type == 'dialogue' %}
+ {% set node_type_class = 'text-dialogue' %}
+ {% set node_type_text = 'Dialogue'|t %}
{% endif %}
{# Set image for Hearing, Project, Public meeting or Static page #}
{% set image = content.field_media_image[0]['#media']
|default(content.field_project_image[0]['#media'])
|default(content.field_media_image_single[0]['#media'])
+ |default(content.field_top_images[0]['#media'])
|default(false) %}
{# Use default image if no image found. #}
diff --git a/web/themes/custom/hoeringsportal/templates/components/header-default.html.twig b/web/themes/custom/hoeringsportal/templates/components/header-default.html.twig
new file mode 100644
index 000000000..ffe86a54c
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/components/header-default.html.twig
@@ -0,0 +1,50 @@
+{{ attach_library('hoeringsportal/image-fade') }}
+
+
+ {% block header_top_image %}
+ {% if images %}
+ {% if images|length > 1 %}
+
diff --git a/web/themes/custom/hoeringsportal/templates/components/header-v2.html.twig b/web/themes/custom/hoeringsportal/templates/components/header-v2.html.twig
deleted file mode 100644
index 785b98be8..000000000
--- a/web/themes/custom/hoeringsportal/templates/components/header-v2.html.twig
+++ /dev/null
@@ -1,19 +0,0 @@
-
+ {% for key, image in images %}
+ 
+ {% endfor %}
+
+ {% else %}
+
+ 
+
+ {% endif %}
+ {% endif %}
+ {% endblock %}
+ {% block header_text_box %}
+
+
+ {% endblock %}
+
+ {% if category %}
+
+ {{ category }}
+ {% endif %}
+ {{ title }}
+
+ {{ description }}
+
+ {% if shortcuts %}
+
+ {% for shortcut in shortcuts %}
+ {{ shortcut.label }}
+ {% endfor %}
+
+ {% endif %}
+ {% if tags_fields %}
+
+
+
+ {% endif %}
+
- {% if image %}
-
diff --git a/web/themes/custom/hoeringsportal/templates/components/toggle-button.html.twig b/web/themes/custom/hoeringsportal/templates/components/toggle-button.html.twig
new file mode 100644
index 000000000..b2fc88ad0
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/components/toggle-button.html.twig
@@ -0,0 +1,4 @@
+
- 
-
- {% endif %}
-
-
-
- {% if category %}
- {{ category }}
- {% endif %}
-
- {{ title }}
- {{ description }} - {% if area %} -{{ area }}
- {% endif %}
-
+
+
+
diff --git a/web/themes/custom/hoeringsportal/templates/content/flag--support-comment.html.twig b/web/themes/custom/hoeringsportal/templates/content/flag--support-comment.html.twig
new file mode 100644
index 000000000..b1b9084f2
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/content/flag--support-comment.html.twig
@@ -0,0 +1,41 @@
+{#
+/**
+ * @file
+ * Default theme implementation for flag links.
+ *
+ * Available functions:
+ * - flagcount(flag, flaggable) gets the number of flaggings for the given flag and flaggable.
+ *
+ * Available variables:
+ * - attributes: HTML attributes for the link element.
+ * - title: The flag link title.
+ * - action: 'flag' or 'unflag'
+ * - flag: The flag object.
+ * - flaggable: The flaggable entity.
+ */
+#}
+{# Attach the flag CSS library. #}
+{{ attach_library('flag/flag.link') }}
+
+{# Depending on the flag action, set the appropriate action class. #}
+{% if action == 'unflag' %}
+ {% set action_class = 'action-unflag' %}
+{% else %}
+ {% set action_class = 'action-flag' %}
+{% endif %}
+
+{# Set the remaining Flag CSS classes. #}
+{%
+ set classes = [
+ 'flag',
+ 'flag-' ~ flag.id()|clean_class,
+ 'js-flag-' ~ flag.id()|clean_class ~ '-' ~ flaggable.id(),
+ action_class
+]
+%}
+
+{# Set nofollow to prevent search bots from crawling anonymous flag links #}
+{% set attributes = attributes.setAttribute('rel', 'nofollow') %}
+
+ {{ include('themes/custom/hoeringsportal/templates/animated-svg/icon-deltag-thumbs-up.svg.html.twig') }}{{ flagcount(flag, flaggable) }} {{ 'like this'|t }}
+
diff --git a/web/themes/custom/hoeringsportal/templates/content/flag--support-proposal.html.twig b/web/themes/custom/hoeringsportal/templates/content/flag--support-proposal.html.twig
new file mode 100644
index 000000000..b1b9084f2
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/content/flag--support-proposal.html.twig
@@ -0,0 +1,41 @@
+{#
+/**
+ * @file
+ * Default theme implementation for flag links.
+ *
+ * Available functions:
+ * - flagcount(flag, flaggable) gets the number of flaggings for the given flag and flaggable.
+ *
+ * Available variables:
+ * - attributes: HTML attributes for the link element.
+ * - title: The flag link title.
+ * - action: 'flag' or 'unflag'
+ * - flag: The flag object.
+ * - flaggable: The flaggable entity.
+ */
+#}
+{# Attach the flag CSS library. #}
+{{ attach_library('flag/flag.link') }}
+
+{# Depending on the flag action, set the appropriate action class. #}
+{% if action == 'unflag' %}
+ {% set action_class = 'action-unflag' %}
+{% else %}
+ {% set action_class = 'action-flag' %}
+{% endif %}
+
+{# Set the remaining Flag CSS classes. #}
+{%
+ set classes = [
+ 'flag',
+ 'flag-' ~ flag.id()|clean_class,
+ 'js-flag-' ~ flag.id()|clean_class ~ '-' ~ flaggable.id(),
+ action_class
+]
+%}
+
+{# Set nofollow to prevent search bots from crawling anonymous flag links #}
+{% set attributes = attributes.setAttribute('rel', 'nofollow') %}
+
+ {{ include('themes/custom/hoeringsportal/templates/animated-svg/icon-deltag-thumbs-up.svg.html.twig') }}{{ flagcount(flag, flaggable) }} {{ 'like this'|t }}
+
diff --git a/web/themes/custom/hoeringsportal/templates/content/node--dialogue--full.html.twig b/web/themes/custom/hoeringsportal/templates/content/node--dialogue--full.html.twig
new file mode 100755
index 000000000..0da16dfdb
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/content/node--dialogue--full.html.twig
@@ -0,0 +1,53 @@
+{% extends '@hoeringsportal/node/_node--1-col-large-image-top.html.twig' %}
+
+{% block content_top %}
+ {# Header #}
+ {{ include(directory ~ '/templates/components/header-default.html.twig', {
+ images: node.field_top_images,
+ type: node.bundle,
+ title: node.label,
+ description: content.field_teaser,
+ tags_fields: {0: content.field_area, 1: content.field_type},
+ shortcuts: {
+ 0: {
+ label: 'Content'|t,
+ href: '#content',
+ },
+ 1: {
+ label: 'Proposals'|t,
+ href: '#proposals',
+ },
+ 2: {
+ label: 'Map'|t,
+ href: {route: 'entity.node.canonical', parameters: {node: 1}
+ },
+ }
+ }
+ }) }}
+{% endblock %}
+
+{% block content_main %}
+ {# Main container #}
+
+
+
+ {{ content.field_content_sections }}
+
+
+
+
+{% endblock %}
diff --git a/web/themes/custom/hoeringsportal/templates/content/node--dialogue--teaser.html.twig b/web/themes/custom/hoeringsportal/templates/content/node--dialogue--teaser.html.twig
new file mode 100755
index 000000000..a7998d85b
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/content/node--dialogue--teaser.html.twig
@@ -0,0 +1,9 @@
+{# Template for Project teaser extending base-card #}
+
+{% extends 'themes/custom/hoeringsportal/templates/components/base-card.html.twig' %}
+
+{% block card_content %}
+ {{ node.field_teaser.value|truncate(95, true, true) }}
+ {{ content.field_project_category }}
+ {{ content.field_area }}{{ content.field_type }}
+{% endblock %}
diff --git a/web/themes/custom/hoeringsportal/templates/content/node--dialogue-proposal--full.html.twig b/web/themes/custom/hoeringsportal/templates/content/node--dialogue-proposal--full.html.twig
new file mode 100755
index 000000000..173494526
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/content/node--dialogue-proposal--full.html.twig
@@ -0,0 +1,60 @@
+{% extends '@hoeringsportal/node/_node--1-col-large-image-top.html.twig' %}
+
+{% block content_top %}
+
+{% endblock %}
+
+{% block content_main %}
+ {# Main container #}
+
+
+
+
+ {{ drupal_view('dialogue_proposals', 'block_1', content.id) }}
+ {{ 'Proposals'|t }}
+
+
+{% endblock %}
diff --git a/web/themes/custom/hoeringsportal/templates/content/node--dialogue-proposal--list-display.html.twig b/web/themes/custom/hoeringsportal/templates/content/node--dialogue-proposal--list-display.html.twig
new file mode 100755
index 000000000..4e5e490a1
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/content/node--dialogue-proposal--list-display.html.twig
@@ -0,0 +1,93 @@
+{#
+/**
+ * @file
+ * Theme override to display a node.
+ *
+ * Available variables:
+ * - node: The node entity with limited access to object properties and methods.
+ * Only method names starting with "get", "has", or "is" and a few common
+ * methods such as "id", "label", and "bundle" are available. For example:
+ * - node.getCreatedTime() will return the node creation timestamp.
+ * - node.hasField('field_example') returns TRUE if the node bundle includes
+ * field_example. (This does not indicate the presence of a value in this
+ * field.)
+ * - node.isPublished() will return whether the node is published or not.
+ * Calling other methods, such as node.delete(), will result in an exception.
+ * See \Drupal\node\Entity\Node for a full list of public properties and
+ * methods for the node object.
+ * - label: The title of the node.
+ * - content: All node items. Use {{ content }} to print them all,
+ * or print a subset such as {{ content.field_example }}. Use
+ * {{ content|without('field_example') }} to temporarily suppress the printing
+ * of a given child element.
+ * - author_picture: The node author user entity, rendered using the "compact"
+ * view mode.
+ * - metadata: Metadata for this node.
+ * - date: Themed creation date field.
+ * - author_name: Themed author name field.
+ * - url: Direct URL of the current node.
+ * - display_submitted: Whether submission information should be displayed.
+ * - attributes: HTML attributes for the containing element.
+ * The attributes.class element may contain one or more of the following
+ * classes:
+ * - node: The current template type (also known as a "theming hook").
+ * - node--type-[type]: The current node type. For example, if the node is an
+ * "Article" it would result in "node--type-article". Note that the machine
+ * name will often be in a short form of the human readable label.
+ * - node--view-mode-[view_mode]: The View Mode of the node; for example, a
+ * teaser would result in: "node--view-mode-teaser", and
+ * full: "node--view-mode-full".
+ * The following are controlled through the node publishing options.
+ * - node--promoted: Appears on nodes promoted to the front page.
+ * - node--sticky: Appears on nodes ordered above other non-sticky nodes in
+ * teaser listings.
+ * - node--unpublished: Appears on unpublished nodes visible only to site
+ * admins.
+ * - title_attributes: Same as attributes, except applied to the main title
+ * tag that appears in the template.
+ * - content_attributes: Same as attributes, except applied to the main
+ * content tag that appears in the template.
+ * - author_attributes: Same as attributes, except applied to the author of
+ * the node tag that appears in the template.
+ * - title_prefix: Additional output populated by modules, intended to be
+ * displayed in front of the main title tag that appears in the template.
+ * - title_suffix: Additional output populated by modules, intended to be
+ * displayed after the main title tag that appears in the template.
+ * - view_mode: View mode; for example, "teaser" or "full".
+ * - teaser: Flag for the teaser state. Will be true if view_mode is 'teaser'.
+ * - page: Flag for the full page state. Will be true if view_mode is 'full'.
+ * - readmore: Flag for more state. Will be true if the teaser content of the
+ * node cannot hold the main body content.
+ * - logged_in: Flag for authenticated user status. Will be true when the
+ * current user is a logged-in member.
+ * - is_admin: Flag for admin user status. Will be true when the current user
+ * is an administrator.
+ *
+ * @see template_preprocess_node()
+ *
+ */
+#}
+
+
+
+
+
+
+ {{ label }}
+
+
+
+
+
+
+
+ {{ content.flag_support_proposal }}
+
+
+
+ {{ content.field_dialogue_proposal_category }}
+
+ {% if content.field_image_upload %}
+
+
+ {% endif %}
+
+ {{ content.field_image_upload }}
+
+
+
+
+ {{ content.field_dialogue_proposal_descr }}
+
+
+
+
+ {{ content.field_location }}
+
+
+
+
+ {{ content.field_comments }}
+
+
+
diff --git a/web/themes/custom/hoeringsportal/templates/content/node--landing-page.html.twig b/web/themes/custom/hoeringsportal/templates/content/node--landing-page.html.twig
new file mode 100644
index 000000000..33d077668
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/content/node--landing-page.html.twig
@@ -0,0 +1,21 @@
+{% extends '@hoeringsportal/node/_node--1-col-large-image-top.html.twig' %}
+
+{% block content_top %}
+ {# Header #}
+ {{ include(directory ~ '/templates/components/header-default.html.twig', {
+ images: {0: node.field_media_image_single.entity.field_itk_media_image_upload.entity},
+ category: content.field_header_label,
+ title: node.label,
+ description: content.field_teaser,
+ tags_fields: {},
+ image_half: true,
+ shortcuts: {}}
+ ) }}
+{% endblock %}
+
+{% block content_main %}
+ {# Main container #}
+
+
+{{ label }}
+
+
+
+ {{ content.field_dialogue_proposal_descr }}
+
+
+
+
+
+
+ {{ node.field_comments.comment_count }}{{ 'Comments'|t }}
+
+
+ {{ content.flag_support_proposal }}
+
+
+ {{ content.field_dialogue_proposal_category }}
+
+
+ {{ content|without('field_media_image_single', 'field_header_label', 'field_show_page_title', 'field_teaser', 'published_at') }}
+
+{% endblock %}
diff --git a/web/themes/custom/hoeringsportal/templates/content/node--project-main-page--full.html.twig b/web/themes/custom/hoeringsportal/templates/content/node--project-main-page--full.html.twig
new file mode 100755
index 000000000..57b1adb10
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/content/node--project-main-page--full.html.twig
@@ -0,0 +1,16 @@
+{% extends '@hoeringsportal/node/_node--1-col-large-image-top.html.twig' %}
+
+{% block content_top %}
+ {# Header #}
+ {{ include(directory ~ '/templates/components/header-default.html.twig', {
+ images: {0: node.field_project_image},
+ category: content.field_project_category,
+ title: node.label,
+ description: content.field_short_description,
+ tags_fields: {0: content.field_area},
+ type: 'type-project',
+ image_half: false,
+ shortcuts: {}
+ })
+ }}
+{% endblock %}
diff --git a/web/themes/custom/hoeringsportal/templates/content/node--project-main-page--teaser.html.twig b/web/themes/custom/hoeringsportal/templates/content/node--project-main-page--teaser.html.twig
index d01bb6b41..5b58b547a 100755
--- a/web/themes/custom/hoeringsportal/templates/content/node--project-main-page--teaser.html.twig
+++ b/web/themes/custom/hoeringsportal/templates/content/node--project-main-page--teaser.html.twig
@@ -4,8 +4,6 @@
{% block card_content %}
{{ node.field_short_description.value|truncate(95, true, true) }}
-{% endblock %}
-{% block card_footer %}
{{ content.field_project_category }}
- {{ content.field_area }}
+ {{ content.field_area }}{{ content.field_project_category }}
{% endblock %}
diff --git a/web/themes/custom/hoeringsportal/templates/node/node--project-page.html.twig b/web/themes/custom/hoeringsportal/templates/content/node--project-page.html.twig
similarity index 100%
rename from web/themes/custom/hoeringsportal/templates/node/node--project-page.html.twig
rename to web/themes/custom/hoeringsportal/templates/content/node--project-page.html.twig
diff --git a/web/themes/custom/hoeringsportal/templates/field/field--comment.html.twig b/web/themes/custom/hoeringsportal/templates/field/field--comment.html.twig
deleted file mode 100755
index 18f080f36..000000000
--- a/web/themes/custom/hoeringsportal/templates/field/field--comment.html.twig
+++ /dev/null
@@ -1,69 +0,0 @@
-{#
-/**
- * @file
- * Theme override for comment fields.
- *
- * Available variables:
- * - attributes: HTML attributes for the containing element.
- * - label_hidden: Whether to show the field label or not.
- * - title_attributes: HTML attributes for the title.
- * - label: The label for the field.
- * - title_prefix: Additional output populated by modules, intended to be
- * displayed in front of the main title tag that appears in the template.
- * - title_suffix: Additional title output populated by modules, intended to
- * be displayed after the main title tag that appears in the template.
- * - comments: List of comments rendered through comment.html.twig.
- * - content_attributes: HTML attributes for the form title.
- * - comment_form: The 'Add new comment' form.
- * - comment_display_mode: Is the comments are threaded.
- * - comment_type: The comment type bundle ID for the comment field.
- * - entity_type: The entity type to which the field belongs.
- * - field_name: The name of the field.
- * - field_type: The type of the field.
- * - label_display: The display settings for the label.
- *
- * @see template_preprocess_field()
- * @see comment_preprocess_field()
- */
-#}
-
- {% if comments and not label_hidden %}
-
-
- {{ title_prefix }}
- {{ 'Contribute'|t }}
- {{ title_suffix }}
-
- {% endif %}
-
- {{ comments }}
- {% if user_validated > 0 %}
- {% if comment_form %}
-
- {{ 'Add contribution'|t }}
-
- {% endif %}
- {% endif %}
- {{ comment_form }}
-
- {% if user_anonymous %}
-
-
diff --git a/web/themes/custom/hoeringsportal/templates/field/field--field-dialogue-proposal-category--full.html.twig b/web/themes/custom/hoeringsportal/templates/field/field--field-dialogue-proposal-category--full.html.twig
new file mode 100644
index 000000000..16f585a9e
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/field/field--field-dialogue-proposal-category--full.html.twig
@@ -0,0 +1,44 @@
+{#
+/**
+ * @file
+ * Theme override for a field.
+ *
+ * To override output, copy the "field.html.twig" from the templates directory
+ * to your theme's directory and customize it, just like customizing other
+ * Drupal templates such as page.html.twig or node.html.twig.
+ *
+ * Instead of overriding the theming for all fields, you can also just override
+ * theming for a subset of fields using
+ * @link themeable Theme hook suggestions. @endlink For example,
+ * here are some theme hook suggestions that can be used for a field_foo field
+ * on an article node type:
+ * - field--node--field-foo--article.html.twig
+ * - field--node--field-foo.html.twig
+ * - field--node--article.html.twig
+ * - field--field-foo.html.twig
+ * - field--text-with-summary.html.twig
+ * - field.html.twig
+ *
+ * Available variables:
+ * - attributes: HTML attributes for the containing element.
+ * - label_hidden: Whether to show the field label or not.
+ * - title_attributes: HTML attributes for the title.
+ * - label: The label for the field.
+ * - multiple: TRUE if a field can contain multiple items.
+ * - items: List of all the field items. Each item contains:
+ * - attributes: List of HTML attributes for each item.
+ * - content: The field item's content.
+ * - entity_type: The entity type to which the field belongs.
+ * - field_name: The name of the field.
+ * - field_type: The type of the field.
+ * - label_display: The display settings for the label.
+ *
+ * @see template_preprocess_field()
+ */
+#}
+
+
- {{ 'If you wan\'t to participate in the discussion you must create a user'|t }} {{ 'Create user'|t }}
-
- {% else %}
- {% if not user_validated == 1 %}
-
-
- {% endif %}
- {% endif %}
-
- 
-
- {{ 'Validate with NemID'|t }}
-{{ 'Before you can contribute you must validate your user account with NemID.'|t }}
-{{ 'You only have to do it once, and you can do it now.'|t }}
- {{ include('@hoeringsportal_user/nemid-disclosure-text-da.html.twig') }} - {{ 'Validate'|t }} -
-
+ {% for item in items %}
+ {{ item.content }}
+ {% endfor %}
+
diff --git a/web/themes/custom/hoeringsportal/templates/field/field--field-dialogue-proposal-category.html.twig b/web/themes/custom/hoeringsportal/templates/field/field--field-dialogue-proposal-category.html.twig
new file mode 100644
index 000000000..35954b156
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/field/field--field-dialogue-proposal-category.html.twig
@@ -0,0 +1,50 @@
+{#
+/**
+ * @file
+ * Theme override for a field.
+ *
+ * To override output, copy the "field.html.twig" from the templates directory
+ * to your theme's directory and customize it, just like customizing other
+ * Drupal templates such as page.html.twig or node.html.twig.
+ *
+ * Instead of overriding the theming for all fields, you can also just override
+ * theming for a subset of fields using
+ * @link themeable Theme hook suggestions. @endlink For example,
+ * here are some theme hook suggestions that can be used for a field_foo field
+ * on an article node type:
+ * - field--node--field-foo--article.html.twig
+ * - field--node--field-foo.html.twig
+ * - field--node--article.html.twig
+ * - field--field-foo.html.twig
+ * - field--text-with-summary.html.twig
+ * - field.html.twig
+ *
+ * Available variables:
+ * - attributes: HTML attributes for the containing element.
+ * - label_hidden: Whether to show the field label or not.
+ * - title_attributes: HTML attributes for the title.
+ * - label: The label for the field.
+ * - multiple: TRUE if a field can contain multiple items.
+ * - items: List of all the field items. Each item contains:
+ * - attributes: List of HTML attributes for each item.
+ * - content: The field item's content.
+ * - entity_type: The entity type to which the field belongs.
+ * - field_name: The name of the field.
+ * - field_type: The type of the field.
+ * - label_display: The display settings for the label.
+ *
+ * @see template_preprocess_field()
+ */
+#}
+
+
+ {% if (items[0]) %}
+ {{ items[0].content }}
+ {% endif %}
+ {% if (items[1]) %}
+ {{ items[1].content }}
+ {% endif %}
+ {% if (items|length > 2) %}
+ +{{ items|length - 2 }}
+ {% endif %}
+
diff --git a/web/themes/custom/hoeringsportal/templates/field/field--field-location.html.twig b/web/themes/custom/hoeringsportal/templates/field/field--field-location.html.twig
new file mode 100755
index 000000000..b83efe656
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/field/field--field-location.html.twig
@@ -0,0 +1,12 @@
+{{ attach_library('hoeringsportal/map-display') }}
+
+{% if not label_hidden %}
+ {{ label }}
+{% endif %} + +{# @FIXME: Is this the right way do get the data? #} +{% for item in element['#items']|slice(0, 1) %} + {% if (item.data is not same as('null')) %} + + {% endif %} +{% endfor %} diff --git a/web/themes/custom/hoeringsportal/templates/field/field--node--field-area--dialogue.html.twig b/web/themes/custom/hoeringsportal/templates/field/field--node--field-area--dialogue.html.twig new file mode 100755 index 000000000..bfa38e836 --- /dev/null +++ b/web/themes/custom/hoeringsportal/templates/field/field--node--field-area--dialogue.html.twig @@ -0,0 +1,61 @@ +{# +/** + * @file + * Theme override for a field. + * + * To override output, copy the "field.html.twig" from the templates directory + * to your theme's directory and customize it, just like customizing other + * Drupal templates such as page.html.twig or node.html.twig. + * + * Instead of overriding the theming for all fields, you can also just override + * theming for a subset of fields using + * @link themeable Theme hook suggestions. @endlink For example, + * here are some theme hook suggestions that can be used for a field_foo field + * on an article node type: + * - field--node--field-foo--article.html.twig + * - field--node--field-foo.html.twig + * - field--node--article.html.twig + * - field--field-foo.html.twig + * - field--text-with-summary.html.twig + * - field.html.twig + * + * Available variables: + * - attributes: HTML attributes for the containing element. + * - label_hidden: Whether to show the field label or not. + * - title_attributes: HTML attributes for the title. + * - label: The label for the field. + * - multiple: TRUE if a field can contain multiple items. + * - items: List of all the field items. Each item contains: + * - attributes: List of HTML attributes for each item. + * - content: The field item's content. + * - entity_type: The entity type to which the field belongs. + * - field_name: The name of the field. + * - field_type: The type of the field. + * - label_display: The display settings for the label. + * + * @see template_preprocess_field() + */ +#} + +{% if label_hidden %} + {% if multiple %} + {% for item in items %} + {{ item.content }} + {% endfor %} + {% else %} + {% for item in items %} + {{ item.content }} + {% endfor %} + {% endif %} +{% else %} +{{ label }}
+ {% if multiple %} +
+ {% endif %}
+ {% for item in items %}
+ {{ item.content }}
+ {% endfor %}
+ {% if multiple %}
+
+ {% endif %}
+{% endif %}
diff --git a/web/themes/custom/hoeringsportal/templates/field/field--node--field-type--dialogue.html.twig b/web/themes/custom/hoeringsportal/templates/field/field--node--field-type--dialogue.html.twig
new file mode 100755
index 000000000..bfa38e836
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/field/field--node--field-type--dialogue.html.twig
@@ -0,0 +1,61 @@
+{#
+/**
+ * @file
+ * Theme override for a field.
+ *
+ * To override output, copy the "field.html.twig" from the templates directory
+ * to your theme's directory and customize it, just like customizing other
+ * Drupal templates such as page.html.twig or node.html.twig.
+ *
+ * Instead of overriding the theming for all fields, you can also just override
+ * theming for a subset of fields using
+ * @link themeable Theme hook suggestions. @endlink For example,
+ * here are some theme hook suggestions that can be used for a field_foo field
+ * on an article node type:
+ * - field--node--field-foo--article.html.twig
+ * - field--node--field-foo.html.twig
+ * - field--node--article.html.twig
+ * - field--field-foo.html.twig
+ * - field--text-with-summary.html.twig
+ * - field.html.twig
+ *
+ * Available variables:
+ * - attributes: HTML attributes for the containing element.
+ * - label_hidden: Whether to show the field label or not.
+ * - title_attributes: HTML attributes for the title.
+ * - label: The label for the field.
+ * - multiple: TRUE if a field can contain multiple items.
+ * - items: List of all the field items. Each item contains:
+ * - attributes: List of HTML attributes for each item.
+ * - content: The field item's content.
+ * - entity_type: The entity type to which the field belongs.
+ * - field_name: The name of the field.
+ * - field_type: The type of the field.
+ * - label_display: The display settings for the label.
+ *
+ * @see template_preprocess_field()
+ */
+#}
+
+{% if label_hidden %}
+ {% if multiple %}
+ {% for item in items %}
+ {{ item.content }}
+ {% endfor %}
+ {% else %}
+ {% for item in items %}
+ {{ item.content }}
+ {% endfor %}
+ {% endif %}
+{% else %}
+ {{ label }}
+ {% if multiple %} +
+ {% endif %}
+ {% for item in items %}
+ {{ item.content }}
+ {% endfor %}
+ {% if multiple %}
+
+ {% endif %}
+{% endif %}
diff --git a/web/themes/custom/hoeringsportal/templates/field/field.html.twig b/web/themes/custom/hoeringsportal/templates/field/field.html.twig
old mode 100755
new mode 100644
diff --git a/web/themes/custom/hoeringsportal/templates/form/__input--files[field-image-upload-0].html.twig b/web/themes/custom/hoeringsportal/templates/form/__input--files[field-image-upload-0].html.twig
new file mode 100644
index 000000000..aee18cdb2
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/form/__input--files[field-image-upload-0].html.twig
@@ -0,0 +1,19 @@
+{#
+/**
+ * @file
+ * Theme override for an 'input' #type form element.
+ *
+ * Available variables:
+ * - attributes: A list of HTML attributes for the input element.
+ * - children: Optional additional rendered elements.
+ *
+ * @see template_preprocess_input()
+ */
+#}
+
+
+
{% set description_position = element['#description_position']|default('bottom') %}
{% if description.content and 'top' == description_position %}
- {{ description.content }}
+
diff --git a/web/themes/custom/hoeringsportal/templates/form/form--node-dialogue-proposal-form.html.twig b/web/themes/custom/hoeringsportal/templates/form/form--node-dialogue-proposal-form.html.twig
new file mode 100644
index 000000000..ceb128ea2
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/form/form--node-dialogue-proposal-form.html.twig
@@ -0,0 +1,26 @@
+{#
+/**
+ * @file
+ * Theme override for a 'form' element.
+ *
+ * Available variables
+ * - attributes: A list of HTML attributes for the wrapper element.
+ * - children: The child elements of the form.
+ *
+ * @see template_preprocess_form()
+ */
+#}
+
+
+ {{ children }}
+
diff --git a/web/themes/custom/hoeringsportal/templates/form/form-element--checkbox.html.twig b/web/themes/custom/hoeringsportal/templates/form/form-element--checkbox.html.twig
new file mode 100755
index 000000000..bad0ecf91
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/form/form-element--checkbox.html.twig
@@ -0,0 +1,47 @@
+{#
+/**
+ * @file
+ * Theme override for a form element.
+ *
+ * Available variables:
+ * - attributes: HTML attributes for the containing element.
+ * - errors: (optional) Any errors for this form element, may not be set.
+ * - prefix: (optional) The form element prefix, may not be set.
+ * - suffix: (optional) The form element suffix, may not be set.
+ * - required: The required marker, or empty if the associated form element is
+ * not required.
+ * - type: The type of the element.
+ * - name: The name of the element.
+ * - label: A rendered label element.
+ * - label_display: Label display setting. It can have these values:
+ * - before: The label is output before the element. This is the default.
+ * The label includes the #title and the required marker, if #required.
+ * - after: The label is output after the element. For example, this is used
+ * for radio and checkbox #type elements. If the #title is empty but the
+ * field is #required, the label will contain only the required marker.
+ * - invisible: Labels are critical for screen readers to enable them to
+ * properly navigate through forms but can be visually distracting. This
+ * property hides the label for everyone except screen readers.
+ * - attribute: Set the title attribute on the element to create a tooltip but
+ * output no label element. This is supported only for checkboxes and radios
+ * in \Drupal\Core\Render\Element\CompositeFormElementTrait::preRenderCompositeFormElement().
+ * It is used where a visual label is not needed, such as a table of
+ * checkboxes where the row and column provide the context. The tooltip will
+ * include the title and required marker.
+ * - description: (optional) A list of description properties containing:
+ * - content: A description of the form element, may not be set.
+ * - attributes: (optional) A list of HTML attributes to apply to the
+ * description content wrapper. Will only be set when description is set.
+ * - description_display: Description display setting. It can have these values:
+ * - before: The description is output before the element.
+ * - after: The description is output after the element. This is the default
+ * value.
+ * - invisible: The description is output after the element, hidden visually
+ * but available to screen readers.
+ * - disabled: True if the element is disabled.
+ * - title_display: Title display setting.
+ *
+ * @see template_preprocess_form_element()
+ */
+#}
+{% extends 'themes/custom/hoeringsportal/templates/components/toggle-button.html.twig' %}
diff --git a/web/themes/custom/hoeringsportal/templates/form/form-element--dialogue-proposals--block-1.html.twig b/web/themes/custom/hoeringsportal/templates/form/form-element--dialogue-proposals--block-1.html.twig
new file mode 100755
index 000000000..83f15e4a6
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/form/form-element--dialogue-proposals--block-1.html.twig
@@ -0,0 +1,97 @@
+{#
+/**
+ * @file
+ * Theme override for a form element.
+ *
+ * Available variables:
+ * - attributes: HTML attributes for the containing element.
+ * - errors: (optional) Any errors for this form element, may not be set.
+ * - prefix: (optional) The form element prefix, may not be set.
+ * - suffix: (optional) The form element suffix, may not be set.
+ * - required: The required marker, or empty if the associated form element is
+ * not required.
+ * - type: The type of the element.
+ * - name: The name of the element.
+ * - label: A rendered label element.
+ * - label_display: Label display setting. It can have these values:
+ * - before: The label is output before the element. This is the default.
+ * The label includes the #title and the required marker, if #required.
+ * - after: The label is output after the element. For example, this is used
+ * for radio and checkbox #type elements. If the #title is empty but the
+ * field is #required, the label will contain only the required marker.
+ * - invisible: Labels are critical for screen readers to enable them to
+ * properly navigate through forms but can be visually distracting. This
+ * property hides the label for everyone except screen readers.
+ * - attribute: Set the title attribute on the element to create a tooltip but
+ * output no label element. This is supported only for checkboxes and radios
+ * in \Drupal\Core\Render\Element\CompositeFormElementTrait::preRenderCompositeFormElement().
+ * It is used where a visual label is not needed, such as a table of
+ * checkboxes where the row and column provide the context. The tooltip will
+ * include the title and required marker.
+ * - description: (optional) A list of description properties containing:
+ * - content: A description of the form element, may not be set.
+ * - attributes: (optional) A list of HTML attributes to apply to the
+ * description content wrapper. Will only be set when description is set.
+ * - description_display: Description display setting. It can have these values:
+ * - before: The description is output before the element.
+ * - after: The description is output after the element. This is the default
+ * value.
+ * - invisible: The description is output after the element, hidden visually
+ * but available to screen readers.
+ * - disabled: True if the element is disabled.
+ * - title_display: Title display setting.
+ *
+ * @see template_preprocess_form_element()
+ */
+#}
+{%
+set classes = [
+'js-form-item',
+'form-item',
+'mb-3',
+'me-3',
+'js-form-type-' ~ type|clean_class,
+'form-item-' ~ name|clean_class,
+'js-form-item-' ~ name|clean_class,
+title_display not in ['after', 'before'] ? 'form-no-label',
+disabled == 'disabled' ? 'form-disabled',
+errors ? 'form-item--error',
+]
+%}
+{%
+set description_classes = [
+'description',
+'text-muted',
+description_display == 'invisible' ? 'visually-hidden',
+]
+%}
+
+ {% if label_display in ['before', 'invisible'] %}
+ {{ label }}
+ {% endif %}
+ {% if prefix is not empty %}
+ {{ prefix }}
+ {% endif %}
+ {% if description_display == 'before' and description.content %}
+
+ {{ description.content }}
+
+ {% endif %}
+ {{ children }}
+ {% if suffix is not empty %}
+ {{ suffix }}
+ {% endif %}
+ {% if label_display == 'after' %}
+ {{ label }}
+ {% endif %}
+ {% if errors %}
+
+ {% endif %}
+ {% if description_display in ['after', 'invisible'] and description.content %}
+
+
diff --git a/web/themes/custom/hoeringsportal/templates/form/form--views-exposed-form-dialogue-proposals-block-1.html.twig b/web/themes/custom/hoeringsportal/templates/form/form--views-exposed-form-dialogue-proposals-block-1.html.twig
new file mode 100644
index 000000000..97b4b7a3d
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/form/form--views-exposed-form-dialogue-proposals-block-1.html.twig
@@ -0,0 +1,15 @@
+{#
+/**
+ * @file
+ * Theme override for a 'form' element.
+ *
+ * Available variables
+ * - attributes: A list of HTML attributes for the wrapper element.
+ * - children: The child elements of the form.
+ *
+ * @see template_preprocess_form()
+ */
+#}
+
+
+
+{{ 'Create dialog proposal'|t }}
++ {{ 'Fill out the form and send your proposal so other people can interact with it.'|t }} +
+
+ {{ children }}
+
+
+ {{ form }}
diff --git a/web/themes/custom/hoeringsportal/templates/node/_node--1-col-large-image-top.html.twig b/web/themes/custom/hoeringsportal/templates/node/_node--1-col-large-image-top.html.twig
new file mode 100644
index 000000000..fff28e2da
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/node/_node--1-col-large-image-top.html.twig
@@ -0,0 +1,38 @@
+{% block content_top %}
+ {# Header #}
+ {{ include(directory ~ '/templates/components/header-default.html.twig', {
+ images: {0: node.field_project_image},
+ category: content.field_project_category,
+ title: node.label,
+ description: content.field_short_description,
+ tag_fields: {0: content.field_area},
+ shortcuts: {}}
+ ) }}
+{% endblock %}
+{% block content_main %}
+ {# Main container #}
+
+
+
+
+
+ {{ content|without('field_project_image', 'field_short_description', 'field_aside_block', 'field_content_sections', 'field_project_category', 'field_area', 'published_at') }}
+
+
+ {{ content.field_aside_block }}
+
+
+ {{ content.field_content_sections }}
+
+
+
+{% endblock %}
+{% block content_bottom %}
+ {# Newsletter signup #}
+ {% if node_newsletter %}
+ {{ include('@hoeringsportal/newsletter-bottom-link.html.twig') }}
+ {% endif %}
+{% endblock %}
diff --git a/web/themes/custom/hoeringsportal/templates/node/node--project-main-page--full.html.twig b/web/themes/custom/hoeringsportal/templates/node/node--project-main-page--full.html.twig
deleted file mode 100755
index 0229ba1c2..000000000
--- a/web/themes/custom/hoeringsportal/templates/node/node--project-main-page--full.html.twig
+++ /dev/null
@@ -1,33 +0,0 @@
-{# Header #}
-{{ include(directory ~ '/templates/components/header-v2.html.twig', {
- image: node.field_project_image|file_url,
- category: content.field_project_category,
- title: node.label,
- description: content.field_short_description,
- area: content.field_area}
-) }}
-
-{# Main container #}
-
+ {{ content.published_at }}
+
+
-
-
-
-
- {{ content|without('field_project_image', 'field_short_description', 'field_aside_block', 'field_content_sections', 'field_project_category', 'field_area', 'published_at') }}
-
-
- {{ content.field_aside_block }}
-
-
- {{ content.field_content_sections }}
-
-
-
-
-{# Newsletter signup #}
-{% if node_newsletter %}
- {{ include('@hoeringsportal/newsletter-bottom-link.html.twig') }}
-{% endif %}
diff --git a/web/themes/custom/hoeringsportal/templates/paragraph/paragraph--video.html.twig b/web/themes/custom/hoeringsportal/templates/paragraph/paragraph--video.html.twig
new file mode 100644
index 000000000..37f109ba2
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/paragraph/paragraph--video.html.twig
@@ -0,0 +1,54 @@
+{#
+/**
+ * @file
+ * Default theme implementation to display a paragraph.
+ *
+ * Available variables:
+ * - paragraph: Full paragraph entity.
+ * Only method names starting with "get", "has", or "is" and a few common
+ * methods such as "id", "label", and "bundle" are available. For example:
+ * - paragraph.getCreatedTime() will return the paragraph creation timestamp.
+ * - paragraph.id(): The paragraph ID.
+ * - paragraph.bundle(): The type of the paragraph, for example, "image" or "text".
+ * - paragraph.getOwnerId(): The user ID of the paragraph author.
+ * See Drupal\paragraphs\Entity\Paragraph for a full list of public properties
+ * and methods for the paragraph object.
+ * - content: All paragraph items. Use {{ content }} to print them all,
+ * or print a subset such as {{ content.field_example }}. Use
+ * {{ content|without('field_example') }} to temporarily suppress the printing
+ * of a given child element.
+ * - attributes: HTML attributes for the containing element.
+ * The attributes.class element may contain one or more of the following
+ * classes:
+ * - paragraphs: The current template type (also known as a "theming hook").
+ * - paragraphs--type-[type]: The current paragraphs type. For example, if the paragraph is an
+ * "Image" it would result in "paragraphs--type--image". Note that the machine
+ * name will often be in a short form of the human readable label.
+ * - paragraphs--view-mode--[view_mode]: The View Mode of the paragraph; for example, a
+ * preview would result in: "paragraphs--view-mode--preview", and
+ * default: "paragraphs--view-mode--default".
+ * - view_mode: View mode; for example, "preview" or "full".
+ * - logged_in: Flag for authenticated user status. Will be true when the
+ * current user is a logged-in member.
+ * - is_admin: Flag for admin user status. Will be true when the current user
+ * is an administrator.
+ *
+ * @see template_preprocess_paragraph()
+ *
+ * @ingroup themeable
+ */
+#}
+
- {{ content.published_at }}
-
-
+
diff --git a/web/themes/custom/hoeringsportal/templates/views/views-view--dialogue-proposals.html.twig b/web/themes/custom/hoeringsportal/templates/views/views-view--dialogue-proposals.html.twig
new file mode 100755
index 000000000..c0a623ab0
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/views/views-view--dialogue-proposals.html.twig
@@ -0,0 +1,71 @@
+{#
+/**
+ * @file
+ * Theme override for main view template.
+ *
+ * Available variables:
+ * - attributes: Remaining HTML attributes for the element.
+ * - css_name: A css-safe version of the view name.
+ * - css_class: The user-specified classes names, if any.
+ * - header: The optional header.
+ * - footer: The optional footer.
+ * - rows: The results of the view query, if any.
+ * - empty: The content to display if there are no rows.
+ * - pager: The optional pager next/prev links to display.
+ * - exposed: Exposed widget form/info to display.
+ * - feed_icons: Optional feed icons to display.
+ * - more: An optional link to the next page of results.
+ * - title: Title of the view, only used when displaying in the admin preview.
+ * - title_prefix: Additional output populated by modules, intended to be
+ * displayed in front of the view title.
+ * - title_suffix: Additional output populated by modules, intended to be
+ * displayed after the view title.
+ * - attachment_before: An optional attachment view to be displayed before the
+ * view content.
+ * - attachment_after: An optional attachment view to be displayed after the
+ * view content.
+ * - dom_id: Unique id for every view being printed to give unique class for
+ * Javascript.
+ *
+ * @see template_preprocess_views_view()
+ */
+#}
+{%
+ set classes = [
+ dom_id ? 'js-view-dom-id-' ~ dom_id,
+ 'dialogue-proposals',
+ 'container'
+ ]
+%}
+
+
+
+ {% block paragraph %}
+ {% if content.field_paragraph_title['#items'] is not empty %}
+
+ {{ content.field_paragraph_title }}
+ {% endif %} + {% block content %} + {{ content|without('field_paragraph_title') }} + {% endblock %} + {% endblock paragraph %} +
+ {{ exposed }}
+
+
+ {{ attachment_before }}
+
+ {{ rows }}
+ {{ empty }}
+ {{ pager }}
+
+ {{ attachment_after }}
+ {{ more }}
+
+ {% if footer %}
+
+ {% endif %}
+
+ {{ feed_icons }}
+
diff --git a/web/themes/custom/hoeringsportal/templates/views/views-view-unformatted--dialogue-proposals.html.twig b/web/themes/custom/hoeringsportal/templates/views/views-view-unformatted--dialogue-proposals.html.twig
new file mode 100755
index 000000000..5e18e0b04
--- /dev/null
+++ b/web/themes/custom/hoeringsportal/templates/views/views-view-unformatted--dialogue-proposals.html.twig
@@ -0,0 +1,27 @@
+{#
+/**
+ * @file
+ * Theme override to display a view of unformatted rows.
+ *
+ * Available variables:
+ * - title: The title of this group of rows. May be empty.
+ * - rows: A list of the view's row items.
+ * - attributes: The row's HTML attributes.
+ * - content: The row's content.
+ * - view: The view object.
+ * - default_row_class: A flag indicating whether default classes should be
+ * used on rows.
+ *
+ * @see template_preprocess_views_view_unformatted()
+ */
+#}
+
+{% if title %}
+
diff --git a/web/themes/custom/hoeringsportal/webpack.config.js b/web/themes/custom/hoeringsportal/webpack.config.js
index f8869b5ba..3ebbda20f 100755
--- a/web/themes/custom/hoeringsportal/webpack.config.js
+++ b/web/themes/custom/hoeringsportal/webpack.config.js
@@ -18,6 +18,7 @@ Encore
.addEntry('hoeringsportal', './assets/js/hoeringsportal.js')
.addEntry('deskpro-custom-css', './assets/js/deskpro-custom-css.js')
.addEntry('show-map', './assets/js/show-map.js')
+ .addEntry('image-fade', './assets/js/image-fade.js')
// Bootstrap expects jQuery to be available as a global variable.
// (cf. http://symfony.com/doc/current/frontend/encore/bootstrap.html#importing-bootstrap-javascript).