updated core, prepared concernement form layout for interactive boussole

src/web/themes/custom/ouatminimal_theme/config/optional/block.block.ouatminimal_content.yml

@@ -0,0 +1,19 @@
+langcode: en
+status: true
+dependencies:
+  module:
+    - system
+  theme:
+    - ouatminimal
+id: ouatminimal_content
+theme: ouatminimal
+region: content
+weight: 0
+provider: null
+plugin: system_main_block
+settings:
+  id: system_main_block
+  label: 'Main page content'
+  provider: system
+  label_display: '0'
+visibility: {  }

src/web/themes/custom/ouatminimal_theme/config/optional/block.block.ouatminimal_help.yml

@@ -0,0 +1,19 @@
+langcode: en
+status: true
+dependencies:
+  module:
+    - help
+  theme:
+    - ouatminimal
+id: ouatminimal_help
+theme: ouatminimal
+region: help
+weight: 0
+provider: null
+plugin: help_block
+settings:
+  id: help_block
+  label: Help
+  provider: help
+  label_display: '0'
+visibility: {  }

src/web/themes/custom/ouatminimal_theme/config/optional/block.block.ouatminimal_local_actions.yml

@@ -0,0 +1,17 @@
+langcode: en
+status: true
+dependencies:
+  theme:
+    - ouatminimal
+id: ouatminimal_local_actions
+theme: ouatminimal
+region: content
+weight: -10
+provider: null
+plugin: local_actions_block
+settings:
+  id: local_actions_block
+  label: 'Primary admin actions'
+  provider: core
+  label_display: '0'
+visibility: {  }

src/web/themes/custom/ouatminimal_theme/config/optional/block.block.ouatminimal_login.yml

@@ -0,0 +1,19 @@
+langcode: en
+status: true
+dependencies:
+  module:
+    - user
+  theme:
+    - ouatminimal
+id: ouatminimal_login
+theme: ouatminimal
+region: content
+weight: 10
+provider: null
+plugin: user_login_block
+settings:
+  id: user_login_block
+  label: 'User login'
+  provider: user
+  label_display: visible
+visibility: {  }

src/web/themes/custom/ouatminimal_theme/config/optional/block.block.ouatminimal_messages.yml

@@ -0,0 +1,19 @@
+langcode: en
+status: true
+dependencies:
+  module:
+    - system
+  theme:
+    - ouatminimal
+id: ouatminimal_messages
+theme: ouatminimal
+region: highlighted
+weight: 0
+provider: null
+plugin: system_messages_block
+settings:
+  id: system_messages_block
+  label: 'Status messages'
+  provider: system
+  label_display: '0'
+visibility: {  }

src/web/themes/custom/ouatminimal_theme/config/optional/block.block.ouatminimal_page_title.yml

@@ -0,0 +1,17 @@
+langcode: en
+status: true
+dependencies:
+  theme:
+    - ouatminimal
+id: ouatminimal_page_title
+theme: ouatminimal
+region: header
+weight: -30
+provider: null
+plugin: page_title_block
+settings:
+  id: page_title_block
+  label: 'Page title'
+  provider: core
+  label_display: '0'
+visibility: {  }

src/web/themes/custom/ouatminimal_theme/config/optional/block.block.ouatminimal_primary_local_tasks.yml

@@ -0,0 +1,19 @@
+langcode: en
+status: true
+dependencies:
+  theme:
+    - ouatminimal
+id: ouatminimal_primary_local_tasks
+theme: ouatminimal
+region: header
+weight: 0
+provider: null
+plugin: local_tasks_block
+settings:
+  id: local_tasks_block
+  label: 'Primary tabs'
+  provider: core
+  label_display: '0'
+  primary: true
+  secondary: false
+visibility: {  }

src/web/themes/custom/ouatminimal_theme/config/optional/block.block.ouatminimal_secondary_local_tasks.yml

@@ -0,0 +1,19 @@
+langcode: en
+status: true
+dependencies:
+  theme:
+    - ouatminimal
+id: ouatminimal_secondary_local_tasks
+theme: ouatminimal
+region: pre_content
+weight: 0
+provider: null
+plugin: local_tasks_block
+settings:
+  id: local_tasks_block
+  label: 'Secondary tabs'
+  provider: core
+  label_display: '0'
+  primary: false
+  secondary: true
+visibility: {  }

src/web/themes/custom/ouatminimal_theme/config/optional/block.block.outminimal_breadcrumbs.yml

@@ -0,0 +1,19 @@
+langcode: en
+status: true
+dependencies:
+  module:
+    - system
+  theme:
+    - ouatminimal
+id: ouatminimal_breadcrumbs
+theme: ouatminimal
+region: breadcrumb
+weight: 0
+provider: null
+plugin: system_breadcrumb_block
+settings:
+  id: system_breadcrumb_block
+  label: Breadcrumbs
+  provider: system
+  label_display: '0'
+visibility: {  }

src/web/themes/custom/ouatminimal_theme/css/ouatminimal.css

@@ -0,0 +1,222 @@
+.adminimal input.form-autocomplete, .adminimal input.form-text, .adminimal input.form-tel, .adminimal input.form-email, .adminimal input.form-url, .adminimal input.form-search, .adminimal input.form-number, .adminimal input.form-color, .adminimal input.form-file, .adminimal input.form-date, .adminimal input.form-time, .adminimal textarea.form-textarea{
+  background-color: #fff;
+  border-radius: 3px;
+}
+
+.adminimal select{
+  background-color: #fff;
+  border-radius: 3px;
+}
+
+.adminimal .button {
+  /* background-color: #2196F3; */
+  border-radius: 5px;
+  padding: 0.3em 0.5em;
+}
+.adminimal .button,
+.adminimal .image-button {
+  margin-right: 0.5em;
+  margin-left: 0.5em;
+}
+.adminimal .button:first-child,
+.adminimal .image-button:first-child {
+  margin-right: 0;
+  margin-left: 0;
+}
+
+.js td .dropbutton-multiple{
+  border-radius: 3px;
+}
+.views-exposed-form{
+  font-size: 0.9em;
+}
+.views-exposed-form input[type="text"]{
+  max-width:10em;
+}
+.views-exposed-form input[type="text"].form-autocomplete{
+  max-width:14em;
+}
+.views-exposed-form select.form-select{
+  min-height: 0;
+  padding: 0.2em 0.4em 0.2em 0.5em;
+}
+
+/**
+ * Node add/edit form layout
+ */
+
+/* Narrow screens */
+.layout-region {
+  box-sizing: border-box;
+}
+
+/* Wide screens */
+@media
+  screen and (min-width: 780px),
+  (orientation: landscape) and (min-device-height: 780px) {
+  
+  .layout-region-node-center{
+    display: flex;
+    flex-direction: row;
+    gap: 1em;
+  }
+
+  [dir="rtl"] .layout-region-node-center{
+    display: flex;
+    flex-direction: row-reverse;
+  }
+
+  .layout-region-node-main {
+    /* reset */
+    float: none;
+    box-sizing: border-box;
+    width: auto;
+    padding-right:0; /* LTR */
+    /* custom */
+    flex: 1 0 auto;
+  }
+
+  [dir="rtl"] .layout-region-node-main{
+    float: none;
+    padding-right: 0;
+    padding-left: 0;
+  }
+
+  .layout-region-node-secondary {
+    /* reset */
+    float: none; /* LTR */
+    width: auto;
+    /* custom */
+    flex: 0 0 25em;
+  }
+
+  [dir="rtl"] .layout-region-node-secondary {
+    float: none;
+  }
+
+  /* @todo File an issue to add a standard class to all text-like inputs */
+  .layout-region-node-secondary .form-autocomplete,
+  .layout-region-node-secondary .form-text,
+  .layout-region-node-secondary .form-tel,
+  .layout-region-node-secondary .form-email,
+  .layout-region-node-secondary .form-url,
+  .layout-region-node-secondary .form-search,
+  .layout-region-node-secondary .form-number,
+  .layout-region-node-secondary .form-color,
+  .layout-region-node-secondary textarea {
+    box-sizing: border-box;
+    width: 100%;
+    max-width: 100%;
+  }
+}
+
+/**
+ * The vertical toolbar mode gets triggered for narrow screens, which throws off
+ * the intent of media queries written for the viewport width. When the vertical
+ * toolbar is on, we need to suppress layout for the original media width + the
+ * toolbar width (240px). In this case, 240px + 780px.
+ */
+@media
+  screen and (max-width: 1020px) {
+  .toolbar-vertical.toolbar-tray-open .layout-region-node-center{
+    display: block;
+  }
+  .toolbar-vertical.toolbar-tray-open .layout-region-node-main,
+  .toolbar-vertical.toolbar-tray-open .layout-region-node-footer,
+  .toolbar-vertical.toolbar-tray-open .layout-region-node-secondary {
+    float: none;
+    width: auto;
+    padding-right: 0;
+  }
+}
+
+
+/* BOUSSOLE FORM */
+
+.boussole-layout{
+  display: flex;
+  flex-direction: row;
+  gap: 1em;
+}
+
+.boussole-layout .form-item[data-drupal-selector="edit-field-entite"]{
+  flex:0 0 31em;
+}
+.boussole-layout .boussole-wrapper{
+  flex:1 1 auto;
+}
+
+/* drupal form optimisation */
+.boussole-layout .form-item[data-drupal-selector="edit-field-entite"] table.field-multiple-table>tbody>tr{
+  border: none;
+}
+.boussole-layout .form-item[data-drupal-selector="edit-field-entite"] table.field-multiple-table>tbody>tr>td.field-multiple-drag{
+  
+}
+.boussole-layout .form-item[data-drupal-selector="edit-field-entite"] table.field-multiple-table>tbody>tr>td:not(.field-multiple-drag)>div{
+  padding:0.5em;
+  border: 1px solid #bbb;
+  border-radius: 5px;
+}
+
+.boussole-layout .form-item[data-drupal-selector="edit-field-entite"] table.field-multiple-table>tbody>tr>td:not(.field-multiple-drag) > div .horizontal-tabs-panes>details>.seven-details__wrapper{
+  padding:0;
+}
+.boussole-layout .form-item[data-drupal-selector="edit-field-entite"] .field--type-entity-reference.field--name-field-entite.field--widget-inline-entity-form-complex>div>fieldset{
+  border: none;
+  margin:0;
+  padding:0;
+}
+.boussole-layout .form-item[data-drupal-selector="edit-field-entite"] .field--type-entity-reference.field--name-field-entite.field--widget-inline-entity-form-complex>div>fieldset>legend{
+  display:none;
+}
+.boussole-layout .form-item[data-drupal-selector="edit-field-entite"] .field--type-entity-reference.field--name-field-entite.field--widget-inline-entity-form-complex>div>fieldset>.fieldset-wrapper>table>thead{
+  display:none;
+}
+.boussole-layout .form-item[data-drupal-selector="edit-field-entite"] .field--type-entity-reference.field--name-field-entite.field--widget-inline-entity-form-complex>div>fieldset>.fieldset-wrapper>table>tbody>tr{
+  border:none;
+}
+
+.field--name-field-actuel-future > fieldset legend{
+  display:none;
+}
+.field--name-field-actuel-future > fieldset > .fieldset-wrapper > .form-radios{
+  display: flex; flex-direction: row; gap: 1em;
+}
+
+.field--name-field-prise > .form-item,
+.field--name-field-menace-maintien-degres > .form-item{
+  display:flex;
+  flex-direction: row;
+  gap:1em;
+}
+
+.field--name-field-prise > .form-item > label,
+.field--name-field-menace-maintien-degres > .form-item > label{
+  flex:0 0 auto; 
+  width:9em;
+}
+.field--name-field-prise > .form-item > input,
+.field--name-field-menace-maintien-degres > .form-item > input{
+  width:7em;
+  flex:0 1 auto; 
+}
+.field--name-field-prise > .form-item > .description,
+.field--name-field-menace-maintien-degres > .form-item > .description{
+  flex:0 1 auto; 
+}
+
+.boussole-layout .form-item[data-drupal-selector="edit-field-entite"] .button{
+  font-size: 0.9em;
+}
+
+/* boussole */
+.boussole-layout .boussole-wrapper .boussole{
+  background-image: url(../images/boussole.svg);
+  background-clip: padding-box;
+  background-size: contain;
+  background-repeat: no-repeat;
+  background-position: center;
+  aspect-ratio: 1 / 1;
+  width:100%;
+}

src/web/themes/custom/ouatminimal_theme/ouatminimal.info.yml

@@ -0,0 +1,21 @@
+name: Ouatminimal
+type: theme
+description: 'Adminimal based drupal administration theme with material design.'
+core_version_requirement: ^8.8 || ^9.2
+base theme: adminimal_theme
+
+libraries:
+  - ouatminimal/global-styling
+
+regions:
+  header: 'Header'
+  pre_content: 'Pre-content'
+  breadcrumb: Breadcrumb
+  highlighted: Highlighted
+  help: Help
+  content: Content
+  page_top: 'Page top'
+  page_bottom: 'Page bottom'
+  sidebar_first: 'First sidebar'
+regions_hidden:
+  - sidebar_first

src/web/themes/custom/ouatminimal_theme/ouatminimal.libraries.yml

@@ -0,0 +1,5 @@
+global-styling:
+  version: VERSION
+  css:
+    theme:
+      css/ouatminimal.css: {}

src/web/themes/custom/ouatminimal_theme/ouatminimal.theme

@@ -0,0 +1,91 @@
+<?php
+
+/**
+ * @file
+ * Functions to support theming in the Seven theme.
+ */
+
+use Drupal\Core\Form\FormStateInterface;
+
+
+/**
+ * Implements hook_preprocess_HOOK() for HTML document templates.
+ */
+// function ouatminimal_preprocess_html(&$variables) {
+//   // If on a node add or edit page, add a node-layout class.
+//   $path_args = explode('/', \Drupal::request()->getPathInfo());
+//   if ($suggestions = theme_get_suggestions($path_args, 'page', '-')) {
+//     foreach ($suggestions as $suggestion) {
+//       // dsm($suggestion);
+//       preg_match('/taxonomy-manage-[^-]+-add$/', $suggestion, $matches);
+//       // ksm($matches);
+//       if ($suggestion === 'page--taxonomy-term-edit' || isset($matches)) {
+//         $variables['attributes']['class'][] = 'node-form-layout';
+//       }
+//     }
+//   }
+// }
+
+// function ouatminimal_form_alter(&$form, FormStateInterface $form_state, $form_id){
+//   // dsm($form_id);
+//   // create a colomuned term form (not working yet)
+//   if(in_array($form_id, ['taxonomy_term_company_form', 'taxonomy_term_showroom_form'])){
+//     // ksm($form);
+//     $form['#theme'] = ['term_edit_form'];
+//     $form['#attached']['library'][] = 'seven/node-form';
+// 
+//     $form['advanced']['#type'] = 'container';
+//     $form['meta']['#type'] = 'container';
+//     $form['meta']['#access'] = TRUE;
+//     $form['meta']['changed']['#wrapper_attributes']['class'][] = 'container-inline';
+//     $form['meta']['author']['#wrapper_attributes']['class'][] = 'container-inline';
+// 
+//     $form['revision_information']['#type'] = 'container';
+//     $form['revision_information']['#group'] = 'meta';
+//   }
+// }
+
+/**
+ * Implements hook_form_BASE_FORM_ID_alter() for \Drupal\node\NodeForm.
+ *
+ * Changes vertical tabs to container.
+ */
+function ouatminimal_form_node_form_alter(&$form, FormStateInterface $form_state) {
+  $form['#theme'] = ['node_edit_form'];
+  $form['#attached']['library'][] = 'seven/node-form';
+
+  $form['advanced']['#type'] = 'container';
+  $form['meta']['#type'] = 'container';
+  $form['meta']['#access'] = TRUE;
+  $form['meta']['changed']['#wrapper_attributes']['class'][] = 'container-inline';
+  $form['meta']['author']['#wrapper_attributes']['class'][] = 'container-inline';
+
+  $form['revision_information']['#type'] = 'container';
+  $form['revision_information']['#group'] = 'meta';
+}
+
+// https://api.drupal.org/api/drupal/core%21lib%21Drupal%21Core%21Render%21theme.api.php/function/hook_theme_suggestions_HOOK_alter/10
+function ouatminimal_theme_suggestions_field_multiple_value_form_alter(array &$suggestions, array $variables) {
+  if ($node = \Drupal::routeMatch()->getParameter('node')){
+    $nid = $node->id();
+    $type = $node->getType();
+    $suggestions[] = 'field_multiple_value_form__' . $variables['element']['#field_name'];
+    $suggestions[] = 'field_multiple_value_form__node_' . $type;
+    $suggestions[] = 'field_multiple_value_form__' . $variables['element']['#field_name'] . '__node_' . $type;
+
+  }
+}
+// field-multiple-value-form--field-entite--node-concernement
+function ouatminimal_preprocess_field_multiple_value_form__field_entite__node_concernement(&$variables) {
+  // $element = $variables['element'];
+  $attributes = $variables['attributes'];
+  
+}
+// template_preprocess_field_multiple_value_form
+// function ouatminimal_preprocess_field_multiple_value_form(&$variables) {
+//   $element = $variables['element'];
+//   $attributes = $variables['attributes'];
+//   if($attributes['data-drupal-selector'] === 'edit-field-entite' ){
+//     $t="t";
+//   }
+// }

src/web/themes/custom/ouatminimal_theme/templates/form/field-multiple-value-form--field-entite--node-concernement.html.twig

@@ -0,0 +1,49 @@
+{#
+/**
+ * @file
+ * Default theme implementation for an individual form element.
+ *
+ * Available variables for all fields:
+ * - multiple: Whether there are multiple instances of the field.
+ *
+ * Available variables for single cardinality fields:
+ * - elements: Form elements to be rendered.
+ *
+ * Available variables when there are multiple fields.
+ * - table: Table of field items.
+ * - description: The description element containing the following properties:
+ *   - content: The description content of the form element.
+ *   - attributes: HTML attributes to apply to the description container.
+ * - button: "Add another item" button.
+ *
+ * @see template_preprocess_field_multiple_value_form()
+ *
+ * @ingroup themeable
+ */
+#}
+{% if multiple %}
+  {%
+    set classes = [
+      'js-form-item',
+      'form-item'
+    ]
+  %}
+  <div class="boussole-layout">
+    <div{{ attributes.addClass(classes) }}>
+      {{ table }}
+      {% if description.content %}
+        <div{{ description.attributes.addClass('description') }} >{{ description.content }}</div>
+      {% endif %}
+      {% if button %}
+        <div class="clearfix">{{ button }}</div>
+      {% endif %}
+    </div>
+    <div class="boussole-wrapper">
+      <div class="boussole"/>
+    </div>
+  </div>
+{% else %}
+  {% for element in elements %}
+    {{ element }}
+  {% endfor %}
+{% endif %}

src/web/themes/custom/ouatminimal_theme/templates/form/field-multiple-value-form.html.twig

@@ -0,0 +1,44 @@
+{#
+/**
+ * @file
+ * Default theme implementation for an individual form element.
+ *
+ * Available variables for all fields:
+ * - multiple: Whether there are multiple instances of the field.
+ *
+ * Available variables for single cardinality fields:
+ * - elements: Form elements to be rendered.
+ *
+ * Available variables when there are multiple fields.
+ * - table: Table of field items.
+ * - description: The description element containing the following properties:
+ *   - content: The description content of the form element.
+ *   - attributes: HTML attributes to apply to the description container.
+ * - button: "Add another item" button.
+ *
+ * @see template_preprocess_field_multiple_value_form()
+ *
+ * @ingroup themeable
+ */
+#}
+{% if multiple %}
+  {%
+    set classes = [
+      'js-form-item',
+      'form-item'
+    ]
+  %}
+  <div{{ attributes.addClass(classes) }}>
+    {{ table }}
+    {% if description.content %}
+      <div{{ description.attributes.addClass('description') }} >{{ description.content }}</div>
+    {% endif %}
+    {% if button %}
+      <div class="clearfix">{{ button }}</div>
+    {% endif %}
+  </div>
+{% else %}
+  {% for element in elements %}
+    {{ element }}
+  {% endfor %}
+{% endif %}

src/web/themes/custom/ouatminimal_theme/templates/form/node-edit-form.html.twig

@@ -0,0 +1,38 @@
+{#
+/**
+ * @file
+ * Theme override for a node edit form.
+ *
+ * Two column template for the node add/edit form.
+ *
+ * This template will be used when a node edit form specifies 'node_edit_form'
+ * as its #theme callback.  Otherwise, by default, node add/edit forms will be
+ * themed by form.html.twig.
+ *
+ * Available variables:
+ * - form: The node add/edit form.
+ *
+ * @see seven_form_node_form_alter()
+ */
+#}
+
+<div class="layout-node-form clearfix">
+  <div class="layout-region layout-region-node-header">
+    {{ form.title }}
+  </div>
+  <div class="layout-region  layout-region-node-center clearfix">
+    <div class="layout-region layout-region-node-main">
+      {{ form|without('title','advanced', 'footer', 'actions', 'group_internal') }}
+    </div>
+    <div class="layout-region layout-region-node-secondary">
+      {{ form.group_internal }}
+      {{ form.advanced }}
+      {{ form.actions }}
+    </div>
+  </div> 
+  <div class="layout-region layout-region-node-footer">
+    <div class="layout-region-node-footer__content">
+      {{ form.footer }}
+    </div>
+  </div>
+</div>