UHF-9588: Merge branch 'UHF-9588' of https://github.com/City-of-Helsi…

…nki/drupal-hdbt into UHF-9588

src/scss/06_components/paragraphs/_hearings.scss

@@ -1,26 +1,25 @@
 .component--hearings {
+  @include component-side-padding;
   background: $color-silver-light;
 }
 
-.component--hearings .component__container {
-  padding-bottom: $spacing-double;
-  padding-top: $spacing-double;
-
-  @include breakpoint($breakpoint-m) {
-    padding-bottom: $spacing-quadruple;
-    padding-top: $spacing-quadruple;
-  }
-}
-
 .hearings__count-container {
-  @include font('small');
-  margin-bottom: $spacing;
+  @include font('lead');
+  margin-bottom: $spacing-and-half;
 
   .hearings__count {
     font-weight: $font-weight-bold;
   }
 }
 
-.hearings__results {
-  margin-bottom: $spacing-double;
+.hearings__list {
+  margin-top: $spacing-and-half;
+}
+
+.hearings__link-wrapper {
+  margin-top: $spacing-double;
+
+  @include breakpoint($breakpoint-m) {
+    margin-top: $spacing-quadruple;
+  }
 }

templates/navigation/link-button.html.twig

@@ -7,23 +7,31 @@
  * - open_in_a_new_window: Boolean for opening in a new window and showing explanation.
  * - icon: Boolean if first icon is enabled
  * - icon_type: String for first icon type
+ * - link_options: array of attributes for the link such as class or data-attributes.
  *
  * Usage example:
  * {% include '@hdbt/navigation/link-button.html.twig' with {
  *   type: 'primary',
  *   label: item.content['#title'],
  *   url: item.content['#url'],
- *   class: 'service-channel__link--example',
+ *   link_options: {'class': ['service-channel__link--example']},
  *   open_in_a_new_window: true,
  * } %}
  *
  * TODO: UHF-8793 Refactor hds-button (https://helsinkisolutionoffice.atlassian.net/browse/UHF-8793).
  */
 #}
-{% set link_options = {
-  'data-hds-component':'button',
-  'data-hds-variant': type,
-} %}
+{% if link_options %}
+  {% set link_options = link_options|merge({
+    'data-hds-component':'button',
+    'data-hds-variant': type,
+  }) %}
+{% else %}
+  {% set link_options = {
+    'data-hds-component':'button',
+    'data-hds-variant': type,
+  } %}
+{% endif %}
 
 {% if open_in_a_new_window %}
   {% set link_options = link_options|merge({target: '_blank', 'data-open-in-new-tab': true}) %}

templates/paragraphs/paragraph--hearings.html.twig

@@ -3,6 +3,7 @@
   {% embed "@hdbt/misc/component.twig" with
     {
       component_classes: [
+      'component--full-width',
       'component--hearings',
     ],
       component_title_level: 'h2',
@@ -12,30 +13,34 @@
     }
   %}
     {% block component_content %}
-      {% if content.list %}
-        {% set hearings_count = content.list[0]['#helfi_hearings'].get('count')[0].value %}
-        <section class="hearings__results">
+      <div class="hearings__list">
+        {% if content.list %}
+          {% set hearings_count = content.list[0]['#helfi_hearings'].get('count')[0].value %}
           <div class="hearings__count-container">
             <span class="hearings__count">{{ hearings_count }}</span>
             {% trans with {'context': 'Hearings count'}%}hearing open for commenting{% plural hearings_count %}hearings open for commenting{% endtrans %}
           </div>
           {{ content.list }}
-        </section>
-        {% include '@hdbt/navigation/link-button.html.twig' with {
-          type: 'primary',
-          label: 'See all hearings'|t({},{'context': 'See all hearings link text'}),
-          url: 'https://kerrokantasi.hel.fi/hearings/list?lang=' ~ current_langcode,
-        } %}
-      {% else %}
-        <section class="hearings__results">
+          <div class="hearings__link-wrapper">
+            {% include '@hdbt/navigation/link-button.html.twig' with {
+              type: 'primary',
+              label: 'See all hearings'|t({},{'context': 'See all hearings link text'}),
+              url: 'https://kerrokantasi.hel.fi/hearings/list?lang=' ~ current_langcode,
+              link_options: {'class': ['hearings__link']},
+            } %}
+          </div>
+        {% else %}
           <p>{{ "At the moment there is no open hearings for commenting."|t }}</p>
-        </section>
-        {% include '@hdbt/navigation/link-button.html.twig' with {
-          type: 'primary',
-          label: 'See all already closed hearings'|t({},{'context': 'See closed hearings link text'}),
-          url: 'https://kerrokantasi.hel.fi/hearings/list?lang=' ~ current_langcode,
-        } %}
-      {% endif %}
+          <div class="hearings__link-wrapper">
+            {% include '@hdbt/navigation/link-button.html.twig' with {
+              type: 'primary',
+              label: 'See all already closed hearings'|t({},{'context': 'See closed hearings link text'}),
+              url: 'https://kerrokantasi.hel.fi/hearings/list?lang=' ~ current_langcode,
+              link_options: {'class': ['hearings__link']},
+            } %}
+          </div>
+        {% endif %}
+      </div>
     {% endblock component_content %}
   {% endembed %}
 {% endblock paragraph %}

translations/fi.po

@@ -611,7 +611,7 @@ msgid "Activity"
 msgstr "Aktiivisuus"
 
 msgctxt "Hearings count"
-msgid "plan open for commenting"
+msgid "hearing open for commenting"
 msgid_plural "hearings open for commenting"
 msgstr[0] "kuuleminen avoinna kommentoitavaksi"
 msgstr[1] "kuulemiset avoinna kommentoitavaksi"

translations/sv.po

@@ -608,13 +608,19 @@ msgctxt "Label for hearing activity row"
 msgid "Activity"
 msgstr "Aktivitet"
 
+msgctxt "Hearings count"
+msgid "hearing open for commenting"
+msgid_plural "hearings open for commenting"
+msgstr[0] "hörande öppna för kommentarer"
+msgstr[1] "hörendet öppna för kommentarer"
+
 msgctxt "See all hearings link text"
 msgid "See all hearings"
-msgstr "Se alla Hörandet"
+msgstr "Se alla höranden"
 
 msgctxt "See closed hearings link text"
 msgid "See all already closed hearings"
-msgstr "Se alla redan stängda Hörandet"
+msgstr "Se alla redan stängda höranden"
 
 msgctxt "Hearing available in languages"
 msgid "Hearing only available in English"
@@ -632,7 +638,6 @@ msgctxt "News archive filter results heading"
 msgid "Filter news items"
 msgstr "Filtera nyheter"
 
-
 msgctxt "News archive heading"
 msgid "News based on your choices"
 msgstr "Nyheter baserat på dina val"