more blabla

config/sync/core.entity_form_display.node.article.default.yml

@@ -12,7 +12,6 @@ dependencies:
     - field.field.node.article.field_source
     - field.field.node.article.field_tags
     - field.field.node.article.field_thesaurus
-    - field.field.node.article.field_title_image
     - field.field.node.article.field_video
     - field.field.node.article.field_visuel
     - field.field.node.article.field_workflow
@@ -192,14 +191,6 @@ content:
     third_party_settings: {  }
     type: entity_reference_autocomplete
     region: content
-  field_title_image:
-    weight: 30
-    settings:
-      progress_indicator: throbber
-      preview_image_style: thumbnail
-    third_party_settings: {  }
-    type: image_image
-    region: content
   field_video:
     weight: 18
     settings: {  }

config/sync/core.entity_view_display.node.article.default.yml

@@ -12,15 +12,14 @@ dependencies:
     - field.field.node.article.field_source
     - field.field.node.article.field_tags
     - field.field.node.article.field_thesaurus
-    - field.field.node.article.field_title_image
     - field.field.node.article.field_video
     - field.field.node.article.field_visuel
     - field.field.node.article.field_workflow
-    - image.style.card_medium
+    - image.style.article_card_medium
     - node.type.article
   module:
     - datetime_range
-    - image
+    - image_delta_formatter
     - user
 id: node.article.default
 targetEntityType: node
@@ -28,7 +27,7 @@ bundle: article
 mode: default
 content:
   field_date:
-    weight: 2
+    weight: 3
     label: hidden
     settings:
       separator: '-'
@@ -37,23 +36,16 @@ content:
     third_party_settings: {  }
     type: daterange_default
     region: content
-  field_title_image:
-    weight: 3
-    label: above
-    settings:
-      image_style: ''
-      image_link: ''
-    third_party_settings: {  }
-    type: image
-    region: content
   field_visuel:
-    weight: 1
+    weight: 2
     label: hidden
     settings:
-      image_style: card_medium
+      deltas: '0'
+      image_style: article_card_medium
       image_link: ''
+      deltas_reversed: 0
     third_party_settings: {  }
-    type: image
+    type: image_delta_formatter
     region: content
   title:
     label: hidden

config/sync/core.entity_view_display.node.article.teaser.yml

@@ -13,7 +13,6 @@ dependencies:
     - field.field.node.article.field_source
     - field.field.node.article.field_tags
     - field.field.node.article.field_thesaurus
-    - field.field.node.article.field_title_image
     - field.field.node.article.field_video
     - field.field.node.article.field_visuel
     - field.field.node.article.field_workflow
@@ -64,7 +63,6 @@ hidden:
   field_source: true
   field_tags: true
   field_thesaurus: true
-  field_title_image: true
   field_video: true
   field_workflow: true
   langcode: true

config/sync/field.field.node.article.field_title_image.yml

@@ -1,38 +0,0 @@
-uuid: aa383106-4ca8-41cd-9e0b-64ae0b43a60c
-langcode: en
-status: true
-dependencies:
-  config:
-    - field.storage.node.field_title_image
-    - node.type.article
-  module:
-    - image
-id: node.article.field_title_image
-field_name: field_title_image
-entity_type: node
-bundle: article
-label: 'title image'
-description: ''
-required: false
-translatable: false
-default_value: {  }
-default_value_callback: ''
-settings:
-  file_directory: '[date:custom:Y]-[date:custom:m]'
-  file_extensions: 'png gif jpg jpeg'
-  max_filesize: ''
-  max_resolution: ''
-  min_resolution: ''
-  alt_field: false
-  alt_field_required: true
-  title_field: false
-  title_field_required: false
-  default_image:
-    uuid: ''
-    alt: ''
-    title: ''
-    width: null
-    height: null
-  handler: 'default:file'
-  handler_settings: {  }
-field_type: image

config/sync/field.storage.node.field_title_image.yml

@@ -1,34 +0,0 @@
-uuid: f2e7c791-dbf2-48dd-83c5-c9a2b0bda4b9
-langcode: en
-status: true
-dependencies:
-  module:
-    - field_permissions
-    - file
-    - image
-    - node
-third_party_settings:
-  field_permissions:
-    permission_type: public
-id: node.field_title_image
-field_name: field_title_image
-entity_type: node
-type: image
-settings:
-  uri_scheme: public
-  default_image:
-    uuid: ''
-    alt: ''
-    title: ''
-    width: null
-    height: null
-  target_type: file
-  display_field: false
-  display_default: false
-module: image
-locked: false
-cardinality: 1
-translatable: true
-indexes: {  }
-persist_with_no_fields: false
-custom_storage: false

config/sync/views.view.blabla.yml

@@ -6,7 +6,6 @@ dependencies:
     - core.entity_view_mode.node.teaser
     - field.storage.node.body
     - field.storage.node.field_date
-    - field.storage.node.field_title_image
     - field.storage.node.field_visuel
     - image.style.article_card_medium
     - node.type.article
@@ -289,70 +288,6 @@ display:
           entity_type: node
           entity_field: uuid
           plugin_id: field
-        field_title_image:
-          id: field_title_image
-          table: node__field_title_image
-          field: field_title_image
-          relationship: none
-          group_type: group
-          admin_label: ''
-          label: ''
-          exclude: false
-          alter:
-            alter_text: false
-            text: ''
-            make_link: false
-            path: ''
-            absolute: false
-            external: false
-            replace_spaces: false
-            path_case: none
-            trim_whitespace: false
-            alt: ''
-            rel: ''
-            link_class: ''
-            prefix: ''
-            suffix: ''
-            target: ''
-            nl2br: false
-            max_length: 0
-            word_boundary: true
-            ellipsis: true
-            more_link: false
-            more_link_text: ''
-            more_link_path: ''
-            strip_tags: false
-            trim: false
-            preserve_tags: ''
-            html: false
-          element_type: ''
-          element_class: ''
-          element_label_type: ''
-          element_label_class: ''
-          element_label_colon: false
-          element_wrapper_type: ''
-          element_wrapper_class: ''
-          element_default_classes: true
-          empty: ''
-          hide_empty: false
-          empty_zero: false
-          hide_alter_empty: true
-          click_sort_column: target_id
-          type: image
-          settings:
-            image_style: article_card_medium
-            image_link: ''
-          group_column: ''
-          group_columns: {  }
-          group_rows: true
-          delta_limit: 0
-          delta_offset: 0
-          delta_reversed: false
-          delta_first_last: false
-          multi_type: separator
-          separator: ', '
-          field_api_classes: false
-          plugin_id: field
         field_visuel:
           id: field_visuel
           table: node__field_visuel
@@ -791,7 +726,6 @@ display:
       tags:
         - 'config:field.storage.node.body'
         - 'config:field.storage.node.field_date'
-        - 'config:field.storage.node.field_title_image'
         - 'config:field.storage.node.field_visuel'
   page_1:
     display_plugin: page
@@ -822,7 +756,6 @@ display:
       tags:
         - 'config:field.storage.node.body'
         - 'config:field.storage.node.field_date'
-        - 'config:field.storage.node.field_title_image'
         - 'config:field.storage.node.field_visuel'
   rest_export_1:
     display_plugin: rest_export
@@ -879,5 +812,4 @@ display:
       tags:
         - 'config:field.storage.node.body'
         - 'config:field.storage.node.field_date'
-        - 'config:field.storage.node.field_title_image'
         - 'config:field.storage.node.field_visuel'

web/themes/custom/materiotheme/assets/styles/main.scss

@@ -460,7 +460,7 @@ article.node--type-frontpage{
 
         .cards-list-home{
           position: relative;
-          $bp: ($column_width + $column_goutiere );
+          $bp: ($column_width*2 + $column_goutiere );
           overflow-y: hidden;
 
           @media only screen and (max-width: $bp * 6){
@@ -474,7 +474,7 @@ article.node--type-frontpage{
             width:100%;
             margin:0; padding:0;
             display: grid;
-            grid-template-columns: repeat(auto-fill, minmax(80px, 220px));
+            grid-template-columns: repeat(auto-fill, minmax(80px, $column_width*2));
             // grid-template-rows: 1fr;
             grid-gap: 1em;
             justify-content:start;
@@ -482,7 +482,7 @@ article.node--type-frontpage{
               position: relative;
               list-style: none;
               margin:0; padding:0;
-              padding-top: 140%;
+              padding-top: 67.8%;
               overflow: hidden;
               .card{
                 position:absolute;

web/themes/custom/materiotheme/vuejs/components/Content/ArticleCard.vue

@@ -12,8 +12,7 @@
       <h4 v-if="false" class="body" v-html="item.body"></h4>
     </header>
     <section class="images">
-      <figure v-if="item.field_title_image !== ''" v-html="item.field_title_image"></figure>
+      <figure v-html="item.field_visuel"></figure>
-      <figure v-else-if="item.field_visuel !== ''" v-html="item.field_visuel"></figure>
     </section>
   </article>
 </template>