start responsive boot

web/themes/custom/popsu_colloque/template/fields/field--field-image-hero.html.twig

@@ -38,13 +38,6 @@
  * @ingroup themeable
  */
 #}
-{%
-  set title_classes = [
-    label_display == 'visually_hidden' ? 'visually-hidden',
-  ]
-%}
-
-
-    {% for item in items %}
-      {{ item.content }}
-    {% endfor %}
+{% for item in items %}
+  {{ item.content }}
+{% endfor %}

web/themes/custom/popsu_colloque/template/fields/field--field-image.html.twig

@@ -0,0 +1,43 @@
+{#
+/**
+ * @file
+ * Default theme implementation 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()
+ *
+ * @ingroup themeable
+ */
+#}
+{% for item in items %}
+  {{ item.content }}
+{% endfor %}

web/themes/custom/popsu_colloque/template/node/node--moments.html.twig

@@ -74,20 +74,21 @@
 #}
 <article{{ attributes }}>
 
-  <div class="__hero">
+  <div class="__img-hero">
     {{content.field_image}}
   </div>
 
-  <div class="__wrapper d-flex">
-    <div class="__wrap_side">
+  <div class="__wrapper row">
+    <div class="__title col-12">
+      <h2>{{label}}</h2>
+    </div>
+
+    <div class="__wrap_side col-sm-12 col-md-2">
       {% include 'themes/custom/popsu_colloque/template/components/share_rs.html.twig' %}
     </div>
 
-    <div class="__wrap_content">
+    <div class="__wrap_content col-sm-12 col-md-8">
       <div class="__head">
-        <div class="__title">
-          <h2>{{label}}</h2>
-        </div>
         <div class="d-flex">
           {{ content.field_date_du_programme }}
           {{ content.field_heure_du_moment }}

web/themes/custom/popsu_colloque/template/node/node--page-d-accueil.html.twig

@@ -79,7 +79,7 @@
 
 
 <article{{ attributes }} id="txt_present">
-  <div class="col-8">
+  <div class="col-12 px-0 col-sm-10 col-md-8">
 
     <div class="__title-present">
       {{ content.field_titre_txt_present }}

web/themes/custom/popsu_colloque/template/node/node--presentation.html.twig

@@ -72,15 +72,18 @@
  * @ingroup themeable
  */
 #}
+<div class="__img-hero">
+{{content.field_image}}
+</div>
 <article{{ attributes }} id="presentation">
-  <div class="__hero">
-    {{content.field_image}}
-  </div>
-  <div class="__wrapper d-flex">
-    <div class="__wrap_side">
+  <div class="__wrapper row">
+    <div class="__title col-12">
+      <h2>{{label}}</h2>
+    </div>
+    <div class="__wrap_side col-sm-12 col-md-2">
       {% include 'themes/custom/popsu_colloque/template/components/share_rs.html.twig' %}
     </div>
-    <div class="__wrap_content">
+    <div class="__wrap_content col-sm-12 col-md-8">
       {{content.body}}
       {{content.field_les_notes}}
     </div>

web/themes/custom/popsu_colloque/template/page--node.html.twig

@@ -62,7 +62,7 @@
   <main role="main" class="d-flex container">
     <a id="main-content" tabindex="-1"></a>{# link is in html.html.twig #}
 
-    <div class="layout-content col-12">
+    <div class="layout-content">
       {{ page.content }}
     </div>{# /.layout-content #}
 

web/themes/custom/popsu_colloque/template/views/lists/views-view-unformatted--dernieres_publications.html.twig

@@ -20,14 +20,14 @@
 {% if title %}
   <h3>{{ title }}</h3>
 {% endif %}
-<div class="__slide">
+<div class="row flex-wrap">
   {% for row in rows %}
     {%
       set row_classes = [
         default_row_class ? 'views-row',
       ]
     %}
-    <article class="thumbnails">
+    <article class="thumbnails col-lg-3 col-sm-6 col-12 m-2">
       {{- row.content -}}
     </article>
   {% endfor %}