Rewised media type Bild and License Information

Deutsche-Digitale-Bibliothek · Oct 15, 2024 · e30feba · e30feba
1 parent 9397998
commit e30feba
Show file tree

Hide file tree

Showing 9 changed files with 117 additions and 18 deletions.
diff --git a/composer.json b/composer.json
@@ -32,7 +32,7 @@
         "drupal/easy_breadcrumb": "^2.0",
         "drupal/editor_advanced_link": "^2.0",
         "drupal/eu_cookie_compliance": "^1.19",
-        "drupal/field_group": "^3.2",
+        "drupal/field_group": "^3.6",
         "drupal/field_type_converter": "^1.0@alpha",
         "drupal/field_validation": "^3.0@beta",
         "drupal/focal_point": "^2.0",
@@ -58,6 +58,7 @@
         "drupal/migrate_plus": "^6.0",
         "drupal/migrate_tools": "^6.0",
         "drupal/minifyhtml": "^2.0",
+        "drupal/node_title_help_text": "^1.4",
         "drupal/paragraphs": "^1.13",
         "drupal/pathauto": "^1.9",
         "drupal/rdf": "^3.0@beta",

diff --git a/composer.lock b/composer.lock
diff --git a/...s/custom/ddbp_responsive_image/src/Plugin/Field/FieldFormatter/ImageUrlFieldFormatter.php b/...s/custom/ddbp_responsive_image/src/Plugin/Field/FieldFormatter/ImageUrlFieldFormatter.php
@@ -185,6 +185,9 @@ public function viewElements(FieldItemListInterface $items, $langcode): array {
         $image_copyright = empty($media->get('field_copyright')->value)
           ? ''
           : $media->get('field_copyright')->value;
+        $image_license = empty($media->get('field_document_license')->entity)
+          ? ''
+          : $media->get('field_document_license')->entity->getName();
         $image_copyright_link = $media->get('field_link')->first()
           ? $media->get('field_link')->first()->getUrl()->toString()
           : '';
@@ -293,6 +296,7 @@ public function viewElements(FieldItemListInterface $items, $langcode): array {
                       'image' => $image_copy_url,
                       'title' => $image_title,
                       'text' => $image_copyright,
+                      'license' => $image_license,
                       'link' => $image_copyright_link,
                     ];
                   }

diff --git a/web/themes/custom/ddbp/src/scss/content/_node.scss b/web/themes/custom/ddbp/src/scss/content/_node.scss
@@ -11,7 +11,6 @@
     .paragraph--content-boxes,
     .paragraph--document,
     .paragraph--facts-figures,
-    .paragraph--image,
     .paragraph--link,
     .paragraph--process,
     .paragraph--separator,
@@ -32,6 +31,33 @@
         }
     }
 
+    .paragraph--image {
+        @extend %container-default;
+        max-width: $container-max-width;
+        margin-right: auto;
+        margin-left: auto;
+
+        > .paragraph-inner {
+            position: relative;
+            display: inline-block;
+            max-width: 100%;
+
+            @include bp(xl) {
+                max-width: $column-fixed-content;
+                padding-right: 3.15vw;
+                .responsive-image__desc {
+                  padding-right: 3.15vw;
+                }
+            }
+
+            @include bp(m) {
+              .responsive-image__desc {
+                  position: absolute;
+              }
+            }
+        }
+    }
+
     // reset paragraph's width if inside another paragraph
     .paragraph--accordions,
     .paragraph--block-reference,

diff --git a/web/themes/custom/ddbp/src/scss/elements/_responsive-image.scss b/web/themes/custom/ddbp/src/scss/elements/_responsive-image.scss
@@ -4,7 +4,7 @@
 }
 
 .responsive-image__desc {
-    @include spacing(margin, very-small, top);
+    @include spacing(margin, very-small, top bottom);
     display: flex;
 
     &:before {

diff --git a/web/themes/custom/ddbp/src/scss/paragraphs/_collage.scss b/web/themes/custom/ddbp/src/scss/paragraphs/_collage.scss
@@ -30,6 +30,12 @@
         max-width: 50%;
         margin-bottom: 0;
     }
+
+    .paragraph-collage__image {
+        position: relative;
+        display: inline-block;
+        max-width: 100%;
+    }
 }
 
 .paragraph-collage__content-wrapper {

diff --git a/web/themes/custom/ddbp/templates/paragraph/paragraph--image.html.twig b/web/themes/custom/ddbp/templates/paragraph/paragraph--image.html.twig
@@ -54,7 +54,7 @@
         {% if imageDescription %}
           <div class="responsive-image__desc">
             <div class="text-formatted">
-              <p>{{- imageDescription -}}</p>
+              {{- imageDescription -}}
             </div>
           </div>
         {% endif %}

diff --git a/web/themes/custom/ddbp/templates/partials/responsive-image-empty-alt.html.twig b/web/themes/custom/ddbp/templates/partials/responsive-image-empty-alt.html.twig
@@ -69,7 +69,7 @@
     {% if img.description['#markup'] %}
       <div class="responsive-image__desc">
         <div class="text-formatted">
-          <p>{{- img.description['#markup']|raw -}}</p>
+          {{- img.description['#markup']|raw -}}
         </div>
       </div>
     {% endif %}

diff --git a/web/themes/custom/ddbp/templates/partials/responsive-image.html.twig b/web/themes/custom/ddbp/templates/partials/responsive-image.html.twig
@@ -44,21 +44,24 @@
         </div>
         <span class="responsive-image__copyright-text">
           <strong>{{- copyright.title -}}: </strong>
-          {% if defaultImage.description['#markup'] %}
-            <span>{{- defaultImage.description -}}</span>
-            {% if defaultImage.author['#markup'] %}
-              |
-            {% endif %}
-          {% endif %}
+
+          {% set elements = [] %}
+
           {% if defaultImage.author['#markup'] %}
-            <span>{{ defaultImage.author }}</span>
+            {% set elements = elements|merge([defaultImage.author]) %}
           {% endif %}
+
           {% if copyright.text %}
-            {% if defaultImage.description['#markup'] or defaultImage.author['#markup'] %}
-              |
-            {% endif %}
-            {{- copyright.text -}}
+            {% set elements = elements|merge([copyright.text]) %}
+          {% endif %}
+
+          {% if copyright.license %}
+            {% set elements = elements|merge([copyright.license]) %}
           {% endif %}
+
+          {% for element in elements %}
+            <span>{{ element }}</span>{% if not loop.last %} | {% endif %}
+          {% endfor %}
         </span>
       </div>
     {% endif %}
@@ -71,7 +74,7 @@
     {% if img.description['#markup'] %}
       <div class="responsive-image__desc">
         <div class="text-formatted">
-          <p>{{- img.description['#markup']|raw -}}</p>
+          {{- img.description['#markup']|raw -}}
         </div>
       </div>
     {% endif %}