From 17e1d10a2de1c8ba4d12a7364bc8858761b4b92e Mon Sep 17 00:00:00 2001
From: Piero Nicolli <piero.nicolli@redturtle.it>
Date: Thu, 14 Dec 2023 12:45:31 +0100
Subject: [PATCH 01/26] fix: custom inline styles rendering in wysiwygwidget

---
 RELEASE.md                                    |  16 +-
 src/config/RichTextEditor/config.js           |  43 ++-
 .../manage/Widgets/WysiwygWidget.jsx          | 362 ++++++++++++++++++
 3 files changed, 407 insertions(+), 14 deletions(-)
 create mode 100644 src/customizations/volto/components/manage/Widgets/WysiwygWidget.jsx

diff --git a/RELEASE.md b/RELEASE.md
index cc02cb738..ff67a44db 100644
--- a/RELEASE.md
+++ b/RELEASE.md
@@ -41,11 +41,25 @@
 - ...
 -->
 
+## Versione X.X.X (dd/mm/yyyy)
+
+### Migliorie
+
+- ...
+
+### Novità
+
+- ... [`Istruzioni`](url della documentazione relativa alla novità)
+
+### Fix
+
+- Ora si vedono correttamente gli stili di allineamento del testo in alcuni editor di testo, ad esempio header e footer dei sottositi.
+
 ## Versione 10.6.1 (13/12/2023)
 
 ### Novità
 
-- I seguenti campi sono ora riordinabili liberamente: "Timeline tempi e scadenze" per il tipo di contenuto *Servizio* e "Valore punto di contatto" del tipo di contenuto *Punto di contatto*.
+- I seguenti campi sono ora riordinabili liberamente: "Timeline tempi e scadenze" per il tipo di contenuto _Servizio_ e "Valore punto di contatto" del tipo di contenuto _Punto di contatto_.
 
 ### Fix
 
diff --git a/src/config/RichTextEditor/config.js b/src/config/RichTextEditor/config.js
index 01384f3be..5c5558610 100644
--- a/src/config/RichTextEditor/config.js
+++ b/src/config/RichTextEditor/config.js
@@ -136,33 +136,50 @@ const ItaliaFromHTMLCustomBlockFn = (element) => {
       ret = {
         type: 'buttons',
       };
-    } else if (element.className === 'draftjs-text-larger') {
+    } else if (element.className === 'text-center') {
       ret = {
-        type: 'TEXT_LARGER',
+        type: 'align-center',
+      };
+    } else if (element.className === 'text-end') {
+      ret = {
+        type: 'align-right',
+      };
+    } else if (element.className === 'text-justify') {
+      ret = {
+        type: 'align-justify',
       };
     }
   }
   return ret;
 };
 
+const ItaliaFromHTMLCustomInlineFn = (element, { Style }) => {
+  if (element.tagName === 'SPAN') {
+    if (element.className === 'draftjs-text-larger') {
+      return Style('TEXT_LARGER');
+    }
+  }
+};
+
 export default function applyConfig(config) {
   config.settings.richtextEditorSettings = (props) => {
     const { plugins /*, inlineToolbarButtons*/ } = Plugins(props); // volto plugins
-    const { extendedBlockRenderMap, blockStyleFn, listBlockTypes } =
-      Blocks(props);
+    const { extendedBlockRenderMap, blockStyleFn, listBlockTypes } = Blocks(
+      props,
+    );
 
     const { immutableLib } = props;
     const { Map } = immutableLib;
 
     const blockRenderMap = Map({
       'align-center': {
-        element: 'p',
+        element: (props) => <p {...props} style={{ textAlign: 'center' }} />,
       },
       'align-right': {
-        element: 'p',
+        element: (props) => <p {...props} style={{ textAlign: 'right' }} />,
       },
       'align-justify': {
-        element: 'p',
+        element: (props) => <p {...props} style={{ textAlign: 'justify' }} />,
       },
       'callout-bg': {
         element: 'p',
@@ -179,9 +196,6 @@ export default function applyConfig(config) {
       r = r.length > 0 ? ' ' : r;
 
       const styles = {
-        'align-center': 'text-center',
-        'align-right': 'text-end',
-        'align-justify': 'text-justify',
         callout: 'callout',
         'callout-bg': 'callout-bg',
         buttons: 'draftjs-buttons',
@@ -203,9 +217,12 @@ export default function applyConfig(config) {
         ...plugins,
         ...ItaliaRichTextEditorPlugins(props),
       ],
-      richTextEditorInlineToolbarButtons:
-        ItaliaRichTextEditorInlineToolbarButtons(props, plugins), //[inlineToolbarButtons,...ItaliaRichTextEditorInlineToolbarButtons(props)]
-      FromHTMLCustomBlockFn: ItaliaFromHTMLCustomBlockFn, //FromHTMLCustomBlockFn
+      richTextEditorInlineToolbarButtons: ItaliaRichTextEditorInlineToolbarButtons(
+        props,
+        plugins,
+      ), //[inlineToolbarButtons,...ItaliaRichTextEditorInlineToolbarButtons(props)]
+      FromHTMLCustomBlockFn: ItaliaFromHTMLCustomBlockFn,
+      FromHTMLCustomInlineFn: ItaliaFromHTMLCustomInlineFn,
       customStyleMap: {
         TEXT_LARGER: { fontSize: '1.75rem' },
       },
diff --git a/src/customizations/volto/components/manage/Widgets/WysiwygWidget.jsx b/src/customizations/volto/components/manage/Widgets/WysiwygWidget.jsx
new file mode 100644
index 000000000..b0239a747
--- /dev/null
+++ b/src/customizations/volto/components/manage/Widgets/WysiwygWidget.jsx
@@ -0,0 +1,362 @@
+/**
+ * Customizations
+ * - add customInlineFn to stateFromHTML call (line 179)
+ */
+/**
+ * WysiwygWidget container.
+ * @module components/manage/WysiwygWidget/WysiwygWidget
+ */
+
+import React, { Component } from 'react';
+import ReactDOMServer from 'react-dom/server';
+import PropTypes from 'prop-types';
+import { connect, Provider } from 'react-redux';
+import { compose } from 'redux';
+import redraft from 'redraft';
+import { Form, Label, TextArea } from 'semantic-ui-react';
+import { map } from 'lodash';
+import { defineMessages, injectIntl } from 'react-intl';
+import configureStore from 'redux-mock-store';
+import { MemoryRouter } from 'react-router-dom';
+import config from '@plone/volto/registry';
+
+import { FormFieldWrapper } from '@plone/volto/components';
+
+import loadable from '@loadable/component';
+import { injectLazyLibs } from '@plone/volto/helpers/Loadable/Loadable';
+
+const Editor = loadable(() => import('draft-js-plugins-editor'));
+
+const messages = defineMessages({
+  default: {
+    id: 'Default',
+    defaultMessage: 'Default',
+  },
+  idTitle: {
+    id: 'Short Name',
+    defaultMessage: 'Short Name',
+  },
+  idDescription: {
+    id: 'Used for programmatic access to the fieldset.',
+    defaultMessage: 'Used for programmatic access to the fieldset.',
+  },
+  title: {
+    id: 'Title',
+    defaultMessage: 'Title',
+  },
+  description: {
+    id: 'Description',
+    defaultMessage: 'Description',
+  },
+  required: {
+    id: 'Required',
+    defaultMessage: 'Required',
+  },
+  delete: {
+    id: 'Delete',
+    defaultMessage: 'Delete',
+  },
+});
+
+/**
+ * WysiwygWidget HTML richtext editing widget
+ *
+ * To use it, in schema properties, declare a field like:
+ *
+ * ```jsx
+ * {
+ *  title: "Rich text",
+ *  widget: 'richtext',
+ * }
+ * ```
+ *
+ */
+class WysiwygWidgetComponent extends Component {
+  /**
+   * Property types.
+   * @property {Object} propTypes Property types.
+   * @static
+   */
+  static propTypes = {
+    /**
+     * Id of the field
+     */
+    id: PropTypes.string.isRequired,
+    /**
+     * Title of the field
+     */
+    title: PropTypes.string.isRequired,
+    /**
+     * Description of the field
+     */
+    description: PropTypes.string,
+    /**
+     * True if field is required
+     */
+    required: PropTypes.bool,
+    /**
+     * Value of the field
+     */
+    value: PropTypes.shape({
+      /**
+       * Content type of the value
+       */
+      'content-type': PropTypes.string,
+      /**
+       * Data of the value
+       */
+      data: PropTypes.string,
+      /**
+       * Encoding of the value
+       */
+      encoding: PropTypes.string,
+    }),
+    /**
+     * Placeholder for the editor
+     */
+    placeholder: PropTypes.string,
+    /**
+     * List of error messages
+     */
+    error: PropTypes.arrayOf(PropTypes.string),
+    /**
+     * On change handler
+     */
+    onChange: PropTypes.func,
+    /**
+     * On delete handler
+     */
+    onDelete: PropTypes.func,
+    /**
+     * On edit handler
+     */
+    onEdit: PropTypes.func,
+    /**
+     * Wrapped form component
+     */
+    wrapped: PropTypes.bool,
+  };
+
+  /**
+   * Default properties
+   * @property {Object} defaultProps Default properties.
+   * @static
+   */
+  static defaultProps = {
+    description: null,
+    required: false,
+    value: {
+      'content-type': 'text/html',
+      data: '',
+      encoding: 'utf8',
+    },
+    error: [],
+    onEdit: null,
+    onDelete: null,
+    onChange: null,
+  };
+
+  /**
+   * Constructor
+   * @method constructor
+   * @param {Object} props Component properties
+   * @constructs WysiwygWidget
+   */
+  constructor(props) {
+    super(props);
+
+    const { stateFromHTML } = props.draftJsImportHtml;
+    const { EditorState } = props.draftJs;
+    const createInlineToolbarPlugin = props.draftJsInlineToolbarPlugin.default;
+
+    this.draftConfig = config.settings.richtextEditorSettings(props);
+
+    if (!__SERVER__) {
+      let editorState;
+      if (props.value && props.value.data) {
+        const contentState = stateFromHTML(props.value.data, {
+          customBlockFn: this.draftConfig.FromHTMLCustomBlockFn,
+          customInlineFn: this.draftConfig.FromHTMLCustomInlineFn,
+        });
+        editorState = EditorState.createWithContent(contentState);
+      } else {
+        editorState = EditorState.createEmpty();
+      }
+
+      const inlineToolbarPlugin = createInlineToolbarPlugin({
+        structure: this.draftConfig.richTextEditorInlineToolbarButtons,
+      });
+
+      this.state = { editorState, inlineToolbarPlugin };
+    }
+
+    this.schema = {
+      fieldsets: [
+        {
+          id: 'default',
+          title: props.intl.formatMessage(messages.default),
+          fields: ['title', 'id', 'description', 'required'],
+        },
+      ],
+      properties: {
+        id: {
+          type: 'string',
+          title: props.intl.formatMessage(messages.idTitle),
+          description: props.intl.formatMessage(messages.idDescription),
+        },
+        title: {
+          type: 'string',
+          title: props.intl.formatMessage(messages.title),
+        },
+        description: {
+          type: 'string',
+          widget: 'textarea',
+          title: props.intl.formatMessage(messages.description),
+        },
+        required: {
+          type: 'boolean',
+          title: props.intl.formatMessage(messages.required),
+        },
+      },
+      required: ['id', 'title'],
+    };
+
+    this.onChange = this.onChange.bind(this);
+  }
+
+  /**
+   * Change handler
+   * @method onChange
+   * @param {object} editorState Editor state.
+   * @returns {undefined}
+   */
+  onChange(editorState) {
+    const { convertToRaw } = this.props.draftJs;
+    this.setState({ editorState });
+    const mockStore = configureStore();
+
+    this.props.onChange(this.props.id, {
+      'content-type': this.props.value
+        ? this.props.value['content-type']
+        : 'text/html',
+      encoding: this.props.value ? this.props.value.encoding : 'utf8',
+      data: ReactDOMServer.renderToStaticMarkup(
+        <Provider
+          store={mockStore({
+            userSession: {
+              token: this.props.token,
+            },
+          })}
+        >
+          <MemoryRouter>
+            {redraft(
+              convertToRaw(editorState.getCurrentContent()),
+              config.settings.richtextViewSettings.ToHTMLRenderers,
+              config.settings.richtextViewSettings.ToHTMLOptions,
+            )}
+          </MemoryRouter>
+        </Provider>,
+      ),
+    });
+  }
+
+  /**
+   * Render method.
+   * @method render
+   * @returns {string} Markup for the component.
+   */
+  render() {
+    const {
+      id,
+      title,
+      description,
+      required,
+      value,
+      error,
+      fieldSet,
+    } = this.props;
+
+    if (__SERVER__) {
+      return (
+        <Form.Field
+          inline
+          required={required}
+          error={error.length > 0}
+          className={description ? 'help' : ''}
+          id={`${fieldSet || 'field'}-${id}`}
+        >
+          <div className="wrapper">
+            <label htmlFor={`field-${id}`}>{title}</label>
+            <TextArea id={id} name={id} value={value ? value.data : ''} />
+            {description && <p className="help">{description}</p>}
+            {map(error, (message) => (
+              <Label key={message} basic color="red" pointing>
+                {message}
+              </Label>
+            ))}
+          </div>
+        </Form.Field>
+      );
+    }
+    const { InlineToolbar } = this.state.inlineToolbarPlugin;
+
+    return (
+      <FormFieldWrapper {...this.props} className="wysiwyg">
+        <div style={{ boxSizing: 'initial' }}>
+          {this.props.onChange ? (
+            <>
+              <Editor
+                id={`field-${id}`}
+                readOnly={this.props.isDisabled}
+                onChange={this.onChange}
+                editorState={this.state.editorState}
+                plugins={[
+                  this.state.inlineToolbarPlugin,
+                  ...this.draftConfig.richTextEditorPlugins,
+                ]}
+                placeholder={this.props.placeholder}
+                blockRenderMap={this.draftConfig.extendedBlockRenderMap}
+                blockStyleFn={this.draftConfig.blockStyleFn}
+                customStyleMap={this.draftConfig.customStyleMap}
+              />
+              {this.props.onChange && <InlineToolbar />}
+            </>
+          ) : (
+            <div className="DraftEditor-root" />
+          )}
+        </div>
+      </FormFieldWrapper>
+    );
+  }
+}
+
+export const WysiwygWidget = compose(
+  injectIntl,
+  injectLazyLibs([
+    'draftJs',
+    'draftJsBlockBreakoutPlugin',
+    'draftJsCreateBlockStyleButton',
+    'draftJsCreateInlineStyleButton',
+    'draftJsFilters',
+    'draftJsImportHtml',
+    'draftJsInlineToolbarPlugin',
+    'draftJsLibIsSoftNewlineEvent',
+    'immutableLib',
+  ]),
+  connect(
+    (state, props) => ({
+      token: state.userSession.token,
+    }),
+    {},
+  ),
+)(WysiwygWidgetComponent);
+
+const Preloader = (props) => {
+  const [loaded, setLoaded] = React.useState(false);
+  React.useEffect(() => {
+    Editor.load().then(() => setLoaded(true));
+  }, []);
+  return loaded ? <WysiwygWidget {...props} /> : null;
+};
+
+export default Preloader;

From 38d8d00daf1b3c822d11a701ecc3a83657c865cb Mon Sep 17 00:00:00 2001
From: Piero Nicolli <piero.nicolli@redturtle.it>
Date: Thu, 14 Dec 2023 13:14:12 +0100
Subject: [PATCH 02/26] docs: updated publiccode and release log

---
 RELEASE.md     | 10 +---------
 publiccode.yml |  4 ++--
 2 files changed, 3 insertions(+), 11 deletions(-)

diff --git a/RELEASE.md b/RELEASE.md
index ff67a44db..91708758b 100644
--- a/RELEASE.md
+++ b/RELEASE.md
@@ -41,15 +41,7 @@
 - ...
 -->
 
-## Versione X.X.X (dd/mm/yyyy)
-
-### Migliorie
-
-- ...
-
-### Novità
-
-- ... [`Istruzioni`](url della documentazione relativa alla novità)
+## Versione 10.6.2 (14/12/2023)
 
 ### Fix
 
diff --git a/publiccode.yml b/publiccode.yml
index c684aa31e..0a5b41bfe 100644
--- a/publiccode.yml
+++ b/publiccode.yml
@@ -227,9 +227,9 @@ maintenance:
 name: io-Comune - Il sito AgID per Comuni ed Enti Pubblici
 platforms:
   - web
-releaseDate: '2023-12-13'
+releaseDate: '2023-12-14'
 softwareType: standalone/web
-softwareVersion: 10.6.1
+softwareVersion: 10.6.2
 url: 'https://github.com/italia/design-comuni-plone-theme'
 usedBy:
   - ASP Comuni Modenesi Area Nord

From 130cb24bd46d3744960db9c64bb80c28e6663d11 Mon Sep 17 00:00:00 2001
From: Piero Nicolli <piero.nicolli@redturtle.it>
Date: Thu, 14 Dec 2023 13:54:58 +0100
Subject: [PATCH 03/26] chore: release v10.6.2

---
 CHANGELOG.md | 13 +++++++++++++
 package.json |  2 +-
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 768bb4ddd..32fbd5371 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,18 @@
 
 
+## [10.6.2](https://github.com/redturtle/design-comuni-plone-theme/compare/v10.6.1...v10.6.2) (2023-12-14)
+
+
+### Bug Fixes
+
+* custom inline styles rendering in wysiwygwidget ([17e1d10](https://github.com/redturtle/design-comuni-plone-theme/commit/17e1d10a2de1c8ba4d12a7364bc8858761b4b92e))
+
+
+### Documentation
+
+* aggiornamento lista dei comuni in publiccode.yml ([#158](https://github.com/redturtle/design-comuni-plone-theme/issues/158)) ([2abad9a](https://github.com/redturtle/design-comuni-plone-theme/commit/2abad9aecaa288ca87670183df13212bdb47fa66))
+* updated publiccode and release log ([38d8d00](https://github.com/redturtle/design-comuni-plone-theme/commit/38d8d00daf1b3c822d11a701ecc3a83657c865cb))
+
 ## [10.6.1](https://github.com/RedTurtle/design-comuni-plone-theme/compare/v10.6.0...v10.6.1) (2023-12-13)
 
 
diff --git a/package.json b/package.json
index 6afce9b20..c26b52a2b 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,7 @@
   "name": "design-comuni-plone-theme",
   "description": "Volto Theme for Italia design guidelines",
   "license": "GPL-v3",
-  "version": "10.6.1",
+  "version": "10.6.2",
   "main": "src/index.js",
   "keywords": [
     "volto-addon",

From 6a8c361feda654f0301b5026533234438469ff37 Mon Sep 17 00:00:00 2001
From: Giulia Ghisini <51911425+giuliaghisini@users.noreply.github.com>
Date: Fri, 15 Dec 2023 14:17:28 +0100
Subject: [PATCH 04/26] fix: gdpr privacy conditional embed to work in diff
 view (#438)

---
 package.json                                  |   2 +-
 .../ConditionalEmbed/ConditionalEmbed.jsx     | 135 ------------------
 yarn.lock                                     |  10 +-
 3 files changed, 6 insertions(+), 141 deletions(-)
 delete mode 100644 src/customizations/volto-gdpr-privacy/components/ConditionalEmbed/ConditionalEmbed.jsx

diff --git a/package.json b/package.json
index c26b52a2b..015826480 100644
--- a/package.json
+++ b/package.json
@@ -146,7 +146,7 @@
     "volto-editablefooter": "5.0.1",
     "volto-feedback": "0.1.5",
     "volto-form-block": "3.1.0",
-    "volto-gdpr-privacy": "2.1.0",
+    "volto-gdpr-privacy": "2.1.1",
     "volto-google-analytics": "2.0.0",
     "volto-multilingual-widget": "3.0.0",
     "volto-querywidget-with-browser": "0.4.0",
diff --git a/src/customizations/volto-gdpr-privacy/components/ConditionalEmbed/ConditionalEmbed.jsx b/src/customizations/volto-gdpr-privacy/components/ConditionalEmbed/ConditionalEmbed.jsx
deleted file mode 100644
index b0f7326c1..000000000
--- a/src/customizations/volto-gdpr-privacy/components/ConditionalEmbed/ConditionalEmbed.jsx
+++ /dev/null
@@ -1,135 +0,0 @@
-/*
-CUSTOMIZATIONS
-  - permit render if server, cannot use in history diff otherwise
-*/
-
-import React, { useEffect, useState } from 'react';
-import { useSelector, useDispatch } from 'react-redux';
-import { useIntl, defineMessages } from 'react-intl';
-import { useLocation } from 'react-router-dom';
-import {
-  displayBanner,
-  updateGdprPrivacyConsent,
-} from 'volto-gdpr-privacy/actions';
-
-import {
-  usePanelConfigAndPreferences,
-  GDPRCookies,
-  getLocaleConf,
-} from 'volto-gdpr-privacy/helpers';
-
-import 'volto-gdpr-privacy/components/ConditionalEmbed/conditional-embed.css';
-
-const messages = defineMessages({
-  conditionalEmbedAcceptCookiesDefaultDescription: {
-    id: 'volto-gdpr-privacy-conditional-embed-default-description',
-    defaultMessage:
-      'Please, accept {cookie_type} cookies to view this content.',
-  },
-  conditionalEmbedAcceptCookiesAcceptMessage: {
-    id: 'volto-gdpr-privacy-conditional-embed-accept-message',
-    defaultMessage: '{enable_cookie_button}, or {manage_preferences_button}',
-  },
-  specificCookieLink: {
-    id: 'volto-gdpr-privacy-conditional-embed-specific-cookie-link',
-    defaultMessage: 'Enable {cookie_type} cookies',
-  },
-  genericCookieLink: {
-    id: 'volto-gdpr-privacy-conditional-embed-generic-cookie-link',
-    defaultMessage: 'manage your cookie preferences',
-  },
-});
-const ConditionalEmbed = ({ code, url, children }) => {
-  const intl = useIntl();
-  const cookies = new GDPRCookies();
-  const embed = code ?? url ?? '';
-  const dispatch = useDispatch();
-  const location = useLocation();
-
-  const { defaultPreferences } = usePanelConfigAndPreferences(cookies);
-  const profilingConfig = useSelector((state) =>
-    state.gdprPrivacyConfig?.config?.profiling?.choices?.filter(
-      (c) => c?.referenceUrls?.length > 0,
-    ),
-  );
-  const gdprPreferences = useSelector(
-    (state) => state.gdprPrivacyConsent.preferences ?? defaultPreferences,
-  );
-  const [urlReferenceConfig, setUrlReferenceConfig] = useState(null);
-
-  useEffect(() => {
-    if (profilingConfig && !urlReferenceConfig) {
-      let conditionalConfig = profilingConfig.filter(
-        (c) =>
-          c.referenceUrls.filter((r) => embed?.indexOf(r) >= 0)?.length > 0,
-      );
-
-      setUrlReferenceConfig(conditionalConfig?.[0] ?? null);
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [profilingConfig, setUrlReferenceConfig, urlReferenceConfig, embed]);
-
-  //return value
-  let ret = <></>;
-  let embedDisabled = true;
-
-  embedDisabled =
-    urlReferenceConfig != null &&
-    !gdprPreferences[urlReferenceConfig.config_key];
-  const isDiffView = location.pathname?.includes('/diff');
-  if (__CLIENT__ && !gdprPreferences && !isDiffView) {
-    return <></>;
-  } else if (embedDisabled && !isDiffView) {
-    //embed disabled
-    const text = getLocaleConf(urlReferenceConfig.text, intl.locale);
-    const key = urlReferenceConfig.config_key;
-    ret = (
-      <div className="volto-gdpr-embed-disabled">
-        {text.conditional_embed_text ??
-          intl.formatMessage(
-            messages.conditionalEmbedAcceptCookiesDefaultDescription,
-            { cookie_type: key },
-          )}{' '}
-        {intl.formatMessage(
-          messages.conditionalEmbedAcceptCookiesAcceptMessage,
-          {
-            enable_cookie_button: (
-              <button
-                onClick={(e) => {
-                  e.preventDefault();
-                  cookies.set(key, true);
-                  dispatch(
-                    updateGdprPrivacyConsent({
-                      ...gdprPreferences,
-                      [key]: true,
-                    }),
-                  );
-                }}
-              >
-                {intl.formatMessage(messages.specificCookieLink, {
-                  cookie_type: key,
-                })}
-              </button>
-            ),
-            manage_preferences_button: (
-              <button
-                onClick={(e) => {
-                  e.preventDefault();
-                  dispatch(displayBanner(true, true));
-                }}
-              >
-                {intl.formatMessage(messages.genericCookieLink)}
-              </button>
-            ),
-          },
-        )}
-      </div>
-    );
-  } else {
-    ret = <>{children}</>;
-  }
-
-  return ret;
-};
-
-export default ConditionalEmbed;
diff --git a/yarn.lock b/yarn.lock
index ccd8b3f3e..07ccf443e 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6479,7 +6479,7 @@ __metadata:
     volto-editablefooter: 5.0.1
     volto-feedback: 0.1.5
     volto-form-block: 3.1.0
-    volto-gdpr-privacy: 2.1.0
+    volto-gdpr-privacy: 2.1.1
     volto-google-analytics: 2.0.0
     volto-multilingual-widget: 3.0.0
     volto-querywidget-with-browser: 0.4.0
@@ -14159,14 +14159,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"volto-gdpr-privacy@npm:2.1.0":
-  version: 2.1.0
-  resolution: "volto-gdpr-privacy@npm:2.1.0"
+"volto-gdpr-privacy@npm:2.1.1":
+  version: 2.1.1
+  resolution: "volto-gdpr-privacy@npm:2.1.1"
   dependencies:
     react-focus-lock: 2.9.4
   peerDependencies:
     "@plone/volto": ">=16.0.0-alpha.38"
-  checksum: d83bfafaeee0ba773a98d7f8a43d99fc39e7cbf65b7fd36f0961926413e49611928fe8b36e8bab2572a2f8a8e610024835501864bdd52d2e9ddbaf73f9e874cb
+  checksum: 2246b9402782f305a45f6ee8dd69fe30f0fcc33dbbb0dcc493e3bcd53bad27263fc9da586ae23c28e0ce04f9c05d583b4e7809b510a59a99923bbb75bb8923fb
   languageName: node
   linkType: hard
 

From d6cf41dd63e6d1b891ff045238d5d7d9d9df5ff0 Mon Sep 17 00:00:00 2001
From: Martina Bustacchini <41484878+deodorhunter@users.noreply.github.com>
Date: Fri, 15 Dec 2023 14:32:15 +0100
Subject: [PATCH 05/26] fix: different styles and ui for all Search block
 listing templates when compared to default Listing template (#437)

---
 RELEASE.md                                       |  6 ++++++
 .../manage/Blocks/Search/SearchBlockView.jsx     |  5 ++++-
 .../Blocks/_bandiInEvidenceTemplate.scss         |  4 ++--
 src/theme/ItaliaTheme/Blocks/_search.scss        | 16 +++++++++++-----
 4 files changed, 23 insertions(+), 8 deletions(-)

diff --git a/RELEASE.md b/RELEASE.md
index 91708758b..b1d0a0de1 100644
--- a/RELEASE.md
+++ b/RELEASE.md
@@ -41,6 +41,12 @@
 - ...
 -->
 
+## Versione X.X.X (dd/mm/yyyy)
+
+### Fix
+
+- Sistemati alcuni problemi di visualizzazione nei template disponibili per il blocco Cerca. Ora tutti i template disponibili per questo blocco rispecchiano graficamente quelli per il blocco Elenco sia in visualizzazione che in modifica.
+
 ## Versione 10.6.2 (14/12/2023)
 
 ### Fix
diff --git a/src/customizations/volto/components/manage/Blocks/Search/SearchBlockView.jsx b/src/customizations/volto/components/manage/Blocks/Search/SearchBlockView.jsx
index 1f1b098d4..da1b9c0d4 100644
--- a/src/customizations/volto/components/manage/Blocks/Search/SearchBlockView.jsx
+++ b/src/customizations/volto/components/manage/Blocks/Search/SearchBlockView.jsx
@@ -1,5 +1,7 @@
 /* CUSTOMIZATIONS:
   - Agid styling
+  - Add class .block.listing in listing body container div to use
+    existing listing template styles
 */
 
 import React from 'react';
@@ -99,7 +101,8 @@ const SearchBlockView = (props) => {
         selectedView={selectedView}
         setSelectedView={setSelectedView}
       >
-        <div className="search-results">
+        {/* Add class .block.listing to benefit from existing listing template styles */}
+        <div className="block listing search-results">
           <ListingBody
             variation={{ ...data, ...listingBodyVariation }}
             data={listingBodyData}
diff --git a/src/theme/ItaliaTheme/Blocks/_bandiInEvidenceTemplate.scss b/src/theme/ItaliaTheme/Blocks/_bandiInEvidenceTemplate.scss
index 99e4b01b4..8b823f1e3 100644
--- a/src/theme/ItaliaTheme/Blocks/_bandiInEvidenceTemplate.scss
+++ b/src/theme/ItaliaTheme/Blocks/_bandiInEvidenceTemplate.scss
@@ -56,8 +56,8 @@
 
   // tablet
   .bandi-in-evidence-cards-wrapper {
-    @media (min-width: #{map-get($grid-breakpoints, md)}) and  (max-width: #{map-get($grid-breakpoints, xxl)}) {
-      grid-template-columns: auto auto;
+    @media (min-width: #{map-get($grid-breakpoints, md)}) and  (max-width: #{map-get($grid-breakpoints, xl)}) {
+      grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
     }
 
     @media (min-width: #{map-get($grid-breakpoints, md)}) and (max-width: #{map-get($grid-breakpoints, lg)}) {
diff --git a/src/theme/ItaliaTheme/Blocks/_search.scss b/src/theme/ItaliaTheme/Blocks/_search.scss
index 004af7636..b5491d6d9 100644
--- a/src/theme/ItaliaTheme/Blocks/_search.scss
+++ b/src/theme/ItaliaTheme/Blocks/_search.scss
@@ -151,15 +151,13 @@
         border-color: hsl(210deg, 17.6470588235%, 43.35%) !important;
         border-bottom: 1px solid;
         font-size: 1rem;
-        transition:
-          border-color 0.3s ease-in,
+        transition: border-color 0.3s ease-in,
           background-color 0.2s cubic-bezier(0, 1, 0, 1) 0.2s;
 
         &[aria-expanded='true'] {
           border-color: transparent !important;
           box-shadow: 0 1rem 2rem -0.25rem rgba(0, 0, 0, 0.15) !important;
-          transition:
-            background-color 0.2s cubic-bezier(0, 1, 0, 1),
+          transition: background-color 0.2s cubic-bezier(0, 1, 0, 1),
             border-color 0.05s cubic-bezier(1, 0, 1, 0);
         }
 
@@ -246,8 +244,16 @@
       }
     }
   }
+  .block.listing {
+    .bandi-in-evidence .bandi-in-evidence-cards-wrapper {
+      grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+      @media (min-width: #{map-get($grid-breakpoints, md)}) and (max-width: #{map-get($grid-breakpoints, lg)}) {
+        display: block !important;
+      }
+    }
+  }
 }
 
-body.cms-ui .block.search.public-ui a {
+.cms-ui .block.search .sideColumn .columnText .draftjs-buttons a {
   color: $primary-text;
 }

From 7e87e9f2071adeced38eae57eb8d09cee6433fa1 Mon Sep 17 00:00:00 2001
From: NicolaZ <116741115+NicolaZivago@users.noreply.github.com>
Date: Fri, 15 Dec 2023 14:44:30 +0100
Subject: [PATCH 06/26] docs: aggiornamento della lista dei comuni in
 publiccode.yml (#159)

aggiornamento lista comuni
---
 publiccode.yml | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/publiccode.yml b/publiccode.yml
index 0a5b41bfe..df439f884 100644
--- a/publiccode.yml
+++ b/publiccode.yml
@@ -252,14 +252,21 @@ usedBy:
   - Comune di Concordia sul Secchia
   - Comune di Gattatico
   - Comune di Finale Emilia
+  - Comune di Fiorano Modenese
+  - Comune di Formigine
+  - Comune di Frassinoro
   - Comune di Imola
+  - Comune di Maranello
   - Comune di Medolla
   - Comune di Mirandola
   - Comune di Modena
   - Comune di Montecchio Emilia
+  - Comune di Montefiorino
   - Comune di Novellara
+  - Comune di Palagano
   - Comune di Parma
   - Comune di Piacenza
+  - Comune di Prignano
   - Comune di Reggio Emilia
   - Comune di San Felice sul Panaro
   - Comune di San Lazzaro di Savena
@@ -267,6 +274,7 @@ usedBy:
   - Comune di San Possidonio
   - Comune di San Prospero
   - Comune di Santilario d'Enza
+  - Comune di Sassuolo
   - Comune di Toscolano Maderno
   - Comune di Vaiano
   - Comune di Vernio
@@ -275,6 +283,7 @@ usedBy:
   - Nuovo Circondario Imolese
   - Ospedali Galliera - Bilancio Sociale
   - Provincia di Pisa
+  - Unione Comuni Distretto Ceramico
   - UCMAN (Unione dei Comuni Modenesi Area Nord)
   - Unione Val d'Enza
   - Unione Val di Bisenzio

From f27a61aef3f41ac34bcbdf9e58e2a6ae0166d0f9 Mon Sep 17 00:00:00 2001
From: Piero Nicolli <piero.nicolli@redturtle.it>
Date: Fri, 15 Dec 2023 14:46:04 +0100
Subject: [PATCH 07/26] docs: updated publiccode and release log

---
 RELEASE.md     | 2 +-
 publiccode.yml | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/RELEASE.md b/RELEASE.md
index b1d0a0de1..db03b1c6d 100644
--- a/RELEASE.md
+++ b/RELEASE.md
@@ -41,7 +41,7 @@
 - ...
 -->
 
-## Versione X.X.X (dd/mm/yyyy)
+## Versione 10.6.3 (15/12/2023)
 
 ### Fix
 
diff --git a/publiccode.yml b/publiccode.yml
index df439f884..a57a7c5f6 100644
--- a/publiccode.yml
+++ b/publiccode.yml
@@ -227,9 +227,9 @@ maintenance:
 name: io-Comune - Il sito AgID per Comuni ed Enti Pubblici
 platforms:
   - web
-releaseDate: '2023-12-14'
+releaseDate: '2023-12-15'
 softwareType: standalone/web
-softwareVersion: 10.6.2
+softwareVersion: 10.6.3
 url: 'https://github.com/italia/design-comuni-plone-theme'
 usedBy:
   - ASP Comuni Modenesi Area Nord

From 90e4e14ccadc408dbd2ed375ea0a570f7e2117ce Mon Sep 17 00:00:00 2001
From: Piero Nicolli <piero.nicolli@redturtle.it>
Date: Fri, 15 Dec 2023 14:48:18 +0100
Subject: [PATCH 08/26] chore: release v10.6.3

---
 CHANGELOG.md | 14 ++++++++++++++
 package.json |  2 +-
 2 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 32fbd5371..3e6a01d4f 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,19 @@
 
 
+## [10.6.3](https://github.com/redturtle/design-comuni-plone-theme/compare/v10.6.2...v10.6.3) (2023-12-15)
+
+
+### Bug Fixes
+
+* different styles and ui for all Search block listing templates when compared to default Listing template ([#437](https://github.com/redturtle/design-comuni-plone-theme/issues/437)) ([d6cf41d](https://github.com/redturtle/design-comuni-plone-theme/commit/d6cf41dd63e6d1b891ff045238d5d7d9d9df5ff0))
+* gdpr privacy conditional embed to work in diff view ([#438](https://github.com/redturtle/design-comuni-plone-theme/issues/438)) ([6a8c361](https://github.com/redturtle/design-comuni-plone-theme/commit/6a8c361feda654f0301b5026533234438469ff37))
+
+
+### Documentation
+
+* aggiornamento della lista dei comuni in publiccode.yml ([#159](https://github.com/redturtle/design-comuni-plone-theme/issues/159)) ([7e87e9f](https://github.com/redturtle/design-comuni-plone-theme/commit/7e87e9f2071adeced38eae57eb8d09cee6433fa1))
+* updated publiccode and release log ([f27a61a](https://github.com/redturtle/design-comuni-plone-theme/commit/f27a61aef3f41ac34bcbdf9e58e2a6ae0166d0f9))
+
 ## [10.6.2](https://github.com/redturtle/design-comuni-plone-theme/compare/v10.6.1...v10.6.2) (2023-12-14)
 
 
diff --git a/package.json b/package.json
index 015826480..c6c099b83 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,7 @@
   "name": "design-comuni-plone-theme",
   "description": "Volto Theme for Italia design guidelines",
   "license": "GPL-v3",
-  "version": "10.6.2",
+  "version": "10.6.3",
   "main": "src/index.js",
   "keywords": [
     "volto-addon",

From f36c5c103df04b8c5cca05885f1cf90a322129c7 Mon Sep 17 00:00:00 2001
From: NicolaZ <116741115+NicolaZivago@users.noreply.github.com>
Date: Mon, 18 Dec 2023 13:49:40 +0100
Subject: [PATCH 09/26] docs: aggiunto campegine a publiccode.yml (#160)

add campegine
---
 publiccode.yml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/publiccode.yml b/publiccode.yml
index a57a7c5f6..e81c3d183 100644
--- a/publiccode.yml
+++ b/publiccode.yml
@@ -245,6 +245,7 @@ usedBy:
   - Camera di Commercio di Reggio Emilia
   - Comune della Spezia
   - Comune di Bibbiano
+  - Comune di Campegine
   - Comune di Camposanto
   - Comune di Cantagallo
   - Comune di Cavezzo

From 5172337fce80452311249c81b16397bd826aa7c0 Mon Sep 17 00:00:00 2001
From: NicolaZ <116741115+NicolaZivago@users.noreply.github.com>
Date: Mon, 18 Dec 2023 13:50:05 +0100
Subject: [PATCH 10/26] docs: aggiunto canossa a publiccode.yml (#161)

add canossa
---
 publiccode.yml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/publiccode.yml b/publiccode.yml
index e81c3d183..0b616cd3a 100644
--- a/publiccode.yml
+++ b/publiccode.yml
@@ -247,6 +247,7 @@ usedBy:
   - Comune di Bibbiano
   - Comune di Campegine
   - Comune di Camposanto
+  - Comune di Canossa
   - Comune di Cantagallo
   - Comune di Cavezzo
   - Comune di Cavriago

From 23f9c501634795f0263e0c7bb66eb26768853e65 Mon Sep 17 00:00:00 2001
From: NicolaZ <116741115+NicolaZivago@users.noreply.github.com>
Date: Mon, 18 Dec 2023 13:50:36 +0100
Subject: [PATCH 11/26] docs: aggiornata lista dei comuni nel README.md (#162)

* Update README.md

aggiornamento esempio siti

* Update README.md

aggiornata lista
---
 README.md | 22 ++++++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/README.md b/README.md
index be76131e2..3b8dda3a5 100644
--- a/README.md
+++ b/README.md
@@ -68,26 +68,47 @@ Si veda ad esempio:
 - [Biblioteche Pianura Est](https://bibest.it)
 - [Camera di Commercio dell'Umbria](https://www.umbria.camcom.it/)
 - [Camera di Commercio di Reggio Emilia](https://www.re.camcom.gov.it/)
+- [Comune della Spezia](https://www.comune.laspezia.it/)
 - [Comune di Bibbiano](https://www.comune.bibbiano.re.it/)
+- [Comune di Borgo Tossignano](https://www.comune.borgotossignano.bo.it/)
 - [Comune di Campegine](https://www.comune.campegine.re.it/)
 - [Comune di Camposanto](https://www.comune.camposanto.mo.it/)
 - [Comune di Canossa](https://www.comune.canossa.re.it/)
 - [Comune di Cantagallo](https://www.comune.cantagallo.po.it/)
+- [Comune di Casalfiumanese](https://www.comune.casalfiumanese.bo.it/)
+- [Comune di Castel del Rio](https://www.comune.casteldelrio.bo.it/)
+- [Comune di Cavezzo](https://www.comune.cavezzo.mo.it/)
 - [Comune di Cavriago](https://www.comune.cavriago.re.it/)
+- [Comune di Concordia sul Secchia](https://www.comune.concordia.mo.it/)
+- [Comune di Dozza](https://www.comune.dozza.bo.it/)
+- [Comune di Finale Emilia](https://www.comune.finale.mo.it/)
+- [Comune di Fiorano Modenese](https://www.comune.fiorano-modenese.mo.it/)
+- [Comune di Fontanelice](https://www.comune.fontanelice.bo.it/)
+- [Comune di Formigine](https://www.comune.formigine.mo.it/)
+- [Comune di Frassinoro](https://www.comune.frassinoro.mo.it/)
 - [Comune di Gattatico](https://www.comune.gattatico.re.it/)
 - [Comune di Imola](https://www.comune.imola.bo.it)
+- [Comune di Maranello](https://www.comune.maranello.mo.it/)
 - [Comune di Medolla](https://www.comune.medolla.mo.it/)
 - [Comune di Mirandola](https://www.comune.mirandola.mo.it/)
 - [Comune di Modena](https://www.comune.modena.it/)
 - [Comune di Montecchio Emilia](https://www.comune.montecchio-emilia.re.it/)
+- [Comune di Montefiorino](https://www.comune.montefiorino.mo.it/)
+- [Comune di Mordano](https://www.comune.mordano.bo.it/)
 - [Comune di Novellara](https://www.comune.novellara.re.it/)
+- [Comune di Palagano](https://www.comune.palagano.mo.it/)
 - [Comune di Parma](https://www.comune.parma.it/)
 - [Comune di Piacenza](https://www.comune.piacenza.it/)
+- [Comune di Prignano sulla Secchia](https://www.comune.prignano.mo.it/)
 - [Comune di Reggio Emilia](https://www.comune.re.it/)
+- [Comune di San Felice sul Panaro](https://www.comune.sanfelice.mo.it/)
 - [Comune di San Lazzaro di Savena](https://www.comune.sanlazzaro.bo.it)
 - [Comune di San Polo d'Enza](https://www.comune.sanpolodenza.re.it/)
 - [Comune di San Possidonio](https://www.comune.sanpossidonio.mo.it/)
+- [Comune di San Prospero](https://www.comune.sanprospero.mo.it/)
 - [Comune di Santilario d'Enza](https://www.comune.santilariodenza.re.it/)
+- [Comune di Sassuolo](https://www.comune.sassuolo.mo.it/)
+- [Comune di Toscolano Maderno](https://www.comune.toscolanomaderno.bs.it/)
 - [Comune di Vaiano](https://www.comune.vaiano.po.it/)
 - [Comune di Vernio](https://www.comune.vernio.po.it/)
 - [Comando Generale della Guardia di Finanza](https://www.gdf.gov.it/it)
@@ -95,6 +116,7 @@ Si veda ad esempio:
 - [Nuovo Circondario Imolese](https://www.nuovocircondarioimolese.it)
 - [Ospedali Galliera - Bilancio Sociale](https://bilanciosociale.galliera.it)
 - [Provincia di Pisa](https://www.provincia.pisa.it/)
+- [Unione Comuni Distretto Ceramico](https://www.distrettoceramico.mo.it/)
 - [UCMAN (Unione dei Comuni Modenesi Area Nord)](https://www.unioneareanord.mo.it/)
 - [Unione Val d'Enza](https://www.unionevaldenza.it/)
 - [Unione Val di Bisenzio](https://www.bisenzio.it/)

From 3748bcddd93d86137f74bd4311ebe50600a04549 Mon Sep 17 00:00:00 2001
From: NicolaZ <116741115+NicolaZivago@users.noreply.github.com>
Date: Mon, 18 Dec 2023 13:51:28 +0100
Subject: [PATCH 12/26] docs: aggiunti i comuni di nci a publiccode.yml (#163)

add NCI

Co-authored-by: Piero Nicolli <pnicolli@users.noreply.github.com>
---
 publiccode.yml | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/publiccode.yml b/publiccode.yml
index 0b616cd3a..406d8c165 100644
--- a/publiccode.yml
+++ b/publiccode.yml
@@ -245,16 +245,21 @@ usedBy:
   - Camera di Commercio di Reggio Emilia
   - Comune della Spezia
   - Comune di Bibbiano
+  - Comune di Borgo Tossignano
   - Comune di Campegine
   - Comune di Camposanto
   - Comune di Canossa
   - Comune di Cantagallo
+  - Comune di Casalfiumanese
+  - Comune di Castel del Rio
   - Comune di Cavezzo
   - Comune di Cavriago
   - Comune di Concordia sul Secchia
+  - Comune di Dozza
   - Comune di Gattatico
   - Comune di Finale Emilia
   - Comune di Fiorano Modenese
+  - Comune di Fontanelice
   - Comune di Formigine
   - Comune di Frassinoro
   - Comune di Imola
@@ -264,6 +269,7 @@ usedBy:
   - Comune di Modena
   - Comune di Montecchio Emilia
   - Comune di Montefiorino
+  - Comune di Mordano
   - Comune di Novellara
   - Comune di Palagano
   - Comune di Parma

From 27ba53db1fb14b318f0d792545481903cd1dea4c Mon Sep 17 00:00:00 2001
From: Piero Nicolli <piero.nicolli@redturtle.it>
Date: Mon, 18 Dec 2023 14:03:15 +0100
Subject: [PATCH 13/26] fix: external-link icon colors

---
 RELEASE.md                                    |  6 ++++++
 .../Blocks/_completeBlockLinkstemplate.scss   |  4 ----
 src/theme/ItaliaTheme/Blocks/_ctaBlock.scss   |  5 -----
 src/theme/ItaliaTheme/Blocks/_imageBlock.scss |  4 ++++
 src/theme/ItaliaTheme/_common.scss            | 21 ++-----------------
 5 files changed, 12 insertions(+), 28 deletions(-)

diff --git a/RELEASE.md b/RELEASE.md
index db03b1c6d..1a68ead0c 100644
--- a/RELEASE.md
+++ b/RELEASE.md
@@ -41,6 +41,12 @@
 - ...
 -->
 
+## Versione 10.6.4 (18/12/2023)
+
+### Fix
+
+- Colori delle icone che specificano che un link è esterno che in alcuni casi erano errati.
+
 ## Versione 10.6.3 (15/12/2023)
 
 ### Fix
diff --git a/src/theme/ItaliaTheme/Blocks/_completeBlockLinkstemplate.scss b/src/theme/ItaliaTheme/Blocks/_completeBlockLinkstemplate.scss
index 6cc796cce..b5d6419f1 100644
--- a/src/theme/ItaliaTheme/Blocks/_completeBlockLinkstemplate.scss
+++ b/src/theme/ItaliaTheme/Blocks/_completeBlockLinkstemplate.scss
@@ -45,10 +45,6 @@
     font-size: 1rem !important;
     font-weight: 700 !important;
     line-height: 1.44444rem;
-
-    .external-link {
-      fill: $external-link-fill-buttons !important;
-    }
   }
 
   .card:after {
diff --git a/src/theme/ItaliaTheme/Blocks/_ctaBlock.scss b/src/theme/ItaliaTheme/Blocks/_ctaBlock.scss
index 8177735a5..d1b759154 100644
--- a/src/theme/ItaliaTheme/Blocks/_ctaBlock.scss
+++ b/src/theme/ItaliaTheme/Blocks/_ctaBlock.scss
@@ -42,17 +42,12 @@
         &:focus {
           background: $secondary-text;
           color: $secondary;
-
-          .external-link {
-            fill: #004080 !important;
-          }
         }
 
         .external-link {
           position: absolute;
           top: 3px;
           right: 3px;
-          fill: $external-link-fill-buttons !important;
         }
       }
 
diff --git a/src/theme/ItaliaTheme/Blocks/_imageBlock.scss b/src/theme/ItaliaTheme/Blocks/_imageBlock.scss
index f4c6b3ad8..1f79d377c 100644
--- a/src/theme/ItaliaTheme/Blocks/_imageBlock.scss
+++ b/src/theme/ItaliaTheme/Blocks/_imageBlock.scss
@@ -17,4 +17,8 @@
   &.right {
     margin-bottom: 0;
   }
+
+  .external-link {
+    display: none;
+  }
 }
diff --git a/src/theme/ItaliaTheme/_common.scss b/src/theme/ItaliaTheme/_common.scss
index da45026c7..10e698873 100644
--- a/src/theme/ItaliaTheme/_common.scss
+++ b/src/theme/ItaliaTheme/_common.scss
@@ -65,34 +65,17 @@
     }
   }
 
-  .btn-primary,
-  .btn-secondary,
-  .btn-tertiary,
-  .draftjs-buttons {
-    .external-link {
-      fill: $external-link-fill-buttons !important;
-    }
-  }
-
   .external-link {
-    fill: $link-color !important;
+    fill: currentColor;
 
     &.align-sub {
       vertical-align: sub;
     }
-
-    &:hover {
-      fill: #004080 !important;
-    }
-  }
-
-  .it-footer-small-prints-list .external-link {
-    fill: $external-link-fill-subfooter !important;
   }
 }
 
 .icon.external-link.icon-xs {
-  height: 1rem;
+  height: 1rem !important;
 }
 
 section.it-page-section,

From c962dc699f850ff9f5206afb01abe38d2577a3cf Mon Sep 17 00:00:00 2001
From: Piero Nicolli <piero.nicolli@redturtle.it>
Date: Mon, 18 Dec 2023 14:04:23 +0100
Subject: [PATCH 14/26] docs: updated publiccode

---
 publiccode.yml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/publiccode.yml b/publiccode.yml
index 406d8c165..3fd040c66 100644
--- a/publiccode.yml
+++ b/publiccode.yml
@@ -227,9 +227,9 @@ maintenance:
 name: io-Comune - Il sito AgID per Comuni ed Enti Pubblici
 platforms:
   - web
-releaseDate: '2023-12-15'
+releaseDate: '2023-12-18'
 softwareType: standalone/web
-softwareVersion: 10.6.3
+softwareVersion: 10.6.4
 url: 'https://github.com/italia/design-comuni-plone-theme'
 usedBy:
   - ASP Comuni Modenesi Area Nord

From 22cce64d7ed5083d71dbd334760dc0e509dc13b0 Mon Sep 17 00:00:00 2001
From: Piero Nicolli <piero.nicolli@redturtle.it>
Date: Mon, 18 Dec 2023 14:06:02 +0100
Subject: [PATCH 15/26] chore: release v10.6.4

---
 CHANGELOG.md | 16 ++++++++++++++++
 package.json |  2 +-
 2 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 3e6a01d4f..ec47e63ac 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,21 @@
 
 
+## [10.6.4](https://github.com/redturtle/design-comuni-plone-theme/compare/v10.6.3...v10.6.4) (2023-12-18)
+
+
+### Bug Fixes
+
+* external-link icon colors ([27ba53d](https://github.com/redturtle/design-comuni-plone-theme/commit/27ba53db1fb14b318f0d792545481903cd1dea4c))
+
+
+### Documentation
+
+* aggiornata lista dei comuni nel README.md ([#162](https://github.com/redturtle/design-comuni-plone-theme/issues/162)) ([23f9c50](https://github.com/redturtle/design-comuni-plone-theme/commit/23f9c501634795f0263e0c7bb66eb26768853e65))
+* aggiunti i comuni di nci a publiccode.yml ([#163](https://github.com/redturtle/design-comuni-plone-theme/issues/163)) ([3748bcd](https://github.com/redturtle/design-comuni-plone-theme/commit/3748bcddd93d86137f74bd4311ebe50600a04549))
+* aggiunto campegine a publiccode.yml ([#160](https://github.com/redturtle/design-comuni-plone-theme/issues/160)) ([f36c5c1](https://github.com/redturtle/design-comuni-plone-theme/commit/f36c5c103df04b8c5cca05885f1cf90a322129c7))
+* aggiunto canossa a publiccode.yml ([#161](https://github.com/redturtle/design-comuni-plone-theme/issues/161)) ([5172337](https://github.com/redturtle/design-comuni-plone-theme/commit/5172337fce80452311249c81b16397bd826aa7c0))
+* updated publiccode ([c962dc6](https://github.com/redturtle/design-comuni-plone-theme/commit/c962dc699f850ff9f5206afb01abe38d2577a3cf))
+
 ## [10.6.3](https://github.com/redturtle/design-comuni-plone-theme/compare/v10.6.2...v10.6.3) (2023-12-15)
 
 
diff --git a/package.json b/package.json
index c6c099b83..10d2d3175 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,7 @@
   "name": "design-comuni-plone-theme",
   "description": "Volto Theme for Italia design guidelines",
   "license": "GPL-v3",
-  "version": "10.6.3",
+  "version": "10.6.4",
   "main": "src/index.js",
   "keywords": [
     "volto-addon",

From 4f399dcdeb841fdd91d19d55dc87d0ad5e15dd2d Mon Sep 17 00:00:00 2001
From: Mauro Amico <mauro.amico@gmail.com>
Date: Tue, 21 Nov 2023 17:30:43 +0100
Subject: [PATCH 16/26] feat!: upgrade to volto 17.5.0 (#382)

* fix: change image component in ctablock

* ci: upgrade volto

* fix: change image component in  hlcontent

* fix: change image component listingimage

* fix: change image component subevents

* fix: change image component gallery

* fix: change image component GenericCard

* fix: change image component

* fix: change image component (sponsor + venuesmall)

* fix: change image component

* fix: minutes with 00 format

* docs: rimosso commento obsoleto

* fix: review giulia

* fix: review giulia

* fix: scroll position on h2 .visually-hidden

* feat: upgrade to volto 17.5.0

* docs: fix order

Co-authored-by: Piero Nicolli <pnicolli@users.noreply.github.com>

* fix: review piero

* fix: sponsor evento without image

* fix: gallery preview

---------

Co-authored-by: Giulia Ghisini <giulia.ghisini@redturtle.it>
Co-authored-by: Piero Nicolli <pnicolli@users.noreply.github.com>
---
 .github/workflows/main.yml                    |   2 +-
 .github/workflows/prs.yml                     |   2 +-
 .github/workflows/release.yml                 |   2 +-
 Makefile                                      |   2 +-
 jest-addon.config.js                          |   4 -
 package.json                                  |   2 +-
 razzle.extend.js                              |  17 -
 src/components/Image/Image.jsx                | 165 -----
 src/components/Image/__tests__/Image.test.jsx | 636 ------------------
 src/components/Image/helpers.js               | 147 ----
 .../ItaliaTheme/Blocks/CTABlock/Block.jsx     |  31 +-
 .../ItaliaTheme/Blocks/Calendar/Item.jsx      |  28 +-
 .../Blocks/Calendar/ListingSidebar.jsx        |   7 +-
 .../Blocks/HighlightedContent/Body.jsx        |   8 +-
 .../Blocks/Listing/CardWithImageTemplate.jsx  |   3 +
 .../Listing/CardWithSlideUpTextTemplate.jsx   |   2 +-
 .../Blocks/Listing/Commons/ListingImage.jsx   |  47 +-
 .../Listing/CompleteBlockLinksTemplate.jsx    |   7 +-
 .../Listing/ContentInEvidenceTemplate.jsx     |   3 +
 .../Blocks/Listing/GridGalleryTemplate.jsx    |   4 +-
 .../Blocks/Listing/InEvidenceTemplate.jsx     |   8 +-
 .../Blocks/Listing/PhotogalleryTemplate.jsx   |   6 +-
 .../Blocks/Listing/SliderTemplate.jsx         |   5 +-
 .../Listing/SmallBlockLinksTemplate.jsx       |   5 +-
 .../CardWithImageTemplateSkeleton.jsx         |   2 -
 .../GalleryPreview/GalleryPreview.jsx         |   7 +-
 .../View/BandoView/BandoAreaResponsabile.jsx  |   3 +
 .../View/BandoView/BandoServizi.jsx           |   3 +
 .../ItaliaTheme/View/Commons/ContentImage.jsx |  13 +-
 .../ItaliaTheme/View/Commons/CuredBy.jsx      |  14 +-
 .../ItaliaTheme/View/Commons/Events.jsx       |  45 +-
 .../ItaliaTheme/View/Commons/Gallery.jsx      |  19 +-
 .../ItaliaTheme/View/Commons/GenericCard.jsx  |  55 +-
 .../ItaliaTheme/View/Commons/LocationItem.jsx |  69 +-
 .../ItaliaTheme/View/Commons/OfficeCard.jsx   |  55 +-
 .../View/Commons/PageHeader/PageHeader.jsx    | 108 +--
 .../View/Commons/RelatedArticles.jsx          |   9 +-
 .../ItaliaTheme/View/Commons/RelatedItems.jsx |  47 +-
 .../ItaliaTheme/View/Commons/Sponsors.jsx     |  53 +-
 .../ItaliaTheme/View/Commons/VenuesSmall.jsx  |  91 +--
 .../ItaliaTheme/View/Commons/WideImage.jsx    |  18 +-
 .../DocumentoAccedereServizio.jsx             |   7 +-
 .../View/IncaricoView/IncaricoView.jsx        |  16 +-
 .../View/NewsItemView/NewsItemACuraDi.jsx     |   3 +
 .../ItaliaTheme/View/PageView/PageView.jsx    |  26 +-
 .../PaginaArgomentoView.jsx                   |  12 +-
 .../View/ServizioView/ServizioAccedi.jsx      |   7 +-
 .../View/ServizioView/ServizioContatti.jsx    |   2 -
 .../ItaliaTheme/View/UOView/UOStructure.jsx   |   8 +-
 .../View/VenueView/VenueContacts.jsx          |   2 +-
 .../View/VenueView/VenueDescription.jsx       |   1 -
 .../ItaliaTheme/View/VenueView/VenueView.jsx  |   2 +-
 .../Blocks/_cardWithImageAndInEvidence.scss   |   1 +
 .../Blocks/_photogallerytemplate.scss         |   1 +
 .../Components/_galleryPreview.scss           |   2 +
 yarn.lock                                     |   2 +-
 56 files changed, 392 insertions(+), 1454 deletions(-)
 delete mode 100644 src/components/Image/Image.jsx
 delete mode 100644 src/components/Image/__tests__/Image.test.jsx
 delete mode 100644 src/components/Image/helpers.js

diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml
index 5da70561d..5c2bc44b5 100644
--- a/.github/workflows/main.yml
+++ b/.github/workflows/main.yml
@@ -31,7 +31,7 @@ jobs:
           build-args: |
             ADDON_NAME=design-comuni-plone-theme
             ADDON_PATH=design-comuni-plone-theme
-            VOLTO_VERSION=17.0.0-alpha.19
+            VOLTO_VERSION=17.5.0
 
       - name: Deploy to rancher
         uses: redturtle/rancher-deploy-action@v0.2.0
diff --git a/.github/workflows/prs.yml b/.github/workflows/prs.yml
index 53b515258..fa2c24e3a 100644
--- a/.github/workflows/prs.yml
+++ b/.github/workflows/prs.yml
@@ -34,4 +34,4 @@ jobs:
           build-args: |
             ADDON_NAME=design-comuni-plone-theme
             ADDON_PATH=design-comuni-plone-theme
-            VOLTO_VERSION=17.0.0-alpha.19
+            VOLTO_VERSION=17.5.0
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
index 123e90e5c..a77c15c57 100644
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -35,4 +35,4 @@ jobs:
           build-args: |
             ADDON_NAME=design-comuni-plone-theme
             ADDON_PATH=design-comuni-plone-theme
-            VOLTO_VERSION=17.0.0-alpha.19
+            VOLTO_VERSION=17.5.0
diff --git a/Makefile b/Makefile
index 77bc4d89f..0f5b0d344 100644
--- a/Makefile
+++ b/Makefile
@@ -27,7 +27,7 @@ CURRENT_DIR:=$(shell dirname $(realpath $(lastword $(MAKEFILE_LIST))))
 # ADDON ?= "design-comuni-plone-theme"
 
 PLONE_VERSION=6
-VOLTO_VERSION=17.0.0-alpha.19
+VOLTO_VERSION=17.5.0
 
 ADDON_NAME='design-comuni-plone-theme'
 ADDON_PATH='design-comuni-plone-theme'
diff --git a/jest-addon.config.js b/jest-addon.config.js
index debdbbcd4..59ad11305 100644
--- a/jest-addon.config.js
+++ b/jest-addon.config.js
@@ -17,10 +17,6 @@ module.exports = {
   ],
   moduleNameMapper: {
     '\\.(css|less|scss|sass|svg)$': 'identity-obj-proxy',
-    '@plone/volto/components/theme/Image/Image':
-      '<rootDir>/src/addons/design-comuni-plone-theme/src/components/Image/Image.jsx',
-    '@plone/volto/helpers/Image/Image':
-      '<rootDir>/src/addons/design-comuni-plone-theme/src/components/Image/helpers.js',
     '@plone/volto/cypress': '<rootDir>/node_modules/@plone/volto/cypress',
     '@plone/volto/babel': '<rootDir>/node_modules/@plone/volto/babel',
     '@plone/volto/(.*)$': '<rootDir>/node_modules/@plone/volto/src/$1',
diff --git a/package.json b/package.json
index 10d2d3175..a1e0a0438 100644
--- a/package.json
+++ b/package.json
@@ -191,7 +191,7 @@
     "stylelint-prettier": "4.0.2"
   },
   "peerDependencies": {
-    "@plone/volto": "17.0.0-alpha.19"
+    "@plone/volto": "17.5.0"
   },
   "packageManager": "yarn@3.2.3"
 }
diff --git a/razzle.extend.js b/razzle.extend.js
index a964ce978..7081de0df 100644
--- a/razzle.extend.js
+++ b/razzle.extend.js
@@ -108,23 +108,6 @@ const modify = (webpackConfig, { target, dev }, webpackObject) => {
   const babelLoader = webpackConfig.module.rules.find(babelLoaderFinder);
   babelLoader.include.push(/node_modules\/design-react-kit/);
 
-  webpackConfig.resolve.alias = {
-    // TODO remove the next two when implemented in core
-    '@plone/volto/components/theme/Image/Image': `${__dirname}/src/components/Image/Image.jsx`,
-    '@plone/volto/helpers/Image/Image': `${__dirname}/src/components/Image/helpers.js`,
-    ...webpackConfig.resolve.alias,
-    // 'design-comuni-plone-theme': `${__dirname}/src`,
-  };
-
-  // remove unused languages. (TODO: move to ENV at build time)
-  // webpackConfig.plugins.push(
-  //   new webpackObject.ContextReplacementPlugin(
-  //     /moment[/\\]locale$/,
-  //     /(it|it-it|en-us|en-gb)$/,
-  //   ),
-  //   // Ignore all locale files of moment.js - new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
-  // );
-
   return webpackConfig;
 };
 
diff --git a/src/components/Image/Image.jsx b/src/components/Image/Image.jsx
deleted file mode 100644
index 4e62c5f65..000000000
--- a/src/components/Image/Image.jsx
+++ /dev/null
@@ -1,165 +0,0 @@
-import React, { useEffect, useRef, useState } from 'react';
-
-import PropTypes from 'prop-types';
-// eslint-disable-next-line import/no-unresolved
-import { getImageAttributes } from '@plone/volto/helpers/Image/Image';
-
-/**
- * Image component
- * @param {string} itemUrl - url (`@id`) of the item. **ONLY** use this if rendering an image from a brain object, leave undefined otherwise
- * @param {object | string} image - Plone image as object or url
- * @param {string} imageField - (default: image) image field for scales URL
- * @param {string} alt - Alternative text for image
- * @param {string} className - CSS class attribute
- * @param {string} containerClassName - CSS class attribute for picture element
- * @param {string} floated - float left or right
- * @param {string} responsive - if the image is responsive
- * @param {string} size - (css class) actual width: thumb, small, medium or large
- * @param {string} role - img role attribute
- * @param {boolean} critical - if critical, do not lazy load the image
- * @param {number} maxSize - maximum size to render
- * @param {boolean} useOriginal - whether to render original size
- */
-const Image = ({
-  itemUrl,
-  image,
-  imageField = 'image',
-  alt = '',
-  className,
-  containerClassName,
-  floated,
-  size,
-  responsive = true,
-  role = 'img',
-  critical = false,
-  maxSize,
-  minSize = 0,
-  useOriginal = false,
-  sizes = '100vw',
-  ...imageProps
-}) => {
-  const { src, srcSet, width, height, aspectRatio } = getImageAttributes(
-    image,
-    {
-      itemUrl,
-      imageField,
-      maxSize,
-      useOriginal,
-      minSize,
-    },
-  );
-  const imageRef = useRef();
-  const [actualSrcSet, setActualSrcSet] = useState(
-    critical && srcSet ? srcSet.join(', ') : null,
-  );
-  // TODO: serve a qualcuno questo?
-  const imageHasLoaded = imageRef?.current?.complete;
-
-  //picture classname
-  let pictureClassName = `volto-image${
-    containerClassName ? ` ${containerClassName}` : ''
-  }`;
-  if (floated) {
-    pictureClassName = `${pictureClassName} floated ${floated}`;
-  }
-  if (size) {
-    pictureClassName = `${pictureClassName} ${size}`;
-  }
-
-  if (responsive) {
-    pictureClassName = `${pictureClassName} responsive`;
-  }
-
-  //intersection observer
-  useEffect(() => {
-    const applySrcSet = () => {
-      setActualSrcSet(srcSet.join(', '));
-    };
-
-    if (srcSet && !critical) {
-      if ('IntersectionObserver' in window) {
-        const observer = new IntersectionObserver(
-          (entries) => {
-            entries.forEach((entry) => {
-              if (entry.isIntersecting && !actualSrcSet) {
-                applySrcSet();
-                if (imageRef.current instanceof Element) {
-                  observer.unobserve(imageRef.current);
-                }
-              }
-            });
-          },
-          { threshold: [0], rootMargin: '100px' },
-        );
-        observer.observe(imageRef.current);
-      } else {
-        applySrcSet();
-      }
-    }
-  }, [imageHasLoaded, srcSet, actualSrcSet, critical]);
-
-  return (
-    <>
-      <picture className={pictureClassName}>
-        {actualSrcSet?.length > 0 && (
-          <source srcSet={actualSrcSet} sizes={sizes} />
-        )}
-        <img
-          src={src}
-          alt={alt}
-          className={className}
-          role={role}
-          // removed because this is for the placeholder. Lazy loading is made using intersectionObserver
-          // loading={critical ? 'eager' : 'lazy'}
-          width={width}
-          height={height}
-          style={aspectRatio ? { aspectRatio } : null}
-          {...imageProps}
-          ref={imageRef}
-        />
-      </picture>
-      {!critical && (
-        <noscript
-          dangerouslySetInnerHTML={{
-            __html: `
-              <img
-                src="${src}"
-                ${srcSet?.length && `srcset="${srcSet.join(', ')}"`}
-                alt="${alt}"
-                class="${className || ''}"
-                role="${role}"
-                ${width ? `width="${width}` : ''}
-                ${height ? `height="${height}` : ''}
-                loading="lazy"
-            `,
-          }}
-        />
-      )}
-    </>
-  );
-};
-
-Image.propTypes = {
-  itemUrl: PropTypes.string,
-  imageField: PropTypes.string,
-  image: PropTypes.oneOfType([PropTypes.object, PropTypes.string]).isRequired,
-  alt: PropTypes.string,
-  className: PropTypes.string,
-  containerClassName: PropTypes.string,
-  floated: PropTypes.oneOf(['left', 'right']),
-  size: PropTypes.string,
-  role: PropTypes.string,
-  critical: PropTypes.bool,
-  maxSize: PropTypes.number,
-  useOriginal: PropTypes.bool,
-};
-
-Image.defaultProps = {
-  imageField: 'image',
-  alt: '',
-  role: 'img',
-  critical: false,
-  useOriginal: false,
-};
-
-export default Image;
diff --git a/src/components/Image/__tests__/Image.test.jsx b/src/components/Image/__tests__/Image.test.jsx
deleted file mode 100644
index d3afa8b67..000000000
--- a/src/components/Image/__tests__/Image.test.jsx
+++ /dev/null
@@ -1,636 +0,0 @@
-import React from 'react';
-import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
-import Image from '../Image';
-import configureStore from 'redux-mock-store';
-import { Provider } from 'react-intl-redux';
-import { MemoryRouter } from 'react-router-dom';
-import thunk from 'redux-thunk';
-
-const middlewares = [thunk];
-const mockStore = configureStore(middlewares);
-
-const store = mockStore({
-  intl: {
-    locale: 'en',
-    messages: {},
-  },
-});
-
-const mockedBrain = {
-  '@id':
-    'http://localhost:3000/Plone/test-martina/evento-test-rotto-nei-listing',
-  '@type': 'Event',
-  CreationDate: '2023-03-15T14:48:25+00:00',
-  Creator: 'admin',
-  Date: '2023-05-04T09:41:29+00:00',
-  Description: 'sono rotto aggiustami',
-  EffectiveDate: 'None',
-  ExpirationDate: 'None',
-  ModificationDate: '2023-05-04T09:41:29+00:00',
-  Subject: [],
-  Subject_bando: null,
-  Title: 'Evento test rotto nei listing',
-  Type: 'Evento',
-  UID: '8304fd7c157d454fbb42af4cf76546f5',
-  apertura_bando: null,
-  author_name: null,
-  business_events: [],
-  chiusura_procedimento_bando: null,
-  cmf_uid: 7185,
-  commentators: [],
-  created: '2023-03-15T14:48:25+00:00',
-  data_conclusione_incarico: null,
-  description: 'sono rotto aggiustami',
-  design_italia_meta_type: 'Evento',
-  destinatari_bando: null,
-  effective: null,
-  end: '2023-03-15T15:00:00+00:00',
-  ente_bando: null,
-  event_location: [],
-  exclude_from_nav: false,
-  expires: null,
-  geolocation: null,
-  getIcon: true,
-  getId: 'evento-test-rotto-nei-listing',
-  getObjSize: '134.6 KB',
-  getPath: '/Plone/test-martina/evento-test-rotto-nei-listing',
-  getRemoteUrl: null,
-  getURL:
-    'http://localhost:3000/Plone/test-martina/evento-test-rotto-nei-listing',
-  hasPreviewImage: true,
-  head_title: null,
-  icona: null,
-  id: 'evento-test-rotto-nei-listing',
-  image: {
-    scales: {
-      gallery: {
-        download:
-          'http://localhost:3000/Plone/test-martina/evento-test-rotto-nei-listing/@@images/preview_image/gallery',
-        height: 65536,
-        width: 250,
-      },
-      great: {
-        download:
-          'http://localhost:3000/Plone/test-martina/evento-test-rotto-nei-listing/@@images/preview_image/great',
-        height: 65536,
-        width: 1200,
-      },
-      huge: {
-        download:
-          'http://localhost:3000/Plone/test-martina/evento-test-rotto-nei-listing/@@images/preview_image/huge',
-        height: 65536,
-        width: 1600,
-      },
-      icon: {
-        download:
-          'http://localhost:3000/Plone/test-martina/evento-test-rotto-nei-listing/@@images/preview_image/icon',
-        height: 32,
-        width: 32,
-      },
-      large: {
-        download:
-          'http://localhost:3000/Plone/test-martina/evento-test-rotto-nei-listing/@@images/preview_image/large',
-        height: 65536,
-        width: 800,
-      },
-      larger: {
-        download:
-          'http://localhost:3000/Plone/test-martina/evento-test-rotto-nei-listing/@@images/preview_image/larger',
-        height: 65536,
-        width: 1000,
-      },
-      listing: {
-        download:
-          'http://localhost:3000/Plone/test-martina/evento-test-rotto-nei-listing/@@images/preview_image/listing',
-        height: 16,
-        width: 16,
-      },
-      midi: {
-        download:
-          'http://localhost:3000/Plone/test-martina/evento-test-rotto-nei-listing/@@images/preview_image/midi',
-        height: 65536,
-        width: 300,
-      },
-      mini: {
-        download:
-          'http://localhost:3000/Plone/test-martina/evento-test-rotto-nei-listing/@@images/preview_image/mini',
-        height: 65536,
-        width: 200,
-      },
-      preview: {
-        download:
-          'http://localhost:3000/Plone/test-martina/evento-test-rotto-nei-listing/@@images/preview_image/preview',
-        height: 65536,
-        width: 400,
-      },
-      teaser: {
-        download:
-          'http://localhost:3000/Plone/test-martina/evento-test-rotto-nei-listing/@@images/preview_image/teaser',
-        height: 65536,
-        width: 600,
-      },
-      thumb: {
-        download:
-          'http://localhost:3000/Plone/test-martina/evento-test-rotto-nei-listing/@@images/preview_image/thumb',
-        height: 65536,
-        width: 128,
-      },
-      tile: {
-        download:
-          'http://localhost:3000/Plone/test-martina/evento-test-rotto-nei-listing/@@images/preview_image/tile',
-        height: 64,
-        width: 64,
-      },
-    },
-  },
-  image_field: 'preview_image',
-  image_scales: {
-    image: [
-      {
-        'content-type': 'image/jpeg',
-        download: '@@images/image-1000-88003725ea27f4e9395171b3f7fb061b.jpeg',
-        filename: 'meadow1080.jpeg',
-        height: 562,
-        scales: {
-          gallery: {
-            download:
-              '@@images/image-250-e29ae01c8188a0c30af5dce0ea23f435.jpeg',
-            height: 140,
-            width: 250,
-          },
-          icon: {
-            download: '@@images/image-32-d6d53f16ad3bc85d8bd4276f6b43d46d.jpeg',
-            height: 17,
-            width: 32,
-          },
-          large: {
-            download:
-              '@@images/image-800-938808b6d68de75fad4527401ec4c491.jpeg',
-            height: 449,
-            width: 800,
-          },
-          larger: {
-            download:
-              '@@images/image-1000-b53ea847c569a5838f2ac6985430e1da.jpeg',
-            height: 562,
-            width: 1000,
-          },
-          listing: {
-            download: '@@images/image-16-b842d5d598384d975f63dcbe68d5c9c0.jpeg',
-            height: 8,
-            width: 16,
-          },
-          midi: {
-            download:
-              '@@images/image-300-21abb1f57e10d31e84e54690b376c740.jpeg',
-            height: 168,
-            width: 300,
-          },
-          mini: {
-            download:
-              '@@images/image-200-e904e66159773f5e67c196ae978ac0ec.jpeg',
-            height: 112,
-            width: 200,
-          },
-          preview: {
-            download:
-              '@@images/image-400-ad7546b24e8160942e65b18c316eebbc.jpeg',
-            height: 224,
-            width: 400,
-          },
-          teaser: {
-            download:
-              '@@images/image-600-17971ddb7bbf5d97508d7befbc0a0470.jpeg',
-            height: 337,
-            width: 600,
-          },
-          thumb: {
-            download:
-              '@@images/image-128-d4b5139668072bd4d9054c34cf9442bc.jpeg',
-            height: 71,
-            width: 128,
-          },
-          tile: {
-            download: '@@images/image-64-0aefc657f4c78cb3bc36f32c03c4473d.jpeg',
-            height: 35,
-            width: 64,
-          },
-        },
-        size: 68908,
-        width: 1000,
-      },
-    ],
-    preview_image: [
-      {
-        'content-type': 'image/jpeg',
-        download:
-          '@@images/preview_image-1000-9c393bce64a32768b190c63bfc79fa55.jpeg',
-        filename: 'meadow1080.jpeg',
-        height: 562,
-        scales: {
-          gallery: {
-            download:
-              '@@images/preview_image-250-b76480ebb6e6df577471db18da0304a7.jpeg',
-            height: 140,
-            width: 250,
-          },
-          icon: {
-            download:
-              '@@images/preview_image-32-6581e7f3a359e6de942d9c0a1b04bba9.jpeg',
-            height: 17,
-            width: 32,
-          },
-          large: {
-            download:
-              '@@images/preview_image-800-f6eb0865c7dc76f1eb01a14839ad727e.jpeg',
-            height: 449,
-            width: 800,
-          },
-          larger: {
-            download:
-              '@@images/preview_image-1000-9cbfc50181667116db1fff21ffb81fd5.jpeg',
-            height: 562,
-            width: 1000,
-          },
-          listing: {
-            download:
-              '@@images/preview_image-16-3fc4eea2c1c0b3d5edacea1989406db4.jpeg',
-            height: 8,
-            width: 16,
-          },
-          midi: {
-            download:
-              '@@images/preview_image-300-6547734235ba8fd0f09b0f52e044ed06.jpeg',
-            height: 168,
-            width: 300,
-          },
-          mini: {
-            download:
-              '@@images/preview_image-200-692e77b1dcefda79834718aa987705da.jpeg',
-            height: 112,
-            width: 200,
-          },
-          preview: {
-            download:
-              '@@images/preview_image-400-a35347d724b44b4d0760df82a4176875.jpeg',
-            height: 224,
-            width: 400,
-          },
-          teaser: {
-            download:
-              '@@images/preview_image-600-99069c7f388f292e2a93007cfd1dddf6.jpeg',
-            height: 337,
-            width: 600,
-          },
-          thumb: {
-            download:
-              '@@images/preview_image-128-a046b1dadd1731867373425bfa17ef4c.jpeg',
-            height: 71,
-            width: 128,
-          },
-          tile: {
-            download:
-              '@@images/preview_image-64-b76405e9ff1342fba999dabf91ac2ad2.jpeg',
-            height: 35,
-            width: 64,
-          },
-        },
-        size: 68908,
-        width: 1000,
-      },
-    ],
-  },
-  in_response_to: null,
-  is_folderish: true,
-  last_comment_date: null,
-  latitude: null,
-  listCreators: ['admin'],
-  location: null,
-  longitude: null,
-  meta_type: 'Dexterity Container',
-  mime_type: 'text/plain',
-  modified: '2023-05-04T09:41:29+00:00',
-  nav_title: null,
-  open_end: false,
-  parent: {
-    '@id': 'http://localhost:3000/Plone/test-martina',
-    UID: 'f1aa63e84b4249b1b5851328ffd53f44',
-    title: 'Test Martina',
-  },
-  person_life_events: [],
-  portal_type: 'Event',
-  recurrence: null,
-  review_state: 'private',
-  ruolo: null,
-  scadenza_bando: null,
-  start: '2022-11-19T14:00:00+00:00',
-  sync_uid: '8304fd7c157d454fbb42af4cf76546f5@v3.io-comune.redturtle.it',
-  tassonomia_argomenti: [
-    {
-      '@id': 'http://localhost:3000/Plone/argomenti/comune',
-      '@type': 'Pagina Argomento',
-      CreationDate: '2022-01-10T06:26:48+00:00',
-      Creator: 'admin',
-      Date: '2022-01-25T06:42:57+00:00',
-      Description: '',
-      EffectiveDate: '2022-01-25T06:42:57+00:00',
-      ExpirationDate: 'None',
-      ModificationDate: '2022-08-30T15:08:13+00:00',
-      Subject: [],
-      Subject_bando: null,
-      Title: 'Comune',
-      Type: 'Argomento',
-      UID: '2df29d32955c412dac59d2438a64cbbf',
-      apertura_bando: null,
-      author_name: null,
-      business_events: null,
-      chiusura_procedimento_bando: null,
-      cmf_uid: 1784,
-      commentators: null,
-      created: '2022-01-10T06:26:48+00:00',
-      data_conclusione_incarico: null,
-      description: '',
-      design_italia_meta_type: 'Argomento',
-      destinatari_bando: null,
-      effective: '2022-01-25T06:42:57+00:00',
-      end: null,
-      ente_bando: null,
-      event_location: null,
-      exclude_from_nav: false,
-      expires: null,
-      geolocation: null,
-      getIcon: '',
-      getId: 'comune',
-      getObjSize: null,
-      getPath: '/Plone/argomenti/comune',
-      getRemoteUrl: null,
-      getURL: 'http://localhost:3000/Plone/argomenti/comune',
-      hasPreviewImage: null,
-      head_title: null,
-      icona: 'building',
-      id: 'comune',
-      image_field: null,
-      image_scales: null,
-      in_response_to: null,
-      is_folderish: null,
-      last_comment_date: null,
-      latitude: null,
-      listCreators: ['admin'],
-      location: null,
-      longitude: null,
-      meta_type: 'Dexterity Container',
-      mime_type: null,
-      modified: '2022-08-30T15:08:13+00:00',
-      nav_title: null,
-      open_end: null,
-      parent: null,
-      person_life_events: null,
-      portal_type: 'Pagina Argomento',
-      recurrence: null,
-      review_state: 'private',
-      ruolo: null,
-      scadenza_bando: null,
-      start: null,
-      sync_uid: null,
-      tassonomia_argomenti: null,
-      temi_dataset: null,
-      tipologia_bando: null,
-      tipologia_documenti_albopretorio: null,
-      tipologia_documento: null,
-      tipologia_evento: null,
-      tipologia_frequenza_aggiornamento: null,
-      tipologia_incarico: null,
-      tipologia_licenze: null,
-      tipologia_luogo: null,
-      tipologia_notizia: null,
-      tipologia_organizzazione: null,
-      tipologia_pdc: null,
-      tipologia_stati_pratica: null,
-      title: 'Comune',
-      total_comments: null,
-      ufficio_responsabile_bando: null,
-      update_note: null,
-      whole_day: null,
-    },
-  ],
-  temi_dataset: [],
-  tipologia_bando: null,
-  tipologia_documenti_albopretorio: [],
-  tipologia_documento: [],
-  tipologia_evento: [
-    {
-      title: 'Evento culturale',
-      token: 'evento_culturale',
-    },
-  ],
-  tipologia_frequenza_aggiornamento: [],
-  tipologia_incarico: [],
-  tipologia_licenze: [],
-  tipologia_luogo: [],
-  tipologia_notizia: [],
-  tipologia_organizzazione: [],
-  tipologia_pdc: [],
-  tipologia_stati_pratica: [],
-  title: 'Evento test rotto nei listing',
-  total_comments: 0,
-  ufficio_responsabile_bando: null,
-  update_note: null,
-  whole_day: false,
-};
-
-const mockedSummary = {
-  '@id':
-    'http://localhost:3000/Plone/amministrazione/personale-amministrativo/monica-rossini',
-  '@type': 'Persona',
-  description: '',
-  design_italia_meta_type: 'Persona pubblica',
-  effective: '2022-02-14T13:45:17+00:00',
-  has_children: true,
-  id: 'monica-rossini',
-  image_field: 'foto_persona',
-  image_scales: {
-    foto_persona: [
-      {
-        'content-type': 'image/jpeg',
-        download:
-          'http://localhost:3000/Plone/amministrazione/personale-amministrativo/monica-rossini/@@images/foto_persona-424-b5ca77428064e1494bf321665ea28e65.jpeg',
-        filename: 'mickeyeyes.jpg',
-        height: 369,
-        scales: {
-          gallery: {
-            download:
-              'http://localhost:3000/Plone/amministrazione/personale-amministrativo/monica-rossini/@@images/foto_persona-250-cbac351505afca6dfd08fd706050cedb.jpeg',
-            height: 217,
-            width: 250,
-          },
-          great: {
-            download:
-              'http://localhost:3000/Plone/amministrazione/personale-amministrativo/monica-rossini/@@images/foto_persona-1200-c0a82d1866ff2d08a6c048bc7b7b1ca1.jpeg',
-            height: 369,
-            width: 424,
-          },
-          huge: {
-            download:
-              'http://localhost:3000/Plone/amministrazione/personale-amministrativo/monica-rossini/@@images/foto_persona-1600-3e45bb6dd52ae834965cda9e0718e475.jpeg',
-            height: 369,
-            width: 424,
-          },
-          icon: {
-            download:
-              'http://localhost:3000/Plone/amministrazione/personale-amministrativo/monica-rossini/@@images/foto_persona-32-36eebaae69826152f529b5385311744f.jpeg',
-            height: 27,
-            width: 32,
-          },
-          large: {
-            download:
-              'http://localhost:3000/Plone/amministrazione/personale-amministrativo/monica-rossini/@@images/foto_persona-800-4c19436e19a37296cdaf002d10affcd5.jpeg',
-            height: 369,
-            width: 424,
-          },
-          larger: {
-            download:
-              'http://localhost:3000/Plone/amministrazione/personale-amministrativo/monica-rossini/@@images/foto_persona-1000-736981d81319b5425ccdfec2963ebf80.jpeg',
-            height: 369,
-            width: 424,
-          },
-          listing: {
-            download:
-              'http://localhost:3000/Plone/amministrazione/personale-amministrativo/monica-rossini/@@images/foto_persona-16-5f902255ae498b09dbfa7b899ccd7392.jpeg',
-            height: 13,
-            width: 16,
-          },
-          midi: {
-            download:
-              'http://localhost:3000/Plone/amministrazione/personale-amministrativo/monica-rossini/@@images/foto_persona-300-65c648fc61aff577a05b3f18ed2819ad.jpeg',
-            height: 261,
-            width: 300,
-          },
-          mini: {
-            download:
-              'http://localhost:3000/Plone/amministrazione/personale-amministrativo/monica-rossini/@@images/foto_persona-200-ed95556be4df5284dfd93e123e4c5d94.jpeg',
-            height: 174,
-            width: 200,
-          },
-          preview: {
-            download:
-              'http://localhost:3000/Plone/amministrazione/personale-amministrativo/monica-rossini/@@images/foto_persona-400-bd95cd2ce1f2bfcb0c9c6402f79f69cc.jpeg',
-            height: 348,
-            width: 400,
-          },
-          teaser: {
-            download:
-              'http://localhost:3000/Plone/amministrazione/personale-amministrativo/monica-rossini/@@images/foto_persona-600-265c5da771163e59cf6282fbb473624e.jpeg',
-            height: 369,
-            width: 424,
-          },
-          thumb: {
-            download:
-              'http://localhost:3000/Plone/amministrazione/personale-amministrativo/monica-rossini/@@images/foto_persona-128-49a659bc174e4f7dfa87caeea577e2d7.jpeg',
-            height: 111,
-            width: 128,
-          },
-          tile: {
-            download:
-              'http://localhost:3000/Plone/amministrazione/personale-amministrativo/monica-rossini/@@images/foto_persona-64-9cc01bcb6a84f82987d0a64f24c6e3ab.jpeg',
-            height: 55,
-            width: 64,
-          },
-        },
-        size: 21394,
-        width: 424,
-      },
-    ],
-  },
-  incarichi: 'Responsabile',
-  review_state: 'published',
-  title: 'Monica Rossini',
-};
-
-describe('Image component', () => {
-  it('shows image correctly when data is from Brain', async () => {
-    render(
-      <Provider store={store}>
-        <MemoryRouter>
-          <Image
-            itemUrl={mockedBrain['@id']}
-            image={
-              mockedBrain.image_scales?.[mockedBrain.image_field]?.[0] ||
-              mockedBrain['@id']
-            }
-            aria-hidden="true"
-            alt={mockedBrain.title}
-            title={mockedBrain.title}
-            imageField={mockedBrain.image_field}
-          />
-        </MemoryRouter>
-      </Provider>,
-    );
-
-    // Test correct rendering
-    const component = document.getElementsByClassName(
-      'volto-image responsive',
-    )?.[0];
-    expect(component).toBeInTheDocument();
-    const source = component.getElementsByTagName('source')?.[0];
-    expect(source).toBeInTheDocument();
-
-    const image = screen.getByAltText('Evento test rotto nei listing');
-    expect(image).toBeInTheDocument();
-
-    // Test against #40248 regression, path should be present just once
-    const regex = new RegExp(
-      '/test-martina/evento-test-rotto-nei-listing',
-      'gi',
-    );
-    // Test src is correct
-    expect(image.src?.match(regex)?.length).toBe(1);
-    // Test srcSet is correct
-    const srcset = source.srcset.split(', ');
-    srcset.forEach((src) => {
-      expect(src.match(regex)?.length).toBe(1);
-    });
-  });
-  it('shows image correctly when data is from Summary', async () => {
-    render(
-      <Provider store={store}>
-        <MemoryRouter>
-          <Image
-            itemUrl={mockedSummary['@id']}
-            image={
-              mockedSummary.image_scales?.[mockedSummary.image_field]?.[0] ||
-              mockedSummary['@id']
-            }
-            aria-hidden="true"
-            alt={mockedSummary.title}
-            title={mockedSummary.title}
-            imageField={mockedSummary.image_field}
-          />
-        </MemoryRouter>
-      </Provider>,
-    );
-    // Test correct rendering
-    const component = document.getElementsByClassName(
-      'volto-image responsive',
-    )?.[0];
-    expect(component).toBeInTheDocument();
-    const source = component.getElementsByTagName('source')?.[0];
-    expect(source).toBeInTheDocument();
-
-    const image = screen.getByAltText('Monica Rossini');
-    expect(image).toBeInTheDocument();
-
-    // Test against #40248 regression, path should be present just once
-    const regex = new RegExp(
-      '/amministrazione/personale-amministrativo/monica-rossini',
-      'gi',
-    );
-    // Test src is correct
-    expect(image.src?.match(regex)?.length).toBe(1);
-    // Test srcSet is correct
-    const srcset = source.srcset.split(', ');
-    srcset.forEach((src) => {
-      expect(src.match(regex)?.length).toBe(1);
-    });
-  });
-});
diff --git a/src/components/Image/helpers.js b/src/components/Image/helpers.js
deleted file mode 100644
index b4c4f415b..000000000
--- a/src/components/Image/helpers.js
+++ /dev/null
@@ -1,147 +0,0 @@
-import { flattenToAppURL, isInternalURL } from '@plone/volto/helpers';
-
-import config from '@plone/volto/registry';
-
-const getImageIsFromBrain = (imageDownloadUrl) => {
-  if (typeof imageDownloadUrl !== 'string') return false;
-  // Old check against itemUrl truthyness isn't valid anymore.
-  // All brains have item[@id], need to check if image.download
-  // starts with @@images
-  return imageDownloadUrl.startsWith('@@images');
-};
-
-const getImageType = (image) => {
-  let imageType = 'external';
-  if (image['content-type'] === 'image/svg+xml') {
-    imageType = 'svg';
-  } else if (
-    Object.prototype.toString.call(image) === '[object Object]' &&
-    image.scales &&
-    Object.keys(image.scales).length > 0
-  ) {
-    imageType = 'imageObject';
-  } else if (typeof image === 'string' && isInternalURL(image)) {
-    imageType = 'internalUrl';
-  }
-  return imageType;
-};
-
-const DEFAULT_MAX_SIZE = 10000;
-
-/**
- * Get src-set list from image. **Important:** read options parameter in order to propertly generate image srcs
- * @param {object | string} image - Image content object or url
- * @param {object} options Object with the following properties: itemUrl, imageField, maxSize, useOriginal, minSize. Set `itemUrl` to the item `@id` property if the image is from a brain object, otherwise leave it undefined
- * @returns {object} image attributes with src and srcset to be used to render the given image
- */
-export const getImageAttributes = (
-  image,
-  {
-    itemUrl,
-    imageField = 'image',
-    maxSize = DEFAULT_MAX_SIZE,
-    useOriginal = false,
-    minSize = 0,
-  } = {},
-) => {
-  // Brain objects have scale urls that start with @@images
-  // while regular content objects have scales with full urls (i.e. https://.../@@images/...)
-  let itemPath = flattenToAppURL(itemUrl ?? '');
-  if (itemPath.slice(-1) !== '/') itemPath = `${itemPath}/`;
-  const isFromBrain = getImageIsFromBrain(image?.download ?? image);
-
-  const imageScales = config.settings.imageScales;
-
-  const minScale = Object.keys(imageScales).reduce((minScale, scale) => {
-    if (!minScale || imageScales[scale] < imageScales[minScale]) {
-      if (minSize > 0 && minSize > imageScales[scale]) {
-        return minScale;
-      }
-      return scale;
-    }
-    return minScale;
-  }, null);
-
-  const attrs = {};
-  const imageType = getImageType(image);
-
-  switch (imageType) {
-    case 'svg':
-      attrs.src = flattenToAppURL(image.download);
-      break;
-
-    // Scales object from Plone restapi
-    // ideal use of Plone images
-    case 'imageObject':
-      const sortedScales = Object.values(image.scales)
-        .filter((scale) => scale.width <= maxSize)
-        .filter(
-          (scale, index, array) =>
-            index ===
-            array.findIndex((foundItem) => foundItem.width === scale.width),
-        ) // avoid duplicates if image is small and original is smaller than scale
-        .sort((a, b) => {
-          if (a.width > b.width) return 1;
-          else if (a.width < b.width) return -1;
-          else return 0;
-        });
-
-      const scale = sortedScales[0];
-      attrs.src = `${scale?.download ?? image.download}`;
-      if (isFromBrain) attrs.src = `${itemPath}${attrs.src}`;
-      attrs.src = flattenToAppURL(attrs.src);
-
-      attrs.aspectRatio = Math.round((image.width / image.height) * 100) / 100;
-      attrs.width = image.width;
-      attrs.height = image.height;
-
-      if (maxSize !== DEFAULT_MAX_SIZE && sortedScales.length > 0) {
-        const maxScale = sortedScales[sortedScales.length - 1];
-        attrs.width = maxScale.width;
-        attrs.height = maxScale.height;
-      }
-
-      attrs.srcSet = sortedScales.map((scale) => {
-        let src = `${scale.download} ${scale.width}w`;
-        if (isFromBrain) src = `${itemPath}${src}`;
-        return flattenToAppURL(src);
-      });
-
-      if (useOriginal || sortedScales?.length === 0) {
-        let originalSrc = `${image.download} ${image.width}w`;
-        if (isFromBrain) originalSrc = `${itemPath}${originalSrc}`;
-        attrs.srcSet = attrs.srcSet.concat(flattenToAppURL(originalSrc));
-      }
-      break;
-
-    // Internal URL
-    case 'internalUrl':
-      let baseUrl = `@@images/${imageField}`;
-      if (isFromBrain) baseUrl = `${itemPath}${baseUrl}`;
-      else baseUrl = `${image.split('/@@images')[0]}/${baseUrl}`;
-      baseUrl = flattenToAppURL(baseUrl);
-
-      attrs.src = `${baseUrl}/${minScale}`;
-
-      attrs.srcSet = Object.keys(imageScales)
-        .sort((a, b) => {
-          if (imageScales[a] > imageScales[b]) return 1;
-          else if (imageScales[a] < imageScales[b]) return -1;
-          else return 0;
-        })
-        .reduce((srcSet, scale) => {
-          if (imageScales[scale] <= maxSize) {
-            return [...srcSet, `${baseUrl}/${scale} ${imageScales[scale]}w`];
-          } else return srcSet;
-        }, []);
-
-      if (useOriginal) attrs.srcSet = attrs.srcSet.concat(`${baseUrl} 1900w`); // expect that is for desktop screens, I don't have actual size
-      break;
-
-    // External URL or other element
-    default:
-      attrs.src = typeof image === 'string' ? image : null;
-      break;
-  }
-  return attrs;
-};
diff --git a/src/components/ItaliaTheme/Blocks/CTABlock/Block.jsx b/src/components/ItaliaTheme/Blocks/CTABlock/Block.jsx
index f042f0718..52f19515b 100644
--- a/src/components/ItaliaTheme/Blocks/CTABlock/Block.jsx
+++ b/src/components/ItaliaTheme/Blocks/CTABlock/Block.jsx
@@ -1,10 +1,7 @@
 import { Button, Container } from 'design-react-kit';
-/* eslint-disable jsx-a11y/no-static-element-interactions */
-/* eslint-disable jsx-a11y/click-events-have-key-events */
 import React, { useRef, useState, useEffect } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 
-import Image from '@plone/volto/components/theme/Image/Image';
 import PropTypes from 'prop-types';
 import { TextEditorWidget } from 'design-comuni-plone-theme/components/ItaliaTheme';
 import { UniversalLink } from '@plone/volto/components';
@@ -27,6 +24,7 @@ const messages = defineMessages({
   },
 });
 
+
 const Block = ({
   data,
   block,
@@ -40,6 +38,7 @@ const Block = ({
   selected,
 }) => {
   const intl = useIntl();
+  const Image = config.getComponent({ name: 'Image' }).component;
   const title = data?.cta_title?.blocks[0]?.text;
   const hasImage = data?.showImage && data?.ctaImage?.length > 0;
   const content = data?.cta_content;
@@ -78,20 +77,18 @@ const Block = ({
       }}
     >
       {hasImage && data?.ctaImage?.length > 0 && (
-        <Image
-          itemUrl={data.ctaImage[0]['@id']}
-          image={
-            data.ctaImage[0].image_scales?.[
-              data.ctaImage[0].image_field
-            ]?.[0] || data.ctaImage[0]['@id']
-          }
-          key={data.ctaImage[0]['@id']}
-          alt=""
-          aria-hidden="true"
-          loading="lazy"
-          useOriginal={false}
-          role="presentation"
-        />
+        <figure className="img-wrapper">
+          <Image
+            item={data.ctaImage?.[0]}
+            sizes="100vw"
+            loading="lazy"
+            responsive={true}
+            alt=""
+            aria-hidden="true"
+            role="presentation"
+            key={data.ctaImage[0]['@id']}
+          />
+        </figure>
       )}
       <Container tag="div" className="px-3 px-md-4">
         <div className="cta-tile-text">
diff --git a/src/components/ItaliaTheme/Blocks/Calendar/Item.jsx b/src/components/ItaliaTheme/Blocks/Calendar/Item.jsx
index 0c9a69f62..3a45983eb 100644
--- a/src/components/ItaliaTheme/Blocks/Calendar/Item.jsx
+++ b/src/components/ItaliaTheme/Blocks/Calendar/Item.jsx
@@ -1,6 +1,7 @@
+/*
+ * Component Item of Calendar block
+ */
 import React from 'react';
-import moment from 'moment';
-
 import { useDispatch, useSelector } from 'react-redux';
 import { defineMessages, useIntl } from 'react-intl';
 import { Spinner } from 'design-react-kit';
@@ -9,9 +10,8 @@ import useDeepCompareEffect from 'use-deep-compare-effect';
 import { getCalendarDayResults } from 'design-comuni-plone-theme/actions';
 import { ConditionalLink } from '@plone/volto/components';
 import { flattenToAppURL } from '@plone/volto/helpers';
-import Image from '@plone/volto/components/theme/Image/Image';
-
 import { viewDate } from 'design-comuni-plone-theme/helpers';
+import config from '@plone/volto/registry';
 
 const messages = defineMessages({
   scadenza_bando: {
@@ -30,7 +30,7 @@ const messages = defineMessages({
 
 const Item = ({ day, path, query, inEditMode, data }) => {
   const intl = useIntl();
-
+  const Image = config.getComponent({ name: 'Image' }).component;
   const calendarDayResults = useSelector(
     (state) => state.calendarDaySearch.subrequests,
   );
@@ -79,6 +79,13 @@ const Item = ({ day, path, query, inEditMode, data }) => {
         {calendarDayResults[day] ? (
           calendarDayResults[day].items[day]?.map((item, index) => {
             const eventHasImage = Object.keys(item.image_scales).length > 0;
+            const item_start = new Date(item.start);
+            const item_start_time = item_start
+              ? `${item_start.getHours()}:${item_start
+                  .getMinutes()
+                  .toString()
+                  .padStart(2, '0')}`
+              : null;
 
             return (
               <div key={index} className="calendar-item">
@@ -86,19 +93,16 @@ const Item = ({ day, path, query, inEditMode, data }) => {
                   {show_preview_img && eventHasImage && (
                     <div className="item-img">
                       <Image
-                        image={
-                          item.image_scales?.preview_image?.[0] ||
-                          item.image_scales?.image?.[0]
-                        }
-                        itemUrl={item['@id']}
+                        item={item}
                         alt=""
-                        containerClassName="img-wrapper"
+                        className="img-fluid"
+                        sizes="80px"
                       />
                     </div>
                   )}
                   <div className="item-info">
                     <div>{item?.type}</div>
-                    <div>{moment(item.start).format('HH:mm')}</div>
+                    {item_start_time && <div>{item_start_time}</div>}
                     <div className="calendar-type">
                       <ConditionalLink
                         condition={!inEditMode}
diff --git a/src/components/ItaliaTheme/Blocks/Calendar/ListingSidebar.jsx b/src/components/ItaliaTheme/Blocks/Calendar/ListingSidebar.jsx
index cd76e7a04..3158e0e67 100644
--- a/src/components/ItaliaTheme/Blocks/Calendar/ListingSidebar.jsx
+++ b/src/components/ItaliaTheme/Blocks/Calendar/ListingSidebar.jsx
@@ -9,6 +9,7 @@ import { LocationFiltersWidget } from 'design-comuni-plone-theme/components/Ital
 
 import upSVG from '@plone/volto/icons/up-key.svg';
 import downSVG from '@plone/volto/icons/down-key.svg';
+import config from '@plone/volto/registry';
 
 const messages = defineMessages({
   calendarBlockSidebarTitle: {
@@ -55,7 +56,6 @@ const ListingSidebar = (props) => {
 
     setActiveAccIndex(newIndex);
   }
-
   return (
     <Segment.Group raised>
       <header className="header pulled">
@@ -128,7 +128,10 @@ const ListingSidebar = (props) => {
           )}
         </Accordion.Title>
         <Accordion.Content active={activeAccIndex === 1}>
-          <ListingData {...props} />
+          <ListingData
+            blocksConfig={{ listing: config.blocks.blocksConfig.listing }}
+            {...props}
+          />
         </Accordion.Content>
       </Accordion>
     </Segment.Group>
diff --git a/src/components/ItaliaTheme/Blocks/HighlightedContent/Body.jsx b/src/components/ItaliaTheme/Blocks/HighlightedContent/Body.jsx
index e1b77d91f..a31e042de 100644
--- a/src/components/ItaliaTheme/Blocks/HighlightedContent/Body.jsx
+++ b/src/components/ItaliaTheme/Blocks/HighlightedContent/Body.jsx
@@ -14,7 +14,6 @@ import {
   CardReadMore,
 } from 'design-react-kit';
 
-import Image from '@plone/volto/components/theme/Image/Image';
 import { flattenToAppURL } from '@plone/volto/helpers';
 
 import { getCategory } from 'design-comuni-plone-theme/components/ItaliaTheme/Blocks/Listing/Commons/utils';
@@ -23,10 +22,12 @@ import {
   getItemIcon,
 } from 'design-comuni-plone-theme/components/ItaliaTheme';
 import { viewDate } from 'design-comuni-plone-theme/helpers';
+import config from '@plone/volto/registry';
 
 const Body = (props) => {
   const { content, block } = props;
   const intl = useIntl();
+  const Image = config.getComponent({ name: 'Image' }).component;
   const icon = getItemIcon(content);
 
   const { show_type = true, show_section } = block;
@@ -38,12 +39,15 @@ const Body = (props) => {
         {(content.preview_image || content.image) && (
           <Col lg={{ size: 6, offset: 1, order: 2 }}>
             <Image
-              image={content.preview_image || content.image}
+              item={content}
+              imageField={content.preview_image ? 'preview_image' : 'image'}
               alt=""
               className={cx('item-image', {
                 'natural-image-size': block.natural_image_size,
               })}
               role={null}
+              responsive={true}
+              sizes="(max-width:768px) 90vw, (max-width:1024px) 450px, 560px"
             />
           </Col>
         )}
diff --git a/src/components/ItaliaTheme/Blocks/Listing/CardWithImageTemplate.jsx b/src/components/ItaliaTheme/Blocks/Listing/CardWithImageTemplate.jsx
index 79520fee7..54e5734fc 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/CardWithImageTemplate.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/CardWithImageTemplate.jsx
@@ -1,3 +1,6 @@
+/*
+ * componente per visulizzare un CT "Persona" nei Listing o in aclune pagine
+ */
 import React from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
diff --git a/src/components/ItaliaTheme/Blocks/Listing/CardWithSlideUpTextTemplate.jsx b/src/components/ItaliaTheme/Blocks/Listing/CardWithSlideUpTextTemplate.jsx
index 4563dc1ac..fa6b3995d 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/CardWithSlideUpTextTemplate.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/CardWithSlideUpTextTemplate.jsx
@@ -53,7 +53,7 @@ const CardWithSlideUpTextTemplate = (props) => {
         </div>
         <div className="grid mb-3 mt-5">
           {items.map((item, index) => {
-            const image = getListingImageBackground(item, 'teaser');
+            const image = getListingImageBackground(item, 'large');
             const category = getCategory(item, show_type, show_section, props);
             const date = hide_dates
               ? null
diff --git a/src/components/ItaliaTheme/Blocks/Listing/Commons/ListingImage.jsx b/src/components/ItaliaTheme/Blocks/Listing/Commons/ListingImage.jsx
index e5d8e4437..25337f9d1 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/Commons/ListingImage.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/Commons/ListingImage.jsx
@@ -1,37 +1,34 @@
 import DefaultImageSVG from '@plone/volto/components/manage/Blocks/Listing/default-image.svg';
-import Image from '@plone/volto/components/theme/Image/Image';
 import { flattenToAppURL } from '@plone/volto/helpers';
+import config from '@plone/volto/registry';
 
 const ListingImage = ({
   item = {},
+  loading = 'lazy',
   showDefault = false,
-  useOriginal = false,
-  maxSize,
   className = 'listing-image',
+  responsive = true,
+  sizes = '(max-width:320px) 200px, (max-width:425px) 300px, (max-width:768px) 400px, 300px',
   ...imageProps
 }) => {
-  if (!item.image_field || !item.image_scales?.[item.image_field]?.[0]) {
-    if (showDefault) {
-      return <img src={DefaultImageSVG} alt="" />;
-    }
-    return null;
-  } else {
-    return (
-      <Image
-        className={className}
-        itemUrl={item['@id']}
-        image={item.image_scales?.[item.image_field]?.[0] || item['@id']}
-        aria-hidden="true"
-        alt=""
-        title={item.title}
-        role="presentation"
-        imageField={item.image_field}
-        useOriginal={useOriginal}
-        maxSize={maxSize}
-        {...imageProps}
-      />
-    );
-  }
+  const Image = config.getComponent({ name: 'Image' }).component;
+  // photogallery needs to check for null image
+  // https://stackoverflow.com/questions/33136399/is-there-a-way-to-tell-if-reactelement-renders-null
+  const image = Image({ 
+    item, 
+    'aria-hidden': true, 
+    alt: '', 
+    role: 'presentation', 
+    className, 
+    loading, 
+    title: item.title, 
+    responsive, 
+    sizes, 
+    ...imageProps });
+
+  if (image === null) return showDefault ? <img src={DefaultImageSVG} alt="" /> : null;
+
+  return image;
 };
 
 export const getListingImageBackground = (item = {}, size = 'listing') => {
diff --git a/src/components/ItaliaTheme/Blocks/Listing/CompleteBlockLinksTemplate.jsx b/src/components/ItaliaTheme/Blocks/Listing/CompleteBlockLinksTemplate.jsx
index d304bae96..0ee8281e5 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/CompleteBlockLinksTemplate.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/CompleteBlockLinksTemplate.jsx
@@ -1,3 +1,6 @@
+/*
+ * Blocco link completo
+ */
 import React from 'react';
 import PropTypes from 'prop-types';
 import { UniversalLink } from '@plone/volto/components';
@@ -50,8 +53,8 @@ const CompleteBlockLinksTemplate = ({
           </Row>
         )}
         <Row className="items">
-          {items.map((item, index) => {
-            const image = ListingImage({ item, className: '' });
+          {items.map((item) => {
+            const image = ListingImage({ item, className: '', sizes: '60px' });
 
             return (
               <Col md="6" lg="3" key={item['@id']} className="col-item">
diff --git a/src/components/ItaliaTheme/Blocks/Listing/ContentInEvidenceTemplate.jsx b/src/components/ItaliaTheme/Blocks/Listing/ContentInEvidenceTemplate.jsx
index 586e577d3..38098d21d 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/ContentInEvidenceTemplate.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/ContentInEvidenceTemplate.jsx
@@ -1,3 +1,6 @@
+/*
+ * Contenuto in evidenza
+ */
 import React from 'react';
 import PropTypes from 'prop-types';
 import { useIntl, defineMessages } from 'react-intl';
diff --git a/src/components/ItaliaTheme/Blocks/Listing/GridGalleryTemplate.jsx b/src/components/ItaliaTheme/Blocks/Listing/GridGalleryTemplate.jsx
index 0806ff2b8..071351429 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/GridGalleryTemplate.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/GridGalleryTemplate.jsx
@@ -1,3 +1,6 @@
+/*
+ * Gallery a griglia
+ */
 import { Alert, Col, Container, Row } from 'design-react-kit';
 import {
   ListingImage,
@@ -55,7 +58,6 @@ const GridGalleryTemplate = ({
           {items.map((item, index) => {
             let image = ListingImage({
               item,
-              useOriginal: false,
               className: '',
             });
 
diff --git a/src/components/ItaliaTheme/Blocks/Listing/InEvidenceTemplate.jsx b/src/components/ItaliaTheme/Blocks/Listing/InEvidenceTemplate.jsx
index a1e6040ae..408ab9182 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/InEvidenceTemplate.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/InEvidenceTemplate.jsx
@@ -1,3 +1,6 @@
+/*
+ * In evidenza
+ */
 import React from 'react';
 import PropTypes from 'prop-types';
 import {
@@ -83,7 +86,10 @@ const InEvidenceTemplate = (props) => {
             const listingText = show_description ? (
               <ListingText item={item} />
             ) : null;
-            const image = ListingImage({ item });
+            const image = ListingImage({
+              item,
+              sizes: '(max-width:320px) 200px, 300px',
+            });
             const category = getCategory(item, show_type, show_section, props);
             const topics = show_topics ? item.tassonomia_argomenti : null;
 
diff --git a/src/components/ItaliaTheme/Blocks/Listing/PhotogalleryTemplate.jsx b/src/components/ItaliaTheme/Blocks/Listing/PhotogalleryTemplate.jsx
index 950c6feee..103192783 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/PhotogalleryTemplate.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/PhotogalleryTemplate.jsx
@@ -1,3 +1,6 @@
+/*
+ * Photogallery
+ */
 import 'slick-carousel/slick/slick.css';
 import 'design-comuni-plone-theme/components/slick-carousel/slick/slick-theme.css';
 
@@ -139,7 +142,7 @@ const PhotogalleryTemplate = ({
 
   const figure = (image, item) => {
     return (
-      <figure className="img-wrapper">
+      <figure className="img-wrapper volto-image responsive">
         {image}
         {getCaption(item) && <figcaption>{getCaption(item)}</figcaption>}
       </figure>
@@ -163,7 +166,6 @@ const PhotogalleryTemplate = ({
             <Slider {...settings} ref={slider}>
               {items.map((item, i) => {
                 const image = ListingImage({ item });
-
                 return (
                   <div
                     className={cx('it-single-slide-wrapper', {
diff --git a/src/components/ItaliaTheme/Blocks/Listing/SliderTemplate.jsx b/src/components/ItaliaTheme/Blocks/Listing/SliderTemplate.jsx
index 2215a9514..c753c6164 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/SliderTemplate.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/SliderTemplate.jsx
@@ -1,3 +1,6 @@
+/*
+ * Slider
+ */
 import 'slick-carousel/slick/slick.css';
 import 'design-comuni-plone-theme/components/slick-carousel/slick/slick-theme.css';
 import { Col, Container, Row } from 'design-react-kit';
@@ -350,7 +353,7 @@ const SliderTemplate = ({
                 const image = ListingImage({
                   item,
                   loading: index === 0 ? 'eager' : 'lazy',
-                  maxSize: 1600,
+                  sizes: `max-width(980px) 600px, ${1200 / nSlidesToShow}px`,
                   critical: true,
                 });
                 return (
diff --git a/src/components/ItaliaTheme/Blocks/Listing/SmallBlockLinksTemplate.jsx b/src/components/ItaliaTheme/Blocks/Listing/SmallBlockLinksTemplate.jsx
index 62775a060..646d03cc6 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/SmallBlockLinksTemplate.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/SmallBlockLinksTemplate.jsx
@@ -1,3 +1,6 @@
+/*
+ * Blocco link solo immagini
+ */
 import React from 'react';
 import PropTypes from 'prop-types';
 import { Container, Row, Col } from 'design-react-kit';
@@ -35,7 +38,7 @@ const SmallBlockLinksTemplate = ({
         )}
         <Row className="items">
           {items.map((item, index) => {
-            const image = ListingImage({ item, maxSize: 200, style: {} });
+            const image = ListingImage({ item, sizes: '200px', style: {} });
 
             return (
               <Col
diff --git a/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/CardWithImageTemplateSkeleton.jsx b/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/CardWithImageTemplateSkeleton.jsx
index c52f0050d..eccdcc6f5 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/CardWithImageTemplateSkeleton.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/CardWithImageTemplateSkeleton.jsx
@@ -56,10 +56,8 @@ const CardWithImageTemplateSkeleton = ({
                     )}
                     <CardBody className="px-4">
                       <CardCategory></CardCategory>
-
                       <CardTitle tag="h4">-</CardTitle>
                       <CardText className="mb-3"></CardText>
-
                       <div>
                         {[0, 1].map((argument) => (
                           <Chip
diff --git a/src/components/ItaliaTheme/GalleryPreview/GalleryPreview.jsx b/src/components/ItaliaTheme/GalleryPreview/GalleryPreview.jsx
index 06b11ddfc..86e214af6 100644
--- a/src/components/ItaliaTheme/GalleryPreview/GalleryPreview.jsx
+++ b/src/components/ItaliaTheme/GalleryPreview/GalleryPreview.jsx
@@ -89,12 +89,7 @@ const GalleryPreview = ({ id, viewIndex, setViewIndex, items }) => {
               )}
 
               {image && (
-                <Image
-                  key={image['@id']}
-                  itemUrl={image['@id']}
-                  image={image['@id']}
-                  alt={image.title}
-                />
+                <Image key={image['@id']} item={image} alt={image.title} />
               )}
 
               {items.length > 1 && (
diff --git a/src/components/ItaliaTheme/View/BandoView/BandoAreaResponsabile.jsx b/src/components/ItaliaTheme/View/BandoView/BandoAreaResponsabile.jsx
index 6388cc4d1..155e0fec1 100644
--- a/src/components/ItaliaTheme/View/BandoView/BandoAreaResponsabile.jsx
+++ b/src/components/ItaliaTheme/View/BandoView/BandoAreaResponsabile.jsx
@@ -1,3 +1,6 @@
+/**
+ * BandoAreaResponsabile component used in BandoView.
+ */
 import React from 'react';
 import PropTypes from 'prop-types';
 import { defineMessages, useIntl } from 'react-intl';
diff --git a/src/components/ItaliaTheme/View/BandoView/BandoServizi.jsx b/src/components/ItaliaTheme/View/BandoView/BandoServizi.jsx
index e5bb6016c..1d0cf6b39 100644
--- a/src/components/ItaliaTheme/View/BandoView/BandoServizi.jsx
+++ b/src/components/ItaliaTheme/View/BandoView/BandoServizi.jsx
@@ -1,3 +1,6 @@
+/*
+ * SubComponent of BandoView
+ */
 import React from 'react';
 import PropTypes from 'prop-types';
 import { defineMessages, useIntl } from 'react-intl';
diff --git a/src/components/ItaliaTheme/View/Commons/ContentImage.jsx b/src/components/ItaliaTheme/View/Commons/ContentImage.jsx
index 1f615e08a..1856b132e 100644
--- a/src/components/ItaliaTheme/View/Commons/ContentImage.jsx
+++ b/src/components/ItaliaTheme/View/Commons/ContentImage.jsx
@@ -11,18 +11,21 @@ import config from '@plone/volto/registry';
  */
 const ContentImage = ({ content, position }) => {
   const view =
-    (content?.image || content?.image_caption || content?.foto_persona) &&
+    (content?.image || content?.foto_persona) &&
     config.settings.italiaThemeViewsConfig.imagePosition === position;
+  const fullWidth =
+    config.settings.italiaThemeViewsConfig.imagePosition === 'afterHeader';
+  const field_name = content.image ? 'image' : 'foto_persona';
 
   return view ? (
     <div className="content-image">
       <WideImage
         title={content.title}
-        image={content.image || content.foto_persona}
+        image={content}
+        fieldName={field_name}
         caption={content.image_caption}
-        fullWidth={
-          config.settings.italiaThemeViewsConfig.imagePosition === 'afterHeader'
-        }
+        sizes={fullWidth ? '100vw' : '(max-width: 768px) 90vw, 800px'}
+        fullWidth={fullWidth}
       />
     </div>
   ) : null;
diff --git a/src/components/ItaliaTheme/View/Commons/CuredBy.jsx b/src/components/ItaliaTheme/View/Commons/CuredBy.jsx
index abe3607d5..68bf1b341 100644
--- a/src/components/ItaliaTheme/View/Commons/CuredBy.jsx
+++ b/src/components/ItaliaTheme/View/Commons/CuredBy.jsx
@@ -1,3 +1,7 @@
+/*
+ * CuredBy component class, used in `NewsItemACuraDi` component.
+ */
+
 import { defineMessages, useIntl } from 'react-intl';
 import React from 'react';
 import PropTypes from 'prop-types';
@@ -24,15 +28,7 @@ const messages = defineMessages({
   },
 });
 
-/**
- * CuredBy view component class.
- * @function CuredBy
- * @params {object} content: Content object.
- * @params {string} office_field: field where office is related
- * @params {string} office_field: field where people is related
- * @returns {string} Markup of the component.
- */
-const CuredBy = ({ office, people, title }) => {
+const CuredBy = ({ office, people }) => {
   const intl = useIntl();
   return (
     <RichTextSection
diff --git a/src/components/ItaliaTheme/View/Commons/Events.jsx b/src/components/ItaliaTheme/View/Commons/Events.jsx
index 4e4ec782b..6f1bcc47c 100644
--- a/src/components/ItaliaTheme/View/Commons/Events.jsx
+++ b/src/components/ItaliaTheme/View/Commons/Events.jsx
@@ -7,11 +7,10 @@ import {
   CardText,
   CardTitle,
 } from 'design-react-kit';
-
+import config from '@plone/volto/registry';
 import { UniversalLink } from '@plone/volto/components';
 import { flattenToAppURL } from '@plone/volto/helpers';
 import { RichTextSection } from 'design-comuni-plone-theme/components/ItaliaTheme/View';
-import Image from '@plone/volto/components/theme/Image/Image';
 import { viewDate } from 'design-comuni-plone-theme/helpers';
 
 const messages = defineMessages({
@@ -29,15 +28,9 @@ const messages = defineMessages({
   },
 });
 
-/**
- * Evento view component class.
- * @function Evento
- * @params {object} Evento: object.
- * @returns {string} Markup of the component.
- */
-const Evento = ({ event, show_image }) => {
+const SubEvent = ({ event, show_image }) => {
   const intl = useIntl();
-
+  const Image = config.getComponent({ name: 'Image' }).component;
   return event ? (
     <div className="card-wrapper card-teaser">
       <Card noWrapper className="card card-img no-after shadow rounded">
@@ -45,17 +38,14 @@ const Evento = ({ event, show_image }) => {
           (event.image_field || event.preview_image || event.image) && (
             <div className="img-responsive-wrapper">
               <div className="img-responsive">
-                <Image
-                  itemUrl={event.image_field ? event['@id'] : undefined}
-                  image={
-                    event.image_scales?.[event.image_field]?.[0] ||
-                    event.preview_image ||
-                    event.image ||
-                    event['@id']
-                  }
-                  alt={intl.formatMessage(messages.immagine)}
-                  containerClassName="img-wrapper"
-                />
+                <figure class="volto-image img-wrapper responsive">
+                  <Image
+                    item={event}
+                    alt={intl.formatMessage(messages.immagine)}
+                    loading="lazy"
+                    sizes="(max-width:320px) 300px, (max-width:425px) 400px, (max-width:768px) 600px, 300px"
+                  />
+                </figure>
                 {event.start && (
                   <div className="card-calendar d-flex flex-column justify-content-center">
                     {viewDate(intl.locale, event.start, 'DD MMM')}
@@ -87,6 +77,11 @@ const Evento = ({ event, show_image }) => {
   ) : null;
 };
 
+SubEvent.propTypes = {
+  event: PropTypes.object.isRequired,
+  show_image: PropTypes.bool,
+};
+
 /**
  * Events view component class.
  * @function Events
@@ -95,7 +90,6 @@ const Evento = ({ event, show_image }) => {
  */
 const Events = ({ content, title, show_image, folder_name, isChild }) => {
   const intl = useIntl();
-
   const events = isChild
     ? content?.parent
       ? [content.parent]
@@ -109,7 +103,7 @@ const Events = ({ content, title, show_image, folder_name, isChild }) => {
     >
       <div className="card-wrapper card-teaser-wrapper card-teaser-wrapper-equal">
         {events.map((item, i) => (
-          <Evento key={item['@id']} event={item} show_image={show_image} />
+          <SubEvent key={item['@id']} event={item} show_image={show_image} />
         ))}
       </div>
     </RichTextSection>
@@ -125,8 +119,3 @@ Events.propTypes = {
   title: PropTypes.string,
   folder_name: PropTypes.string,
 };
-
-Evento.propTypes = {
-  event: PropTypes.object,
-  show_image: PropTypes.bool,
-};
diff --git a/src/components/ItaliaTheme/View/Commons/Gallery.jsx b/src/components/ItaliaTheme/View/Commons/Gallery.jsx
index e9472a622..8c2746031 100644
--- a/src/components/ItaliaTheme/View/Commons/Gallery.jsx
+++ b/src/components/ItaliaTheme/View/Commons/Gallery.jsx
@@ -9,11 +9,11 @@ import { useDispatch, useSelector } from 'react-redux';
 
 import EmbeddedVideo from './EmbeddedVideo';
 import { GalleryPreview } from 'design-comuni-plone-theme/components/ItaliaTheme';
-import Image from '@plone/volto/components/theme/Image/Image';
 import PropTypes from 'prop-types';
 import { contentFolderHasItems } from 'design-comuni-plone-theme/helpers';
 import { flattenToAppURL } from '@plone/volto/helpers';
 import { injectLazyLibs } from '@plone/volto/helpers/Loadable/Loadable';
+import config from '@plone/volto/registry';
 
 const messages = defineMessages({
   gallery: {
@@ -45,6 +45,7 @@ const Gallery = ({
   reactSlick,
 }) => {
   const Slider = reactSlick.default;
+  const Image = config.getComponent({ name: 'Image' }).component;
   const getSettings = (nItems, slideToScroll) => {
     return {
       dots: true,
@@ -114,9 +115,11 @@ const Gallery = ({
   }, [url]);
 
   const multimedia = searchResults?.[folder_name]?.items || [];
-  let images = multimedia.filter((item) => item['@type'] === 'Image');
-  let videos = multimedia.filter((item) => item['@type'] === 'Link');
-  let gallery_title = title || intl.formatMessage(messages.gallery);
+  const images = multimedia.filter((item) => item['@type'] === 'Image');
+  const videos = multimedia.filter((item) => item['@type'] === 'Link');
+  const gallery_title = title || intl.formatMessage(messages.gallery);
+  const default_width_image =
+    images.length > 3 ? '200px' : `${650 / images.length}px`;
 
   return !hasChildren ? null : (
     <>
@@ -166,13 +169,11 @@ const Gallery = ({
                         )} ${item.title}`}
                       >
                         <Image
-                          itemUrl={item['@id']}
-                          image={
-                            item.image_scales?.[item.image_field]?.[0] ||
-                            item['@id']
-                          }
+                          item={item}
                           alt={item.title}
                           className="img-fluid"
+                          loading="lazy"
+                          sizes={`(max-width:320px) 300px, (max-width:425px) 400px, ${default_width_image}`}
                         />
                       </a>
                       <figcaption className="figure-caption mt-2">
diff --git a/src/components/ItaliaTheme/View/Commons/GenericCard.jsx b/src/components/ItaliaTheme/View/Commons/GenericCard.jsx
index 73a884ad6..7d9ff5646 100644
--- a/src/components/ItaliaTheme/View/Commons/GenericCard.jsx
+++ b/src/components/ItaliaTheme/View/Commons/GenericCard.jsx
@@ -6,7 +6,6 @@ import cx from 'classnames';
 import { UniversalLink } from '@plone/volto/components';
 import { getContent, resetContent } from '@plone/volto/actions';
 import { flattenToAppURL } from '@plone/volto/helpers';
-import Image from '@plone/volto/components/theme/Image/Image';
 import { injectLazyLibs } from '@plone/volto/helpers/Loadable/Loadable';
 import { getCalendarDate } from 'design-comuni-plone-theme/helpers';
 import {
@@ -15,6 +14,7 @@ import {
   getItemIcon,
   ListingCategory,
 } from 'design-comuni-plone-theme/components/ItaliaTheme';
+import config from '@plone/volto/registry';
 
 /**
  * GenericCard view component class.
@@ -33,13 +33,8 @@ const GenericCard = ({
   size,
   rrule,
 }) => {
-  let item_fo = null;
-  const locationContent = useSelector((state) => state.content.subrequests);
-  const dispatch = useDispatch();
-  const url = flattenToAppURL(item['@id']);
-  const key = `generic_card_${url}`;
   const icon = getItemIcon(item);
-
+  const Image = config.getComponent({ name: 'Image' }).component;
   const infos = (
     <>
       {showInfos && (
@@ -55,43 +50,35 @@ const GenericCard = ({
       )}
     </>
   );
+  const cooked_image_field = image_field || item.image_field;
+  // (item.preview_image ? 'preview_image' : 'image');
+  const image =
+    showimage &&
+    item &&
+    Image({
+      item: item,
+      imageField: cooked_image_field,
+      alt: '',
+      title: item.title,
+    });
 
-  useEffect(() => {
-    if (showimage) {
-      dispatch(getContent(url, null, key));
-      return () => dispatch(resetContent(key));
-    }
-  }, [dispatch, key, showimage, url]);
-
-  item_fo = locationContent?.[key]?.data || item;
-
-  return item_fo ? (
-    showimage && (item_fo.image || item_fo.preview_image) ? (
-      <div
-        className={cx('genericcard card card-img shadow rounded mt-3 ', {
-          'card-teaser': !showimage,
-        })}
-      >
+  return item ? (
+    image ? (
+      <div className={cx('genericcard card card-img shadow rounded mt-3')}>
         <div className="img-responsive-wrapper">
           <div className="img-responsive img-responsive-panoramic">
-            <figure className="img-wrapper">
-              <Image
-                image={item_fo.preview_image || item_fo.image}
-                alt=""
-                title={item_fo.title}
-              />
-            </figure>
+            <figure className="img-wrapper">{image}</figure>
           </div>
         </div>
         <div className="card-body px-4">
           {infos}
           <div className="card-title h5">
             {show_icon && <Icon icon={show_icon} padding={false} />}
-            <UniversalLink item={item_fo}>{item_fo.title}</UniversalLink>
+            <UniversalLink item={item}>{item.title}</UniversalLink>
           </div>
           {(showDescription || children) && (
             <div className="card-text">
-              {item_fo.description} {children}
+              {item.description} {children}
             </div>
           )}
         </div>
@@ -107,11 +94,11 @@ const GenericCard = ({
           {infos}
           <div className="card-title h5">
             {show_icon && <Icon icon={show_icon} padding={false} />}
-            <UniversalLink item={item_fo}>{item_fo.title}</UniversalLink>
+            <UniversalLink item={item}>{item.title}</UniversalLink>
           </div>
           {(showDescription || children) && (
             <div className="card-text">
-              {item_fo.description} {children}
+              {item.description} {children}
             </div>
           )}
         </div>
diff --git a/src/components/ItaliaTheme/View/Commons/LocationItem.jsx b/src/components/ItaliaTheme/View/Commons/LocationItem.jsx
index a6de458ba..6c6192bd3 100644
--- a/src/components/ItaliaTheme/View/Commons/LocationItem.jsx
+++ b/src/components/ItaliaTheme/View/Commons/LocationItem.jsx
@@ -1,12 +1,14 @@
-import React, { useEffect } from 'react';
-import { useDispatch, useSelector } from 'react-redux';
+/*
+ * Component used to display a location item (luoghi_correlati)
+ * in VenueDescription, subcomponents of VenueView (luogo)
+ */
+import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import { UniversalLink } from '@plone/volto/components';
 import PropTypes from 'prop-types';
-import { getContent, resetContent } from '@plone/volto/actions';
 import { flattenToAppURL } from '@plone/volto/helpers';
 import { Icon } from 'design-comuni-plone-theme/components/ItaliaTheme';
-import Image from '@plone/volto/components/theme/Image/Image';
+import config from '@plone/volto/registry';
 
 const messages = defineMessages({
   locations: {
@@ -31,50 +33,34 @@ const LocationItem = ({
   location,
   show_icon,
   show_title_link,
-  load = true,
   details_link = true,
 }) => {
   const intl = useIntl();
-  const url = flattenToAppURL(location['@id']);
-  const key = `luogo${url}`;
-  const locationContent = useSelector((state) => state.content.subrequests);
-  const loaded =
-    locationContent?.[key]?.loading || locationContent?.[key]?.loaded;
-  const dispatch = useDispatch();
-
-  useEffect(() => {
-    if (load && !loaded) {
-      dispatch(getContent(url, null, key));
-      return () => dispatch(resetContent(key));
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [location]);
-
-  let location_fo = locationContent?.[key]?.data || location;
-
-  let address = ['street', 'city', 'zip_code']
-    .map((key) => location_fo?.[key])
+  const Image = config.getComponent({ name: 'Image' }).component;
+  const image = Image({ item: location, sizes: '80px', loading: 'lazy' });
+  const address = ['street', 'city', 'zip_code']
+    .map((key) => location?.[key])
     .filter(Boolean)
     .join(' - ');
 
-  return location_fo ? (
+  return location ? (
     <div className="card card-teaser shadow mt-3 border-left-card card-big-io-comune p-4 rounded location-item">
       {show_icon && <Icon icon={'it-pin'} />}
       <div className="card-body">
         <div className="card-title h5 venue-card-title">
-          {(location_fo.nome_sede || location_fo.title) && (
+          {(location.nome_sede || location.title) && (
             <>
-              {location_fo['@type'] === 'Venue' ||
-              (location_fo['@type'] === 'UnitaOrganizzativa' &&
+              {location['@type'] === 'Venue' ||
+              (location['@type'] === 'UnitaOrganizzativa' &&
                 show_title_link) ? (
                 <UniversalLink
-                  href={flattenToAppURL(location_fo['@id'])}
-                  title={location_fo.title || ''}
+                  href={flattenToAppURL(location['@id'])}
+                  title={location.title || ''}
                 >
-                  {location_fo.nome_sede || location_fo.title}
+                  {location.nome_sede || location.title}
                 </UniversalLink>
               ) : (
-                location_fo.nome_sede || location_fo.title
+                location.nome_sede || location.title
               )}
             </>
           )}
@@ -84,16 +70,15 @@ const LocationItem = ({
 
           {!details_link && (
             <>
-              {location_fo.quartiere && (
+              {location.quartiere && (
                 <p>
-                  {intl.formatMessage(messages.quartiere)}:{' '}
-                  {location_fo.quartiere}
+                  {intl.formatMessage(messages.quartiere)}: {location.quartiere}
                 </p>
               )}
-              {location_fo.circoscrizione && (
+              {location.circoscrizione && (
                 <p>
                   {intl.formatMessage(messages.circoscrizione)}:{' '}
-                  {location_fo.circoscrizione}
+                  {location.circoscrizione}
                 </p>
               )}
             </>
@@ -101,8 +86,8 @@ const LocationItem = ({
           {details_link && (
             <p className="mt-3">
               <UniversalLink
-                href={flattenToAppURL(location_fo['@id'])}
-                title={location_fo.title || ''}
+                href={flattenToAppURL(location['@id'])}
+                title={location.title || ''}
               >
                 {intl.formatMessage(messages.details)}
               </UniversalLink>
@@ -110,11 +95,7 @@ const LocationItem = ({
           )}
         </div>
       </div>
-      {location_fo.immagine && (
-        <div className="avatar size-xl">
-          <Image image={location_fo.immagine} />
-        </div>
-      )}
+      {image && <div className="avatar size-xl">{image}</div>}
     </div>
   ) : (
     ''
diff --git a/src/components/ItaliaTheme/View/Commons/OfficeCard.jsx b/src/components/ItaliaTheme/View/Commons/OfficeCard.jsx
index 26048fe0b..b16e3292b 100644
--- a/src/components/ItaliaTheme/View/Commons/OfficeCard.jsx
+++ b/src/components/ItaliaTheme/View/Commons/OfficeCard.jsx
@@ -1,14 +1,9 @@
-import React, { useEffect } from 'react';
-
-import { useDispatch, useSelector } from 'react-redux';
 import { UniversalLink } from '@plone/volto/components';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
-import { getContent, resetContent } from '@plone/volto/actions';
-import { flattenToAppURL } from '@plone/volto/helpers';
-import Image from '@plone/volto/components/theme/Image/Image';
 import { Icon } from 'design-comuni-plone-theme/components/ItaliaTheme';
 import { ContactLink } from 'design-comuni-plone-theme/components/ItaliaTheme/View';
+import config from '@plone/volto/registry';
 
 /**
  * OfficeCard view component class.
@@ -18,31 +13,20 @@ import { ContactLink } from 'design-comuni-plone-theme/components/ItaliaTheme/Vi
  */
 const OfficeCard = ({
   office,
-  load_data = true,
   icon,
   children,
   margin_bottom = false,
   show_contacts = true,
+  showimage = true,
   size,
   no_details = false,
   ...rest
 }) => {
-  const url = flattenToAppURL(office['@id']);
-  const key = `${url}_office`;
-
-  const officeContent = useSelector((state) => state.content.subrequests);
-  const dispatch = useDispatch();
-
-  useEffect(() => {
-    if (load_data) {
-      dispatch(getContent(url, null, key));
-      return () => dispatch(resetContent(key));
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [url]);
+  const Image = config.getComponent({ name: 'Image' }).component;
+  const image =
+    showimage && Image({ item: office, sizes: '80px', loading: 'lazy' });
 
-  let office_fo = load_data ? officeContent?.[key]?.data : office;
-  return office_fo ? (
+  return (
     <div
       className={cx(
         'card card-teaser preview-image-card border-left-card rounded shadow p-3 ',
@@ -57,18 +41,18 @@ const OfficeCard = ({
       <div className="card-body pe-3">
         <div className="card-title h5">
           <UniversalLink
-            item={office_fo}
-            title={office_fo.title}
+            item={office}
+            title={office.title}
             data-element="service-area"
           >
-            {office_fo.title}
+            {office.title}
           </UniversalLink>
         </div>
-        <p className="card-text">{office_fo.description}</p>
-        {show_contacts && office_fo?.sede?.length > 0 && (
+        <p className="card-text">{office.description}</p>
+        {show_contacts && office?.sede?.length > 0 && (
           <div>
             {' '}
-            {office_fo?.sede?.map((sede, i) => {
+            {office?.sede?.map((sede, i) => {
               return (
                 <div className="card-text" key={i}>
                   {sede.street && <p>{sede.street}</p>}
@@ -77,7 +61,7 @@ const OfficeCard = ({
                       {sede.zip_code} {sede.city}
                     </p>
                   )}
-                  {office_fo?.contact_info?.map((el) =>
+                  {office?.contact_info?.map((el) =>
                     el?.value_punto_contatto?.map((pdc, i) => {
                       if (pdc.pdc_type === 'telefono') {
                         return (
@@ -105,18 +89,9 @@ const OfficeCard = ({
 
         {children && <div className="card-text">{children}</div>}
       </div>
-      <div className="image-container">
-        {office_fo?.image_scales?.[office_fo?.image_field]?.[0] && (
-          <Image
-            itemUrl={office_fo['@id']}
-            image={office_fo.image_scales[office_fo.image_field][0]}
-            alt=""
-            responsive={false}
-          />
-        )}
-      </div>
+      {image && <div className="image-container">{image}</div>}
     </div>
-  ) : null;
+  );
 };
 export default OfficeCard;
 
diff --git a/src/components/ItaliaTheme/View/Commons/PageHeader/PageHeader.jsx b/src/components/ItaliaTheme/View/Commons/PageHeader/PageHeader.jsx
index 0a5a34d9f..e4248c786 100644
--- a/src/components/ItaliaTheme/View/Commons/PageHeader/PageHeader.jsx
+++ b/src/components/ItaliaTheme/View/Commons/PageHeader/PageHeader.jsx
@@ -1,9 +1,9 @@
+/*
+ * Page Header Component used in most of the views
+ */
 import cx from 'classnames';
 import PropTypes from 'prop-types';
 import { defineMessages, useIntl } from 'react-intl';
-
-import Image from '@plone/volto/components/theme/Image/Image';
-
 import {
   Actions,
   ArgumentIcon,
@@ -19,13 +19,7 @@ import {
   PageHeaderDocumento,
   Sharing,
 } from 'design-comuni-plone-theme/components/ItaliaTheme/View';
-
-/**
- * PageHeader view component class.
- * @function PageHeader
- * @params {object} content: Content object.
- * @returns {string} Markup of the component.
- */
+import config from '@plone/volto/registry';
 
 const messages = defineMessages({
   reading_time: {
@@ -38,79 +32,98 @@ const messages = defineMessages({
   },
 });
 
+/**
+ * PageHeader view component class.
+ * @function PageHeader
+ * @params content {object} content object
+ * @params imageinheader {boolean} if true, show image in header (eg. in PersonaView)
+ * @params imageinheader_field {string} field name of the image to show in header (eg. 'foto_persona')
+ * @params readingtime {number} reading time in minutes
+ * @params showreadingtime {boolean} show or hide reading time
+ * @params showdates {boolean} show or hide dates in header
+ * @params showtassonomiaargomenti {boolean} show or hide argomenti in header
+ * @returns {string} Markup of the component.
+ */
 const PageHeader = (props) => {
+  const {
+    content,
+    imageinheader,
+    imageinheader_field,
+    readingtime,
+    showdates,
+    showreadingtime,
+    showtassonomiaargomenti,
+  } = props;
   const intl = useIntl();
-
+  const Image = config.getComponent({ name: 'Image' }).component;
   return (
     <div className="PageHeaderWrapper mb-4">
       <div className="row mb-2 mb-lg-0 page-header">
         <div
           className={cx('py-lg-2 page-header-left', {
-            'col-lg-6': props.imageinheader,
-            'col-lg-8': !props.imageinheader,
+            'col-lg-6': imageinheader,
+            'col-lg-8': !imageinheader,
           })}
         >
-          {(props.content.icon || props.content.icona) && (
-            <ArgumentIcon icon={props.content.icon || props.content.icona} />
+          {(content.icon || content.icona) && (
+            <ArgumentIcon icon={content.icon || content.icona} />
           )}
           <h1
             data-element={
-              props.content['@type'] === 'Servizio'
-                ? 'service-title'
-                : 'page-name'
+              content['@type'] === 'Servizio' ? 'service-title' : 'page-name'
             }
           >
-            {props.content.title}
+            {content.title}
           </h1>
           <p className="h2">
-            {props.content.subtitle && `${props.content.subtitle}`}
-            {props.content.sottotitolo && `${props.content.sottotitolo}`}
+            {content.subtitle && `${content.subtitle}`}
+            {content.sottotitolo && `${content.sottotitolo}`}
           </p>
 
-          <PageHeaderEventDates content={props.content} />
+          <PageHeaderEventDates content={content} />
 
-          <PageHeaderStatoServizio content={props.content} />
+          <PageHeaderStatoServizio content={content} />
 
-          <PageHeaderDocumento content={props.content} />
+          <PageHeaderDocumento content={content} />
 
-          {props.content.description && (
+          {content.description && (
             <p
               className="documentDescription"
               data-element={
-                props.content['@type'] === 'Servizio'
+                content['@type'] === 'Servizio'
                   ? 'service-description'
                   : undefined
               }
             >
-              {props.content.description}
+              {content.description}
             </p>
           )}
 
-          <PageHeaderBando content={props.content} />
+          <PageHeaderBando content={content} />
 
-          <PageHeaderPersona content={props.content} />
+          <PageHeaderPersona content={content} />
 
-          <PageHeaderNewsItem content={props.content} />
+          <PageHeaderNewsItem content={content} />
 
-          <PageHeaderLinkServizio content={props.content} />
+          <PageHeaderLinkServizio content={content} />
 
           <PageHeaderExtend {...props} />
 
-          {(props.showreadingtime || props.showdates) && (
+          {(showreadingtime || showdates) && (
             <div className="row mt-5 mb-4 readingtime-dates">
-              {props.showdates ? (
-                <PageHeaderDates content={props.content} />
+              {showdates ? (
+                <PageHeaderDates content={content} />
               ) : (
                 <div className="col-6"></div>
               )}
 
-              {props.showreadingtime &&
-                props.readingtime > 0 &&
+              {showreadingtime &&
+                readingtime > 0 &&
                 ((
                   <div className="col-6">
                     <small>{intl.formatMessage(messages.reading_time)}:</small>
                     <p className="font-monospace">
-                      {props.readingtime} {intl.formatMessage(messages.minutes)}
+                      {readingtime} {intl.formatMessage(messages.minutes)}
                     </p>
                   </div>
                 ) || <div className="col-6" />)}
@@ -118,25 +131,26 @@ const PageHeader = (props) => {
           )}
         </div>
 
-        {props.imageinheader && props.content[props.imageinheader_field] ? (
+        {imageinheader && content[imageinheader_field] ? (
           <div className="col-lg-2 page-header-image">
             <figure>
               <Image
-                image={props.content[props.imageinheader_field]}
+                item={content}
+                imageField={imageinheader_field}
                 alt=""
                 className="img-fluid"
-                maxSize={300}
+                sizes="(max-width:768px) 300px, 200px"
               />
             </figure>
           </div>
         ) : null}
 
         <div className={'page-header-right py-lg-4 col-lg-3 offset-lg-1'}>
-          <Sharing url={props.content['@id']} title={props.content.title} />
-          <Actions url={props.content['@id']} title={props.content.title} />
+          <Sharing url={content['@id']} title={content.title} />
+          <Actions url={content['@id']} title={content.title} />
 
-          {props.showtassonomiaargomenti && (
-            <PageHeaderTassonomiaArgomenti content={props.content} />
+          {showtassonomiaargomenti && (
+            <PageHeaderTassonomiaArgomenti content={content} />
           )}
         </div>
       </div>
@@ -148,12 +162,12 @@ export default PageHeader;
 
 PageHeader.propTypes = {
   params: PropTypes.shape({
-    content: PropTypes.object,
-    readingtime: PropTypes.string,
-    showreadingtime: PropTypes.bool,
+    content: PropTypes.object.isRequired,
     imageinheader: PropTypes.bool,
     imageinheader_field: PropTypes.string,
+    readingtime: PropTypes.string,
     showdates: PropTypes.bool,
+    showreadingtime: PropTypes.bool,
     showtassonomiaargomenti: PropTypes.bool,
   }),
 };
diff --git a/src/components/ItaliaTheme/View/Commons/RelatedArticles.jsx b/src/components/ItaliaTheme/View/Commons/RelatedArticles.jsx
index 8dc0383f3..ea6d4f23c 100644
--- a/src/components/ItaliaTheme/View/Commons/RelatedArticles.jsx
+++ b/src/components/ItaliaTheme/View/Commons/RelatedArticles.jsx
@@ -2,12 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 import { OfficeCard } from 'design-comuni-plone-theme/components/ItaliaTheme/View';
-/**
- * RelateedArticles view component class.
- * @function RelatedArticles
- * @params {object} content: Content object.
- * @returns {string} Markup of the component.
- */
+
 const RelatedArticles = ({
   id = 'related-articles',
   items,
@@ -36,8 +31,8 @@ const RelatedArticles = ({
           <OfficeCard
             key={item['@id']}
             office={item}
-            load_data={false}
             show_contacts={false}
+            showimage={showimage}
           />
         ))}
       </div>
diff --git a/src/components/ItaliaTheme/View/Commons/RelatedItems.jsx b/src/components/ItaliaTheme/View/Commons/RelatedItems.jsx
index 888f9405c..6fe31c73e 100644
--- a/src/components/ItaliaTheme/View/Commons/RelatedItems.jsx
+++ b/src/components/ItaliaTheme/View/Commons/RelatedItems.jsx
@@ -127,33 +127,28 @@ const RelatedItems = ({
             )}
 
             {/*----------------vista per singoli elementi----------------*/}
-            {!view_sections && (
+            {!view_sections && related?.length > 0 && (
               <>
-                {related?.length > 0 && (
-                  <>
-                    <Row>
-                      <Col className="text-center">
-                        <h3>{intl.formatMessage(messages.related_items)}</h3>
-                      </Col>
-                    </Row>
-                    <Row className="mt-lg-4">
-                      {related.map((item, i) => (
-                        <Col md={4} key={item['@id'] + i} className="mb-3">
-                          <div className="card-wrapper">
-                            <GenericCard
-                              key={i}
-                              index={item['@id']}
-                              item={item}
-                              showimage={true}
-                              image_field="image"
-                              showInfos={true}
-                            />
-                          </div>
-                        </Col>
-                      ))}
-                    </Row>
-                  </>
-                )}
+                <Row>
+                  <Col className="text-center">
+                    <h3>{intl.formatMessage(messages.related_items)}</h3>
+                  </Col>
+                </Row>
+                <Row className="mt-lg-4">
+                  {related.map((item, i) => (
+                    <Col md={4} key={item['@id'] + i} className="mb-3">
+                      <div className="card-wrapper">
+                        <GenericCard
+                          key={i}
+                          index={item['@id']}
+                          item={item}
+                          showimage={true}
+                          showInfos={true}
+                        />
+                      </div>
+                    </Col>
+                  ))}
+                </Row>
               </>
             )}
             {children}
diff --git a/src/components/ItaliaTheme/View/Commons/Sponsors.jsx b/src/components/ItaliaTheme/View/Commons/Sponsors.jsx
index bd91a5b5f..279b602ff 100644
--- a/src/components/ItaliaTheme/View/Commons/Sponsors.jsx
+++ b/src/components/ItaliaTheme/View/Commons/Sponsors.jsx
@@ -4,8 +4,8 @@ import React, { useEffect } from 'react';
 import { searchContent, resetSearchContent } from '@plone/volto/actions';
 import { flattenToAppURL } from '@plone/volto/helpers';
 import PropTypes from 'prop-types';
-import Image from '@plone/volto/components/theme/Image/Image';
 import { UniversalLink } from '@plone/volto/components';
+import config from '@plone/volto/registry';
 
 const messages = defineMessages({
   sponsors: {
@@ -22,44 +22,27 @@ const messages = defineMessages({
  * @returns {string} Markup of the component.
  */
 const Sponsor = ({ item }) => {
+  const Image = config.getComponent({ name: 'Image' }).component;
+  const image =
+    item?.image &&
+    Image({
+      item: item,
+      sizes: '600px',
+      loading: 'lazy',
+      className: 'img-fluid',
+      alt: item.image.filename ?? item.title,
+    });
   return item ? (
-    <>
-      {!!item.image ? (
-        <div className="sponsor-item">
-          <a
-            href={item.remoteUrl}
-            alt=""
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            <Image
-              itemUrl={item['@id']}
-              image={item.image_scales?.[item.image_field]?.[0] || item['@id']}
-              alt={
-                item.image_scales?.[item.image_field]?.[0]?.filename ??
-                item.title
-              }
-              className="img-fluid"
-            />
-          </a>
-        </div>
-      ) : (
-        <div className="sponsor-item">
-          <UniversalLink
-            href={item.remoteUrl}
-            alt=""
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            {item.title}
-          </UniversalLink>
-        </div>
-      )}
-    </>
+    <div className="sponsor-item">
+      <UniversalLink href={item.remoteUrl}>
+        {image ? image : item.title}
+      </UniversalLink>
+    </div>
   ) : null;
 };
+
 /**
- * Sponsors view component class.
+ * Sponsors view component class (used in EventSponsors)
  * @function Sponsors
  * @params {object} content Content object.
  * @params {string} folder name where to find images.
diff --git a/src/components/ItaliaTheme/View/Commons/VenuesSmall.jsx b/src/components/ItaliaTheme/View/Commons/VenuesSmall.jsx
index 9b0f16d49..79bf7b33d 100644
--- a/src/components/ItaliaTheme/View/Commons/VenuesSmall.jsx
+++ b/src/components/ItaliaTheme/View/Commons/VenuesSmall.jsx
@@ -1,12 +1,9 @@
-import React, { useEffect } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import { Link } from 'react-router-dom';
-import { useDispatch, useSelector } from 'react-redux';
 import PropTypes from 'prop-types';
-import { getContent, resetContent } from '@plone/volto/actions';
 import { flattenToAppURL } from '@plone/volto/helpers';
 import { Icon } from 'design-comuni-plone-theme/components/ItaliaTheme';
-import Image from '@plone/volto/components/theme/Image/Image';
+import config from '@plone/volto/registry';
 
 const messages = defineMessages({
   VenuesSmall: {
@@ -20,80 +17,56 @@ const messages = defineMessages({
 });
 
 /**
- * Location view component class.
+ * Location view component class (internal).
  * @function Location
  * @params {object} location: object.
+ * @params {boolean} show_icon:
  * @returns {string} Markup of the component.
  */
 const Location = ({ location, show_icon }) => {
   const intl = useIntl();
-  const url = flattenToAppURL(location['@id']);
-  const key = `luogo${url}`;
-
-  const locationContent = useSelector(
-    (state) => state.content.subrequests?.[key],
-  );
-  const loaded = locationContent?.loading || locationContent?.loaded;
-  const dispatch = useDispatch();
-
-  useEffect(() => {
-    if (!loaded) {
-      dispatch(getContent(url, null, key));
-    }
-    return () => dispatch(resetContent(key));
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [url]);
-
-  let location_fo = locationContent?.data;
-
-  return location_fo ? (
-    <div className="card card-teaser shadow border-left-card mt-3 rounded">
-      {show_icon && <Icon icon={'it-pin'} />}
-      <div className="card-body">
-        <div className="card-title h5">{location_fo.title}</div>
-        <div className="card-text">
-          {(location_fo.street || location_fo.zip_code) && (
-            <p>
-              {location_fo.street && location_fo.street}
-              {location_fo.street && location_fo.zip_code ? ' - ' : ' '}
-              {location_fo.zip_code}
+  const Image = config.getComponent({ name: 'Image' }).component;
+  const image = Image({ item: location, loading: 'lazy', sizes: '80px' });
+  return (
+    location && (
+      <div className="card card-teaser shadow border-left-card mt-3 rounded">
+        {show_icon && <Icon icon={'it-pin'} />}
+        <div className="card-body">
+          <div className="card-title h5">{location.title}</div>
+          <div className="card-text">
+            {(location.street || location.zip_code) && (
+              <p>
+                {location.street && location.street}
+                {location.street && location.zip_code ? ' - ' : ' '}
+                {location.zip_code}
+              </p>
+            )}
+            <p className="mt-3">
+              <Link
+                to={flattenToAppURL(location['@id'])}
+                title={location.title}
+              >
+                {intl.formatMessage(messages.details)}
+              </Link>
             </p>
-          )}
-          <p className="mt-3">
-            <Link
-              to={flattenToAppURL(location_fo['@id'])}
-              title={location_fo.title}
-            >
-              {intl.formatMessage(messages.details)}
-            </Link>
-          </p>
+          </div>
         </div>
+        {image && <div className="avatar size-xl">{image}</div>}
       </div>
-      {/* TODO: questo campo non esiste, esiste image.
-        Non ho idea se qualcuno lo sappia, ma se van mostrate le
-        immagini nelle card dei luoghi bisogna sistemare
-      */}
-      {location_fo.immagine && (
-        <div className="avatar size-xl">
-          <Image image={location_fo.immagine} />
-        </div>
-      )}
-    </div>
-  ) : (
-    ''
+    )
   );
 };
 
 /**
- * VenuesSmall view component class.
+ * VenuesSmall view component class. Used in NewsItemLuoghiCorrelati, subcomponent of NewsItemView.
  * @function VenuesSmall
- * @params {object} content: Content object.
+ * @params ...
  * @returns {string} Markup of the component.
  */
 const VenuesSmall = ({ venues, show_icon }) => {
   return venues ? (
     <div className="card-wrapper card-teaser-wrapper">
-      {venues.map((item, i) => (
+      {venues.map((item) => (
         <Location key={item['@id']} location={item} show_icon={show_icon} />
       ))}
     </div>
diff --git a/src/components/ItaliaTheme/View/Commons/WideImage.jsx b/src/components/ItaliaTheme/View/Commons/WideImage.jsx
index dff3b4d19..f6718833d 100644
--- a/src/components/ItaliaTheme/View/Commons/WideImage.jsx
+++ b/src/components/ItaliaTheme/View/Commons/WideImage.jsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
-import Image from '@plone/volto/components/theme/Image/Image';
+import config from '@plone/volto/registry';
 
 /**
  * WideImage view component class.
@@ -9,20 +9,28 @@ import Image from '@plone/volto/components/theme/Image/Image';
  * @params {object} content: Content object.
  * @returns {string} Markup of the component.
  */
-const WideImage = ({ itemUrl, image, title, caption, fullWidth = true }) => {
+const WideImage = ({
+  image,
+  title,
+  caption,
+  fieldName,
+  fullWidth = true,
+  sizes,
+}) => {
+  const Image = config.getComponent({ name: 'Image' }).component;
   return (
     <div className={cx('row wide-image', { 'row-full-width my-3': fullWidth })}>
       <figure className="figure">
         {image && (
           <Image
-            itemUrl={itemUrl}
-            image={image}
+            item={image}
+            fieldName={fieldName}
             className={cx('', { 'full-width': fullWidth })}
             alt=""
             title={caption || title}
             critical
             loading="eager"
-            key={image?.download}
+            sizes={sizes}
           />
         )}
         {caption && (
diff --git a/src/components/ItaliaTheme/View/DocumentoView/DocumentoAccedereServizio.jsx b/src/components/ItaliaTheme/View/DocumentoView/DocumentoAccedereServizio.jsx
index 8dd2d4188..8e374fddc 100644
--- a/src/components/ItaliaTheme/View/DocumentoView/DocumentoAccedereServizio.jsx
+++ b/src/components/ItaliaTheme/View/DocumentoView/DocumentoAccedereServizio.jsx
@@ -24,12 +24,7 @@ const DocumentoAccedereServizio = ({ content }) => {
     >
       <div className="card-wrapper card-teaser-wrapper card-teaser-wrapper-equal">
         {content.servizi_collegati?.map((servizio, i) => (
-          <GenericCard
-            key={servizio['@id']}
-            item={servizio}
-            showimage={false}
-            image_field={'immagine'}
-          >
+          <GenericCard key={servizio['@id']} item={servizio} showimage={false}>
             <RichText
               serif={false}
               data={servizio.canale_digitale}
diff --git a/src/components/ItaliaTheme/View/IncaricoView/IncaricoView.jsx b/src/components/ItaliaTheme/View/IncaricoView/IncaricoView.jsx
index 88999d6db..2dc632d07 100644
--- a/src/components/ItaliaTheme/View/IncaricoView/IncaricoView.jsx
+++ b/src/components/ItaliaTheme/View/IncaricoView/IncaricoView.jsx
@@ -127,12 +127,8 @@ const IncaricoView = (props) => {
             tag_id="ufficio"
             title={intl.formatMessage(messages.ufficio)}
           >
-            {content.unita_organizzativa?.map((item, i) => (
-              <OfficeCard
-                key={flattenToAppURL(item['@id'])}
-                office={item}
-                load_data={false}
-              />
+            {content.unita_organizzativa?.map((item) => (
+              <OfficeCard key={flattenToAppURL(item['@id'])} office={item} />
             ))}
           </RichTextSection>
         )}
@@ -141,12 +137,8 @@ const IncaricoView = (props) => {
             tag_id="responsabile"
             title={intl.formatMessage(messages.responsabile)}
           >
-            {content.responsabile_struttura?.map((item, i) => (
-              <OfficeCard
-                key={flattenToAppURL(item['@id'])}
-                office={item}
-                load_data={false}
-              />
+            {content.responsabile_struttura?.map((item) => (
+              <OfficeCard key={flattenToAppURL(item['@id'])} office={item} />
             ))}
           </RichTextSection>
         )}
diff --git a/src/components/ItaliaTheme/View/NewsItemView/NewsItemACuraDi.jsx b/src/components/ItaliaTheme/View/NewsItemView/NewsItemACuraDi.jsx
index 871286e93..afdc83ea9 100644
--- a/src/components/ItaliaTheme/View/NewsItemView/NewsItemACuraDi.jsx
+++ b/src/components/ItaliaTheme/View/NewsItemView/NewsItemACuraDi.jsx
@@ -1,3 +1,6 @@
+/*
+ * NewsItemACuraDi component class, used in `NewsItemView`.
+ */
 import React from 'react';
 import PropTypes from 'prop-types';
 
diff --git a/src/components/ItaliaTheme/View/PageView/PageView.jsx b/src/components/ItaliaTheme/View/PageView/PageView.jsx
index 4dc15b437..aafc76be5 100644
--- a/src/components/ItaliaTheme/View/PageView/PageView.jsx
+++ b/src/components/ItaliaTheme/View/PageView/PageView.jsx
@@ -22,18 +22,8 @@ import {
 } from 'design-comuni-plone-theme/components/ItaliaTheme/View';
 import { defineMessages, useIntl } from 'react-intl';
 import { getLayoutFieldname } from '@plone/volto/helpers';
-// eslint-disable-next-line import/no-unresolved
-import Image from '@plone/volto/components/theme/Image/Image';
-
 import config from '@plone/volto/registry';
 
-/**
- * PageView view component class.
- * @function PageView
- * @params {object} content Content object.
- * @returns {string} Markup of the component.
- */
-
 const messages = defineMessages({
   unknownBlock: {
     id: 'Unknown Block',
@@ -49,10 +39,16 @@ const messages = defineMessages({
   },
 });
 
+/**
+ * PageView view component class.
+ * @function PageView
+ * @params {object} content Content object.
+ * @returns {string} Markup of the component.
+ */
 const PageView = ({ content, token, location, history }) => {
   const intl = useIntl();
+  const Image = config.getComponent({ name: 'Image' }).component;
   const layout = content[getLayoutFieldname(content)];
-
   if (layout === 'document_view') {
     const rightHeaderHasContent =
       content.image?.scales ||
@@ -92,13 +88,13 @@ const PageView = ({ content, token, location, history }) => {
                       <Actions url={content['@id']} title={content.title} />
                     </div>
                   )}
-                  {content.image?.scales && (
+                  {content.image && (
                     <div className="header-image px-4 mb-3">
                       <Image
-                        image={content.image}
+                        item={content}
                         alt=""
-                        maxSize={300}
-                        key={content.image?.download}
+                        sizes="250px"
+                        responsive={true}
                       />
                     </div>
                   )}
diff --git a/src/components/ItaliaTheme/View/PaginaArgomentoView/PaginaArgomentoView.jsx b/src/components/ItaliaTheme/View/PaginaArgomentoView/PaginaArgomentoView.jsx
index d0f7ea88b..d834bb72f 100644
--- a/src/components/ItaliaTheme/View/PaginaArgomentoView/PaginaArgomentoView.jsx
+++ b/src/components/ItaliaTheme/View/PaginaArgomentoView/PaginaArgomentoView.jsx
@@ -11,7 +11,6 @@ import cx from 'classnames';
 
 import { UniversalLink } from '@plone/volto/components';
 import { Card, CardBody, CardText } from 'design-react-kit';
-import Image from '@plone/volto/components/theme/Image/Image';
 import {
   BodyClass,
   flattenToAppURL,
@@ -33,6 +32,7 @@ import {
   RelatedItemInEvidence,
   richTextHasContent,
 } from 'design-comuni-plone-theme/components/ItaliaTheme/View';
+import config from '@plone/volto/registry';
 
 /**
  * PaginaArgomentoView view component class.
@@ -42,6 +42,7 @@ import {
  */
 
 const PaginaArgomentoView = ({ content }) => {
+  const Image = config.getComponent({ name: 'Image' }).component;
   const location = useLocation();
   const dispatch = useDispatch();
 
@@ -134,12 +135,11 @@ const PaginaArgomentoView = ({ content }) => {
                               (uo_object.preview_image || uo_object.image) && (
                                 <div className="image-container me-3">
                                   <Image
-                                    image={
-                                      uo_object.preview_image || uo_object.image
-                                    }
+                                    item={uo_object}
                                     alt=""
                                     title={alt}
                                     responsive={false}
+                                    sizes="100px"
                                   />
                                 </div>
                               )}
@@ -160,10 +160,12 @@ const PaginaArgomentoView = ({ content }) => {
               >
                 <div>
                   <Image
-                    image={content.image}
+                    item={content}
                     alt={content.caption ?? content.title}
                     title={content.caption ?? content.title}
                     key={content.image.download}
+                    responsive={true}
+                    sizes="100vw"
                   />
                 </div>
               </Portal>
diff --git a/src/components/ItaliaTheme/View/ServizioView/ServizioAccedi.jsx b/src/components/ItaliaTheme/View/ServizioView/ServizioAccedi.jsx
index 8ff5d8de6..a9b468d6b 100644
--- a/src/components/ItaliaTheme/View/ServizioView/ServizioAccedi.jsx
+++ b/src/components/ItaliaTheme/View/ServizioView/ServizioAccedi.jsx
@@ -44,7 +44,6 @@ const ServizioAccedi = ({ content }) => {
               <OfficeCard
                 key={canale['@id']}
                 office={canale}
-                load_data={false}
                 data-element="service-generic-access"
               />
             </div>
@@ -62,11 +61,7 @@ const ServizioAccedi = ({ content }) => {
               key={dove['@id']}
               className="card-wrapper card-teaser-wrapper card-teaser-wrapper-equal"
             >
-              <OfficeCard
-                office={dove}
-                load_data={false}
-                data-element="service-generic-access"
-              />
+              <OfficeCard office={dove} data-element="service-generic-access" />
             </div>
           ))}
           <RichText
diff --git a/src/components/ItaliaTheme/View/ServizioView/ServizioContatti.jsx b/src/components/ItaliaTheme/View/ServizioView/ServizioContatti.jsx
index c7169f7f5..318b73364 100644
--- a/src/components/ItaliaTheme/View/ServizioView/ServizioContatti.jsx
+++ b/src/components/ItaliaTheme/View/ServizioView/ServizioContatti.jsx
@@ -37,7 +37,6 @@ const ServizioContatti = ({ content }) => {
               <OfficeCard
                 key={item['@id']}
                 office={item}
-                load_data={false}
                 data-element="service-area"
               />
             ))}
@@ -49,7 +48,6 @@ const ServizioContatti = ({ content }) => {
               <OfficeCard
                 key={item['@id']}
                 office={item}
-                load_data={false}
                 data-element="service-area"
               />
             ))}
diff --git a/src/components/ItaliaTheme/View/UOView/UOStructure.jsx b/src/components/ItaliaTheme/View/UOView/UOStructure.jsx
index 32574f213..bffa87c4c 100644
--- a/src/components/ItaliaTheme/View/UOView/UOStructure.jsx
+++ b/src/components/ItaliaTheme/View/UOView/UOStructure.jsx
@@ -70,7 +70,6 @@ const UOStructure = ({ content }) => {
                 <OfficeCard
                   key={content.uo_parent['@id']}
                   office={content.uo_parent}
-                  load_data={false}
                   show_contacts={false}
                 />
               </div>
@@ -88,7 +87,6 @@ const UOStructure = ({ content }) => {
                     <OfficeCard
                       key={uo['@id']}
                       office={uo}
-                      load_data={false}
                       show_contacts={false}
                     />
                   );
@@ -104,11 +102,7 @@ const UOStructure = ({ content }) => {
               </h3>
               <div className="card-wrapper card-teaser-wrapper card-teaser-wrapper-equal mb-3">
                 {content.legami_con_altre_strutture.map((item, _i) => (
-                  <OfficeCard
-                    key={item['@id']}
-                    office={item}
-                    load_data={false}
-                  />
+                  <OfficeCard key={item['@id']} office={item} />
                 ))}
               </div>
             </div>
diff --git a/src/components/ItaliaTheme/View/VenueView/VenueContacts.jsx b/src/components/ItaliaTheme/View/VenueView/VenueContacts.jsx
index 270943399..7f6dd0433 100644
--- a/src/components/ItaliaTheme/View/VenueView/VenueContacts.jsx
+++ b/src/components/ItaliaTheme/View/VenueView/VenueContacts.jsx
@@ -160,7 +160,7 @@ const VenueContacts = ({ content }) => {
             //STRUTTURE RESPONSABILI CORRELATE
             <div className="card-wrapper card-teaser-wrapper card-teaser-wrapper-equal">
               {content?.struttura_responsabile_correlati?.map((item, i) => (
-                <OfficeCard key={item['@id']} office={item} load_data={false} />
+                <OfficeCard key={item['@id']} office={item} />
               ))}
             </div>
           ) : (
diff --git a/src/components/ItaliaTheme/View/VenueView/VenueDescription.jsx b/src/components/ItaliaTheme/View/VenueView/VenueDescription.jsx
index 2b702ffeb..aa2380bb6 100644
--- a/src/components/ItaliaTheme/View/VenueView/VenueDescription.jsx
+++ b/src/components/ItaliaTheme/View/VenueView/VenueDescription.jsx
@@ -18,7 +18,6 @@ const messages = defineMessages({
 
 const VenueDescription = ({ content }) => {
   const intl = useIntl();
-
   return (
     <>
       {richTextHasContent(content?.descrizione_completa) && (
diff --git a/src/components/ItaliaTheme/View/VenueView/VenueView.jsx b/src/components/ItaliaTheme/View/VenueView/VenueView.jsx
index b700cdef1..8350c2670 100644
--- a/src/components/ItaliaTheme/View/VenueView/VenueView.jsx
+++ b/src/components/ItaliaTheme/View/VenueView/VenueView.jsx
@@ -55,7 +55,7 @@ export const VenueViewSectionsOrder = [
  * @returns {string} Markup of the component.
  */
 const VenueView = ({ content }) => {
-  let documentBody = createRef();
+  const documentBody = createRef();
   const { sideMenuElements, SideMenu } = useSideMenu(content, documentBody);
 
   useEffect(() => {
diff --git a/src/theme/ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss b/src/theme/ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss
index 2777c15e0..ae793acca 100644
--- a/src/theme/ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss
+++ b/src/theme/ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss
@@ -21,6 +21,7 @@
     }
 
     .img-responsive-wrapper {
+      width: inherit;
       .img-responsive {
         .img-wrapper {
           display: flex;
diff --git a/src/theme/ItaliaTheme/Blocks/_photogallerytemplate.scss b/src/theme/ItaliaTheme/Blocks/_photogallerytemplate.scss
index 1d9b793e4..02ca07e1f 100644
--- a/src/theme/ItaliaTheme/Blocks/_photogallerytemplate.scss
+++ b/src/theme/ItaliaTheme/Blocks/_photogallerytemplate.scss
@@ -23,6 +23,7 @@
     margin-right: auto;
     margin-left: auto;
 
+    &.volto-image.responsive,
     picture.volto-image.responsive {
       height: 300px;
       max-height: 300px;
diff --git a/src/theme/ItaliaTheme/Components/_galleryPreview.scss b/src/theme/ItaliaTheme/Components/_galleryPreview.scss
index d3a1d6954..5430036a2 100644
--- a/src/theme/ItaliaTheme/Components/_galleryPreview.scss
+++ b/src/theme/ItaliaTheme/Components/_galleryPreview.scss
@@ -40,6 +40,8 @@
         max-width: 100%;
         height: auto;
         max-height: 72vh;
+        margin-left: auto;
+        margin-right: auto;
       }
 
       button.btn {
diff --git a/yarn.lock b/yarn.lock
index 07ccf443e..500c62fc8 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6492,7 +6492,7 @@ __metadata:
     volto-venue: 4.0.2
     webpack-image-resize-loader: ^5.0.0
   peerDependencies:
-    "@plone/volto": 17.0.0-alpha.19
+    "@plone/volto": 17.5.0
   languageName: unknown
   linkType: soft
 

From 11d783cef89a95df12d7b948d1695ca5549c1357 Mon Sep 17 00:00:00 2001
From: Giulia Ghisini <51911425+giuliaghisini@users.noreply.github.com>
Date: Wed, 22 Nov 2023 17:05:47 +0100
Subject: [PATCH 17/26] feat!: upgrade to design-react-kit 5.0.0-1 and
 bootstrap-italia 2.6.1 (#407)

* fix: change image component in ctablock

* ci: upgrade volto

* fix: change image component in  hlcontent

* fix: change image component listingimage

* fix: change image component subevents

* fix: change image component gallery

* fix: change image component GenericCard

* fix: change image component

* fix: change image component (sponsor + venuesmall)

* fix: change image component

* fix: minutes with 00 format

* docs: rimosso commento obsoleto

* fix: review giulia

* fix: review giulia

* fix: scroll position on h2 .visually-hidden

* feat: upgrade to volto 17.5.0

* docs: fix order

Co-authored-by: Piero Nicolli <pnicolli@users.noreply.github.com>

* fix: review piero

* fix: sponsor evento without image

* fix: gallery preview

* feat: upgrade to design-react-kit 5.0.0-1 and bootstrap-italia 2.6.1

* fix: fix for new design-react-kit

* fix: card image height changed like bootstrap-italia templates

* fix: revert  card image height changed like bootstrap-italia templates

* fix: stepper style ul

* fix. pr fixes

* chore: updated locales

* fix: screen reader for SearchModal

* fix: screen reader in SearchModal

* chore: update dependencies

* fix: bootstrap imports

* fix: locales

* fix: duplicate css

---------

Co-authored-by: Mauro Amico <mauro.amico@gmail.com>
Co-authored-by: Piero Nicolli <pnicolli@users.noreply.github.com>
Co-authored-by: Piero Nicolli <piero.nicolli@redturtle.it>
---
 locales/de/LC_MESSAGES/volto.po               |  16 +
 locales/en/LC_MESSAGES/volto.po               |  16 +
 locales/es/LC_MESSAGES/volto.po               |  16 +
 locales/fr/LC_MESSAGES/volto.po               |  16 +
 locales/it/LC_MESSAGES/volto.po               |  16 +
 locales/volto.pot                             |  18 +-
 package.json                                  |   5 +-
 .../Blocks/Listing/Commons/CardCalendar.jsx   |   4 +-
 .../ItaliaTheme/Breadcrumbs/Breadcrumbs.jsx   |   9 +-
 .../Header/HeaderSearch/SearchModal.jsx       |  22 ++
 .../ItaliaTheme/Pagination/PaginationItem.jsx |  14 +-
 .../ItaliaTheme/ScrollToTop/ScrollToTop.jsx   |   3 +-
 .../ItaliaTheme/View/Commons/Dates.jsx        |   2 +-
 .../View/Commons/DownloadFileFormat.jsx       |   2 +-
 .../ItaliaTheme/View/Commons/GenericCard.jsx  |   5 +-
 .../ItaliaTheme/View/Commons/HelpBox.jsx      |   7 +-
 .../ItaliaTheme/View/Commons/SideMenu.jsx     |   8 +-
 .../View/Commons/SideMenuByTitles.jsx         |   8 +-
 .../View/FAQ/FaqFolder/FaqFolderTree.jsx      |   1 +
 .../PuntoDiContattoView.jsx                   |   2 +-
 src/components/ReleaseLog/ReleaseLog.jsx      |  15 +-
 .../Blocks/_cardWithImageAndInEvidence.scss   |   1 +
 src/theme/ItaliaTheme/Blocks/_listing.scss    |   5 -
 .../Components/_galleryPreview.scss           |   5 +-
 .../ItaliaTheme/Views/_puntoDiContatto.scss   |   4 +-
 src/theme/ItaliaTheme/_main.scss              |   6 -
 .../_bootstrap-italia-site.scss               |   3 +-
 .../bootstrap-italia/_callout.scss            |   5 +
 .../bootstrap-italia/_form.scss               |   8 +-
 .../bootstrap-italia/_steppers.scss           |   5 +
 .../bootstrap-override/bootstrap/_print.scss  |   3 +-
 src/theme/extras/_search.scss                 |   2 +-
 yarn.lock                                     | 322 ++++++++++++++++--
 33 files changed, 502 insertions(+), 72 deletions(-)
 create mode 100644 src/theme/bootstrap-override/bootstrap-italia/_steppers.scss

diff --git a/locales/de/LC_MESSAGES/volto.po b/locales/de/LC_MESSAGES/volto.po
index 4aa0afcf0..f7ecb18ba 100644
--- a/locales/de/LC_MESSAGES/volto.po
+++ b/locales/de/LC_MESSAGES/volto.po
@@ -448,6 +448,11 @@ msgstr ""
 msgid "Open in a new tab"
 msgstr ""
 
+#: components/ItaliaTheme/Pagination/PaginationItem
+# defaultMessage: Pagina
+msgid "Page"
+msgstr ""
+
 #: components/ItaliaTheme/manage/Widgets/PathFiltersWidget
 #: config/Blocks/ListingOptions/utils
 # defaultMessage: Filtro
@@ -1079,6 +1084,11 @@ msgstr ""
 msgid "block_bg_color"
 msgstr ""
 
+#: components/ItaliaTheme/Breadcrumbs/Breadcrumbs
+# defaultMessage: Percorso di navigazione
+msgid "breadcrumb"
+msgstr ""
+
 #: components/ItaliaTheme/Blocks/Calendar/ListingSidebar
 # defaultMessage: Calendario
 msgid "calendarBlockSidebarTitle"
@@ -1375,6 +1385,12 @@ msgstr ""
 msgid "cured_by_people"
 msgstr ""
 
+#: components/ItaliaTheme/Header/HeaderSearch/SearchModal
+#: components/ReleaseLog/ReleaseLog
+# defaultMessage: attivo
+msgid "currentActive"
+msgstr ""
+
 #: components/ItaliaTheme/View/PersonaView/PersonaDocumenti
 # defaultMessage: Curriculum vitae
 msgid "curriculum_vitae"
diff --git a/locales/en/LC_MESSAGES/volto.po b/locales/en/LC_MESSAGES/volto.po
index 44a67ff00..d2d3516de 100644
--- a/locales/en/LC_MESSAGES/volto.po
+++ b/locales/en/LC_MESSAGES/volto.po
@@ -433,6 +433,11 @@ msgstr "- open in a new tab"
 msgid "Open in a new tab"
 msgstr ""
 
+#: components/ItaliaTheme/Pagination/PaginationItem
+# defaultMessage: Pagina
+msgid "Page"
+msgstr "Page"
+
 #: components/ItaliaTheme/manage/Widgets/PathFiltersWidget
 #: config/Blocks/ListingOptions/utils
 # defaultMessage: Filtro
@@ -1064,6 +1069,11 @@ msgstr "Biography"
 msgid "block_bg_color"
 msgstr ""
 
+#: components/ItaliaTheme/Breadcrumbs/Breadcrumbs
+# defaultMessage: Percorso di navigazione
+msgid "breadcrumb"
+msgstr "Navigation path"
+
 #: components/ItaliaTheme/Blocks/Calendar/ListingSidebar
 # defaultMessage: Calendario
 msgid "calendarBlockSidebarTitle"
@@ -1360,6 +1370,12 @@ msgstr "Cured by"
 msgid "cured_by_people"
 msgstr "People"
 
+#: components/ItaliaTheme/Header/HeaderSearch/SearchModal
+#: components/ReleaseLog/ReleaseLog
+# defaultMessage: attivo
+msgid "currentActive"
+msgstr "active"
+
 #: components/ItaliaTheme/View/PersonaView/PersonaDocumenti
 # defaultMessage: Curriculum vitae
 msgid "curriculum_vitae"
diff --git a/locales/es/LC_MESSAGES/volto.po b/locales/es/LC_MESSAGES/volto.po
index 1d6967378..012db0a93 100644
--- a/locales/es/LC_MESSAGES/volto.po
+++ b/locales/es/LC_MESSAGES/volto.po
@@ -442,6 +442,11 @@ msgstr "- abrir en una nueva pestaña"
 msgid "Open in a new tab"
 msgstr "Abrir en un nueva pestaña"
 
+#: components/ItaliaTheme/Pagination/PaginationItem
+# defaultMessage: Pagina
+msgid "Page"
+msgstr ""
+
 #: components/ItaliaTheme/manage/Widgets/PathFiltersWidget
 #: config/Blocks/ListingOptions/utils
 # defaultMessage: Filtro
@@ -1073,6 +1078,11 @@ msgstr "Biografía"
 msgid "block_bg_color"
 msgstr "Color de fondo"
 
+#: components/ItaliaTheme/Breadcrumbs/Breadcrumbs
+# defaultMessage: Percorso di navigazione
+msgid "breadcrumb"
+msgstr ""
+
 #: components/ItaliaTheme/Blocks/Calendar/ListingSidebar
 # defaultMessage: Calendario
 msgid "calendarBlockSidebarTitle"
@@ -1369,6 +1379,12 @@ msgstr "Editado por"
 msgid "cured_by_people"
 msgstr "Gente"
 
+#: components/ItaliaTheme/Header/HeaderSearch/SearchModal
+#: components/ReleaseLog/ReleaseLog
+# defaultMessage: attivo
+msgid "currentActive"
+msgstr ""
+
 #: components/ItaliaTheme/View/PersonaView/PersonaDocumenti
 # defaultMessage: Curriculum vitae
 msgid "curriculum_vitae"
diff --git a/locales/fr/LC_MESSAGES/volto.po b/locales/fr/LC_MESSAGES/volto.po
index 8ab920836..3fcf30571 100644
--- a/locales/fr/LC_MESSAGES/volto.po
+++ b/locales/fr/LC_MESSAGES/volto.po
@@ -450,6 +450,11 @@ msgstr ""
 msgid "Open in a new tab"
 msgstr ""
 
+#: components/ItaliaTheme/Pagination/PaginationItem
+# defaultMessage: Pagina
+msgid "Page"
+msgstr ""
+
 #: components/ItaliaTheme/manage/Widgets/PathFiltersWidget
 #: config/Blocks/ListingOptions/utils
 # defaultMessage: Filtro
@@ -1081,6 +1086,11 @@ msgstr "Biographie"
 msgid "block_bg_color"
 msgstr ""
 
+#: components/ItaliaTheme/Breadcrumbs/Breadcrumbs
+# defaultMessage: Percorso di navigazione
+msgid "breadcrumb"
+msgstr ""
+
 #: components/ItaliaTheme/Blocks/Calendar/ListingSidebar
 # defaultMessage: Calendario
 msgid "calendarBlockSidebarTitle"
@@ -1377,6 +1387,12 @@ msgstr "Édité par"
 msgid "cured_by_people"
 msgstr "Gens"
 
+#: components/ItaliaTheme/Header/HeaderSearch/SearchModal
+#: components/ReleaseLog/ReleaseLog
+# defaultMessage: attivo
+msgid "currentActive"
+msgstr ""
+
 #: components/ItaliaTheme/View/PersonaView/PersonaDocumenti
 # defaultMessage: Curriculum vitae
 msgid "curriculum_vitae"
diff --git a/locales/it/LC_MESSAGES/volto.po b/locales/it/LC_MESSAGES/volto.po
index ded056cea..978e1beff 100644
--- a/locales/it/LC_MESSAGES/volto.po
+++ b/locales/it/LC_MESSAGES/volto.po
@@ -433,6 +433,11 @@ msgstr "- apri in nuova scheda"
 msgid "Open in a new tab"
 msgstr "Apri in un nuovo tab"
 
+#: components/ItaliaTheme/Pagination/PaginationItem
+# defaultMessage: Pagina
+msgid "Page"
+msgstr ""
+
 #: components/ItaliaTheme/manage/Widgets/PathFiltersWidget
 #: config/Blocks/ListingOptions/utils
 # defaultMessage: Filtro
@@ -1064,6 +1069,11 @@ msgstr "Biografia"
 msgid "block_bg_color"
 msgstr "Colore di sfondo"
 
+#: components/ItaliaTheme/Breadcrumbs/Breadcrumbs
+# defaultMessage: Percorso di navigazione
+msgid "breadcrumb"
+msgstr ""
+
 #: components/ItaliaTheme/Blocks/Calendar/ListingSidebar
 # defaultMessage: Calendario
 msgid "calendarBlockSidebarTitle"
@@ -1360,6 +1370,12 @@ msgstr "A cura di"
 msgid "cured_by_people"
 msgstr "Persone"
 
+#: components/ItaliaTheme/Header/HeaderSearch/SearchModal
+#: components/ReleaseLog/ReleaseLog
+# defaultMessage: attivo
+msgid "currentActive"
+msgstr ""
+
 #: components/ItaliaTheme/View/PersonaView/PersonaDocumenti
 # defaultMessage: Curriculum vitae
 msgid "curriculum_vitae"
diff --git a/locales/volto.pot b/locales/volto.pot
index 56d4b88ca..a25785e08 100644
--- a/locales/volto.pot
+++ b/locales/volto.pot
@@ -435,6 +435,11 @@ msgstr ""
 msgid "Open in a new tab"
 msgstr ""
 
+#: components/ItaliaTheme/Pagination/PaginationItem
+# defaultMessage: Pagina
+msgid "Page"
+msgstr ""
+
 #: components/ItaliaTheme/manage/Widgets/PathFiltersWidget
 #: config/Blocks/ListingOptions/utils
 # defaultMessage: Filtro
@@ -1066,6 +1071,11 @@ msgstr ""
 msgid "block_bg_color"
 msgstr ""
 
+#: components/ItaliaTheme/Breadcrumbs/Breadcrumbs
+# defaultMessage: Percorso di navigazione
+msgid "breadcrumb"
+msgstr ""
+
 #: components/ItaliaTheme/Blocks/Calendar/ListingSidebar
 # defaultMessage: Calendario
 msgid "calendarBlockSidebarTitle"
@@ -1362,6 +1372,12 @@ msgstr ""
 msgid "cured_by_people"
 msgstr ""
 
+#: components/ItaliaTheme/Header/HeaderSearch/SearchModal
+#: components/ReleaseLog/ReleaseLog
+# defaultMessage: attivo
+msgid "currentActive"
+msgstr ""
+
 #: components/ItaliaTheme/View/PersonaView/PersonaDocumenti
 # defaultMessage: Curriculum vitae
 msgid "curriculum_vitae"
@@ -3151,7 +3167,7 @@ msgid "search_startDate"
 msgstr ""
 
 #: helpers/Translations/searchBlockExtendedTranslations
-# defaultMessage: Ricerca per: <em>{searchedtext}</em>. 
+# defaultMessage: Ricerca per: <em>{searchedtext}</em>.
 msgid "searchedFor"
 msgstr ""
 
diff --git a/package.json b/package.json
index a1e0a0438..00b1d884f 100644
--- a/package.json
+++ b/package.json
@@ -120,13 +120,14 @@
   },
   "dependencies": {
     "@babel/plugin-proposal-export-default-from": "7.18.9",
+    "@babel/plugin-proposal-nullish-coalescing-operator": "7.18.6",
     "@babel/plugin-proposal-throw-expressions": "7.18.6",
     "@eeacms/volto-taxonomy": "^1.0.0",
     "@loadable/babel-plugin": "5.13.2",
     "@plone-collective/volto-sentry": "0.3.0",
-    "bootstrap-italia": "2.2.0",
+    "bootstrap-italia": "2.6.1",
     "classnames": "^2.3.2",
-    "design-react-kit": "italia/design-react-kit#fc9b40257ba3cb613141faf217f1f5b806489740",
+    "design-react-kit": "5.0.0-1",
     "htmldiff-js": "1.0.5",
     "marked": "9.0.0",
     "react-dropzone": "11.0.1",
diff --git a/src/components/ItaliaTheme/Blocks/Listing/Commons/CardCalendar.jsx b/src/components/ItaliaTheme/Blocks/Listing/Commons/CardCalendar.jsx
index e9b6fbc27..c99eb2fc4 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/Commons/CardCalendar.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/Commons/CardCalendar.jsx
@@ -46,7 +46,7 @@ export const CardCalendar = ({ start, end, recurrence, rrule }) => {
         <div className="custom-calendar-card">
           <div className="card-calendar extended d-flex flex-column justify-content-center px-2">
             <span className="card-date d-flex justify-content-between align-items-baseline">
-              <div className="date-label mr-1">
+              <div className="date-label me-1">
                 {intl.formatMessage(messages.from)}
               </div>
               <span className="date">
@@ -54,7 +54,7 @@ export const CardCalendar = ({ start, end, recurrence, rrule }) => {
               </span>
             </span>
             <span className="card-date d-flex justify-content-between align-items-baseline">
-              <div className="date-label mr-1">
+              <div className="date-label me-1">
                 {intl.formatMessage(messages.to)}
               </div>
               <span className="date">
diff --git a/src/components/ItaliaTheme/Breadcrumbs/Breadcrumbs.jsx b/src/components/ItaliaTheme/Breadcrumbs/Breadcrumbs.jsx
index d8b32f067..db5470b4d 100644
--- a/src/components/ItaliaTheme/Breadcrumbs/Breadcrumbs.jsx
+++ b/src/components/ItaliaTheme/Breadcrumbs/Breadcrumbs.jsx
@@ -24,6 +24,10 @@ const messages = defineMessages({
     id: 'Home',
     defaultMessage: 'Home',
   },
+  breadcrumb: {
+    id: 'breadcrumb',
+    defaultMessage: 'Percorso di navigazione',
+  },
 });
 
 const Breadcrumbs = ({ pathname }) => {
@@ -94,7 +98,10 @@ const Breadcrumbs = ({ pathname }) => {
       <GoogleBreadcrumbs items={items} />
       <Row>
         <Col>
-          <nav className="breadcrumb-container" aria-label="breadcrumb">
+          <nav
+            className="breadcrumb-container"
+            aria-label={intl.formatMessage(messages.breadcrumb)}
+          >
             <ol className="breadcrumb" data-element="breadcrumb">
               <BreadcrumbItem tag="li">
                 <UniversalLink href="/">
diff --git a/src/components/ItaliaTheme/Header/HeaderSearch/SearchModal.jsx b/src/components/ItaliaTheme/Header/HeaderSearch/SearchModal.jsx
index a95860297..c05082673 100644
--- a/src/components/ItaliaTheme/Header/HeaderSearch/SearchModal.jsx
+++ b/src/components/ItaliaTheme/Header/HeaderSearch/SearchModal.jsx
@@ -161,6 +161,10 @@ const messages = defineMessages({
     id: 'optionDatePlaceholder',
     defaultMessage: 'inserisci la data in formato gg/mm/aaaa',
   },
+  current: {
+    id: 'currentActive',
+    defaultMessage: 'attivo',
+  },
 });
 
 const SearchModal = ({ closeModal, show }) => {
@@ -667,6 +671,12 @@ const SearchModal = ({ closeModal, show }) => {
                       id={'sections'}
                     >
                       <span>{intl.formatMessage(messages.sections)}</span>
+                      {advancedTab === 'sections' && (
+                        <span className="visually-hidden">
+                          {' '}
+                          {intl.formatMessage(messages.current)}
+                        </span>
+                      )}
                     </NavLink>
                   </NavItem>
                 )}
@@ -682,6 +692,12 @@ const SearchModal = ({ closeModal, show }) => {
                     id={'topics'}
                   >
                     <span>{intl.formatMessage(messages.topics)}</span>
+                    {advancedTab === 'topics' && (
+                      <span className="visually-hidden">
+                        {' '}
+                        {intl.formatMessage(messages.current)}
+                      </span>
+                    )}
                   </NavLink>
                 </NavItem>
                 <NavItem
@@ -696,6 +712,12 @@ const SearchModal = ({ closeModal, show }) => {
                     id={'options'}
                   >
                     <span>{intl.formatMessage(messages.options)}</span>
+                    {advancedTab === 'options' && (
+                      <span className="visually-hidden">
+                        {' '}
+                        {intl.formatMessage(messages.current)}
+                      </span>
+                    )}
                   </NavLink>
                 </NavItem>
               </Nav>
diff --git a/src/components/ItaliaTheme/Pagination/PaginationItem.jsx b/src/components/ItaliaTheme/Pagination/PaginationItem.jsx
index b7e2d9de9..de8182097 100644
--- a/src/components/ItaliaTheme/Pagination/PaginationItem.jsx
+++ b/src/components/ItaliaTheme/Pagination/PaginationItem.jsx
@@ -16,6 +16,10 @@ const messages = defineMessages({
     id: 'Next page',
     defaultMessage: 'Pagina successiva',
   },
+  page: {
+    id: 'Page',
+    defaultMessage: 'Pagina',
+  },
 });
 
 /**
@@ -102,8 +106,14 @@ class PaginationItem extends Component {
               </span>
             </>
           )}
-          {['prevItem', 'nextItem', 'ellipsisItem'].indexOf(type) < 0 &&
-            children}
+          {['prevItem', 'nextItem', 'ellipsisItem'].indexOf(type) < 0 && (
+            <>
+              <span className="visually-hidden">
+                {intl.formatMessage(messages.page)}
+              </span>{' '}
+              {children}
+            </>
+          )}
         </PagerLink>
       </PagerItem>
     );
diff --git a/src/components/ItaliaTheme/ScrollToTop/ScrollToTop.jsx b/src/components/ItaliaTheme/ScrollToTop/ScrollToTop.jsx
index e2baf99a7..e1931f379 100644
--- a/src/components/ItaliaTheme/ScrollToTop/ScrollToTop.jsx
+++ b/src/components/ItaliaTheme/ScrollToTop/ScrollToTop.jsx
@@ -46,10 +46,11 @@ const ScrollToTop = () => {
         <div className="public-ui scroll-to-top">
           <Button
             color="tertiary"
-            tag="button"
             size="sm"
             title={intl.formatMessage(messages.scrollToTop)}
             onClick={scrollToTop}
+            aria-hidden="true"
+            tabIndex={-1}
           >
             <Icon icon="it-arrow-up" padding={false} size="sm" />
           </Button>
diff --git a/src/components/ItaliaTheme/View/Commons/Dates.jsx b/src/components/ItaliaTheme/View/Commons/Dates.jsx
index 4d6e19b8f..bbfb3d255 100644
--- a/src/components/ItaliaTheme/View/Commons/Dates.jsx
+++ b/src/components/ItaliaTheme/View/Commons/Dates.jsx
@@ -101,7 +101,7 @@ const Dates = ({ content, show_image, moment: momentlib, rrule }) => {
         {!openEnd && (
           <div className="point-list">
             <div className="point-list-aside point-list-warning">
-              <span className="point-date text-monospace">
+              <span className="point-date font-monospace">
                 {end.format('DD')}
               </span>
               <span className="point-month">{end.format('MMMM')}</span>
diff --git a/src/components/ItaliaTheme/View/Commons/DownloadFileFormat.jsx b/src/components/ItaliaTheme/View/Commons/DownloadFileFormat.jsx
index d1ff84b21..285dbb543 100644
--- a/src/components/ItaliaTheme/View/Commons/DownloadFileFormat.jsx
+++ b/src/components/ItaliaTheme/View/Commons/DownloadFileFormat.jsx
@@ -48,7 +48,7 @@ const DownloadFileFormat = ({
       title={file.filename}
       className={className}
       target={pdfFile ? '_blank' : '_self'}
-      rel="noreferrer"
+      rel={pdfFile ? 'noopener noreferrer' : ''}
     >
       {!icon.svg_format ? (
         <IconFA
diff --git a/src/components/ItaliaTheme/View/Commons/GenericCard.jsx b/src/components/ItaliaTheme/View/Commons/GenericCard.jsx
index 7d9ff5646..07fdd7329 100644
--- a/src/components/ItaliaTheme/View/Commons/GenericCard.jsx
+++ b/src/components/ItaliaTheme/View/Commons/GenericCard.jsx
@@ -1,11 +1,8 @@
-import React, { useEffect } from 'react';
-import { useDispatch, useSelector } from 'react-redux';
+import React from 'react';
 import PropTypes from 'prop-types';
 import cx from 'classnames';
 
 import { UniversalLink } from '@plone/volto/components';
-import { getContent, resetContent } from '@plone/volto/actions';
-import { flattenToAppURL } from '@plone/volto/helpers';
 import { injectLazyLibs } from '@plone/volto/helpers/Loadable/Loadable';
 import { getCalendarDate } from 'design-comuni-plone-theme/helpers';
 import {
diff --git a/src/components/ItaliaTheme/View/Commons/HelpBox.jsx b/src/components/ItaliaTheme/View/Commons/HelpBox.jsx
index 585ae8a73..688fe4b41 100644
--- a/src/components/ItaliaTheme/View/Commons/HelpBox.jsx
+++ b/src/components/ItaliaTheme/View/Commons/HelpBox.jsx
@@ -6,17 +6,16 @@ import { RichText } from 'design-comuni-plone-theme/components/ItaliaTheme/View'
 
 const HelpBox = ({ text }) => {
   return text ? (
-    <Callout color="" highlight={false} tag="div">
+    <Callout color="">
       <CalloutTitle tag="div">
         <Icon
           color=""
           icon="it-info-circle"
           padding={false}
           size=""
-          style={{
-            ariaHidden: true,
-          }}
+          aria-hidden
         />
+        <span className="text"></span>
       </CalloutTitle>
 
       <div>
diff --git a/src/components/ItaliaTheme/View/Commons/SideMenu.jsx b/src/components/ItaliaTheme/View/Commons/SideMenu.jsx
index 39a7b7e6a..148cd3142 100644
--- a/src/components/ItaliaTheme/View/Commons/SideMenu.jsx
+++ b/src/components/ItaliaTheme/View/Commons/SideMenu.jsx
@@ -161,6 +161,7 @@ const SideMenu = ({ data, content_uid }) => {
                   onToggle={() => {
                     setIsNavOpen(!isNavOpen);
                   }}
+                  aria-controls="side-menu-body"
                 >
                   <h3>{intl.formatMessage(messages.index)}</h3>
                 </AccordionHeader>
@@ -172,11 +173,8 @@ const SideMenu = ({ data, content_uid }) => {
                 </div>
                 <AccordionBody
                   active={isNavOpen}
-                  className={
-                    isNavOpen
-                      ? 'accordion-collapse show'
-                      : 'accordion-collapse collapse'
-                  }
+                  id="side-menu-body"
+                  role="region"
                 >
                   <ul className="link-list" data-element="page-index">
                     {headers.map((item, i) => {
diff --git a/src/components/ItaliaTheme/View/Commons/SideMenuByTitles.jsx b/src/components/ItaliaTheme/View/Commons/SideMenuByTitles.jsx
index f3f827029..9f78c9236 100644
--- a/src/components/ItaliaTheme/View/Commons/SideMenuByTitles.jsx
+++ b/src/components/ItaliaTheme/View/Commons/SideMenuByTitles.jsx
@@ -150,6 +150,7 @@ const SideMenuByTitles = ({ data, content_uid, index_title }) => {
                   onToggle={() => {
                     setIsNavOpen(!isNavOpen);
                   }}
+                  aria-controls="side-menu-body"
                 >
                   <h3>{index_title ?? intl.formatMessage(messages.index)}</h3>
                 </AccordionHeader>
@@ -161,11 +162,8 @@ const SideMenuByTitles = ({ data, content_uid, index_title }) => {
                 </div>
                 <AccordionBody
                   active={isNavOpen}
-                  className={
-                    isNavOpen
-                      ? 'accordion-collapse show'
-                      : 'accordion-collapse collapse'
-                  }
+                  id="side-menu-body"
+                  role="region"
                 >
                   <ul className="link-list" data-element="page-index">
                     {headers.map((item, i) => {
diff --git a/src/components/ItaliaTheme/View/FAQ/FaqFolder/FaqFolderTree.jsx b/src/components/ItaliaTheme/View/FAQ/FaqFolder/FaqFolderTree.jsx
index 093eca61a..19d8dbe46 100644
--- a/src/components/ItaliaTheme/View/FAQ/FaqFolder/FaqFolderTree.jsx
+++ b/src/components/ItaliaTheme/View/FAQ/FaqFolder/FaqFolderTree.jsx
@@ -63,6 +63,7 @@ const FaqFolderTree = ({ tree }) => {
                         }}
                         tag="button"
                         aria-controls={`faq-${r.UID}`}
+                        aria-expanded={isOpen}
                         id={`header-${r.UID}`}
                       >
                         {r.title}
diff --git a/src/components/ItaliaTheme/View/PuntoDiContattoView/PuntoDiContattoView.jsx b/src/components/ItaliaTheme/View/PuntoDiContattoView/PuntoDiContattoView.jsx
index d8512166a..3dc485c45 100644
--- a/src/components/ItaliaTheme/View/PuntoDiContattoView/PuntoDiContattoView.jsx
+++ b/src/components/ItaliaTheme/View/PuntoDiContattoView/PuntoDiContattoView.jsx
@@ -115,7 +115,7 @@ const PuntoDiContattoView = (props) => {
                       : intl.formatMessage(messages.label, {
                           value: intl.formatMessage(messages[pdc?.pdc_type]),
                         })}
-                    <span className="ml-1">{renderPDCItemValue(pdc)}</span>
+                    <span className="ms-1">{renderPDCItemValue(pdc)}</span>
                   </h5>
                 </div>
               );
diff --git a/src/components/ReleaseLog/ReleaseLog.jsx b/src/components/ReleaseLog/ReleaseLog.jsx
index 5f8655c2b..629e5cec0 100644
--- a/src/components/ReleaseLog/ReleaseLog.jsx
+++ b/src/components/ReleaseLog/ReleaseLog.jsx
@@ -4,7 +4,7 @@
  */
 
 import React, { useState, useEffect } from 'react';
-
+import { defineMessages, useIntl } from 'react-intl';
 import {
   Container,
   Nav,
@@ -17,8 +17,14 @@ import { Helmet } from '@plone/volto/helpers';
 import { marked } from 'marked';
 
 import './ReleaseLog.css';
-
+const messages = defineMessages({
+  current: {
+    id: 'currentActive',
+    defaultMessage: 'attivo',
+  },
+});
 const ReleaseLog = () => {
+  const intl = useIntl();
   let ReleaseDCPT = null;
   let ReleaseIoCittadino = null;
   let ReleaseIoPrenoto = null;
@@ -111,6 +117,11 @@ const ReleaseLog = () => {
                 onClick={() => viewTab(log.name)}
               >
                 <span>{log.name}</span>
+                {activeTab === log.name && (
+                  <span className="visually-hidden">
+                    {intl.formatMessage(messages.current)}
+                  </span>
+                )}
               </NavLink>
             </NavItem>
           ))}
diff --git a/src/theme/ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss b/src/theme/ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss
index ae793acca..724e25178 100644
--- a/src/theme/ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss
+++ b/src/theme/ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss
@@ -22,6 +22,7 @@
 
     .img-responsive-wrapper {
       width: inherit;
+
       .img-responsive {
         .img-wrapper {
           display: flex;
diff --git a/src/theme/ItaliaTheme/Blocks/_listing.scss b/src/theme/ItaliaTheme/Blocks/_listing.scss
index 76bf74e83..5ff8df4e5 100644
--- a/src/theme/ItaliaTheme/Blocks/_listing.scss
+++ b/src/theme/ItaliaTheme/Blocks/_listing.scss
@@ -1,11 +1,6 @@
 .block.listing {
   .full-width {
     height: unset;
-
-    h2 {
-      @include rem-size(font-size, 32);
-      @include rem-size(line-height, 32);
-    }
   }
 
   .listing-item picture {
diff --git a/src/theme/ItaliaTheme/Components/_galleryPreview.scss b/src/theme/ItaliaTheme/Components/_galleryPreview.scss
index 5430036a2..a9e2c3aaf 100644
--- a/src/theme/ItaliaTheme/Components/_galleryPreview.scss
+++ b/src/theme/ItaliaTheme/Components/_galleryPreview.scss
@@ -12,7 +12,8 @@
       }
 
       .modal-close-button {
-        button.close-button {
+        button.close-button,
+        button.btn-close {
           border: none;
           background-color: transparent;
 
@@ -40,8 +41,8 @@
         max-width: 100%;
         height: auto;
         max-height: 72vh;
-        margin-left: auto;
         margin-right: auto;
+        margin-left: auto;
       }
 
       button.btn {
diff --git a/src/theme/ItaliaTheme/Views/_puntoDiContatto.scss b/src/theme/ItaliaTheme/Views/_puntoDiContatto.scss
index 86a00c2af..f729ac1ad 100644
--- a/src/theme/ItaliaTheme/Views/_puntoDiContatto.scss
+++ b/src/theme/ItaliaTheme/Views/_puntoDiContatto.scss
@@ -1,9 +1,9 @@
 body.contenttype-puntodicontatto {
-  .mr-1 {
+  .me-1 {
     margin-right: 0.5rem;
   }
 
-  .ml-1 {
+  .ms-1 {
     margin-left: 0.5rem;
   }
 }
diff --git a/src/theme/ItaliaTheme/_main.scss b/src/theme/ItaliaTheme/_main.scss
index 501a7b85d..4fd72be71 100644
--- a/src/theme/ItaliaTheme/_main.scss
+++ b/src/theme/ItaliaTheme/_main.scss
@@ -102,12 +102,6 @@ iframe {
   }
 
   .callout {
-    padding: 1.25rem;
-    border: 1px solid $neutral-1-a2;
-    border-radius: 0.25rem;
-    border-left-width: 0.4rem;
-    margin: 1.25rem 0;
-
     p,
     .public-DraftStyleDefault-block {
       &:last-of-type {
diff --git a/src/theme/bootstrap-override/_bootstrap-italia-site.scss b/src/theme/bootstrap-override/_bootstrap-italia-site.scss
index c9906f505..0e57b65cd 100644
--- a/src/theme/bootstrap-override/_bootstrap-italia-site.scss
+++ b/src/theme/bootstrap-override/_bootstrap-italia-site.scss
@@ -16,7 +16,7 @@
 // BS5 Configuration
 @import 'bootstrap/scss/functions';
 @import 'bootstrap/scss/variables';
-//@import 'node_modules/bootstrap/scss/maps';
+@import 'bootstrap/scss/maps';
 @import 'bootstrap/scss/mixins';
 // mixins custom
 @import 'bootstrap-italia/src/scss/custom/mixins/buttons';
@@ -141,6 +141,7 @@
   @import 'bootstrap-italia/src/scss/custom/avatar';
   @import 'bootstrap-italia/src/scss/custom/thumbnav';
   @import 'bootstrap-italia/src/scss/custom/steppers';
+  @import './bootstrap-italia/steppers';
   @import 'bootstrap-italia/src/scss/custom/card';
   @import './bootstrap-italia/card';
   @import 'bootstrap-italia/src/scss/custom/imgresponsive';
diff --git a/src/theme/bootstrap-override/bootstrap-italia/_callout.scss b/src/theme/bootstrap-override/bootstrap-italia/_callout.scss
index a22453047..40d3f87c6 100644
--- a/src/theme/bootstrap-override/bootstrap-italia/_callout.scss
+++ b/src/theme/bootstrap-override/bootstrap-italia/_callout.scss
@@ -1,3 +1,8 @@
 .callout {
+  padding: 0; //override volto's style
+  border: none;
+  border-radius: unset;
+  margin: 0;
+  box-shadow: none;
   max-width: none;
 }
diff --git a/src/theme/bootstrap-override/bootstrap-italia/_form.scss b/src/theme/bootstrap-override/bootstrap-italia/_form.scss
index 2603e91cd..28f3d7a6b 100644
--- a/src/theme/bootstrap-override/bootstrap-italia/_form.scss
+++ b/src/theme/bootstrap-override/bootstrap-italia/_form.scss
@@ -7,13 +7,14 @@
     background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23f73e5a' viewBox='0 0 384 512'%3E%3Cpath d='M231.6 256l130.1-130.1c4.7-4.7 4.7-12.3 0-17l-22.6-22.6c-4.7-4.7-12.3-4.7-17 0L192 216.4 61.9 86.3c-4.7-4.7-12.3-4.7-17 0l-22.6 22.6c-4.7 4.7-4.7 12.3 0 17L152.4 256 22.3 386.1c-4.7 4.7-4.7 12.3 0 17l22.6 22.6c4.7 4.7 12.3 4.7 17 0L192 295.6l130.1 130.1c4.7 4.7 12.3 4.7 17 0l22.6-22.6c4.7-4.7 4.7-12.3 0-17L231.6 256z'/%3E%3C/svg%3E");
 
     small,
-    small.text-muted {
+    small.text-muted,
+    small.form-feedback.just-validate-error-label {
       color: $danger !important;
     }
   }
 
   .was-validated &:valid,
-  &.is-valid {
+  &.just-validate-success-field {
     background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2300cc85' viewBox='0 0 192 512'%3E%3Cpath d='M435.848 83.466L172.804 346.51l-96.652-96.652c-4.686-4.686-12.284-4.686-16.971 0l-28.284 28.284c-4.686 4.686-4.686 12.284 0 16.971l133.421 133.421c4.686 4.686 12.284 4.686 16.971 0l299.813-299.813c4.686-4.686 4.686-12.284 0-16.971l-28.284-28.284c-4.686-4.686-12.284-4.686-16.97 0z'/%3E%3C/svg%3E");
   }
 
@@ -23,7 +24,8 @@
     background-size: 25px 45% !important;
 
     small,
-    small.text-muted {
+    small.text-muted,
+    small.form-feedback.just-validate-error-label {
       color: $warning !important;
     }
   }
diff --git a/src/theme/bootstrap-override/bootstrap-italia/_steppers.scss b/src/theme/bootstrap-override/bootstrap-italia/_steppers.scss
new file mode 100644
index 000000000..a706b4735
--- /dev/null
+++ b/src/theme/bootstrap-override/bootstrap-italia/_steppers.scss
@@ -0,0 +1,5 @@
+@media (min-width: 992px) {
+  .steppers .steppers-header ul li.steppers-index {
+    display: none;
+  }
+}
diff --git a/src/theme/bootstrap-override/bootstrap/_print.scss b/src/theme/bootstrap-override/bootstrap/_print.scss
index 93679290a..4c836c1b3 100644
--- a/src/theme/bootstrap-override/bootstrap/_print.scss
+++ b/src/theme/bootstrap-override/bootstrap/_print.scss
@@ -133,7 +133,8 @@
         }
       }
 
-      .table .thead-dark th {
+      .table .thead-dark th,
+      .table .table-dark th {
         border-color: $table-border-color;
         color: inherit;
       }
diff --git a/src/theme/extras/_search.scss b/src/theme/extras/_search.scss
index 74e887ea4..20601c063 100644
--- a/src/theme/extras/_search.scss
+++ b/src/theme/extras/_search.scss
@@ -20,7 +20,7 @@ body.search-modal-opened {
   .modal-header {
     flex-shrink: 0;
 
-    button.close {
+    button.btn-close {
       display: none;
     }
 
diff --git a/yarn.lock b/yarn.lock
index 500c62fc8..e61a1cdd0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1018,7 +1018,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/plugin-proposal-nullish-coalescing-operator@npm:^7.10.4, @babel/plugin-proposal-nullish-coalescing-operator@npm:^7.16.0, @babel/plugin-proposal-nullish-coalescing-operator@npm:^7.18.6":
+"@babel/plugin-proposal-nullish-coalescing-operator@npm:7.18.6, @babel/plugin-proposal-nullish-coalescing-operator@npm:^7.10.4, @babel/plugin-proposal-nullish-coalescing-operator@npm:^7.16.0, @babel/plugin-proposal-nullish-coalescing-operator@npm:^7.18.6":
   version: 7.18.6
   resolution: "@babel/plugin-proposal-nullish-coalescing-operator@npm:7.18.6"
   dependencies:
@@ -2886,6 +2886,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/runtime@npm:^7.11.2":
+  version: 7.23.2
+  resolution: "@babel/runtime@npm:7.23.2"
+  dependencies:
+    regenerator-runtime: ^0.14.0
+  checksum: 6c4df4839ec75ca10175f636d6362f91df8a3137f86b38f6cd3a4c90668a0fe8e9281d320958f4fbd43b394988958585a17c3aab2a4ea6bf7316b22916a371fb
+  languageName: node
+  linkType: hard
+
 "@babel/runtime@npm:^7.12.0, @babel/runtime@npm:^7.12.5, @babel/runtime@npm:^7.18.3, @babel/runtime@npm:^7.5.5, @babel/runtime@npm:^7.8.4, @babel/runtime@npm:^7.8.7, @babel/runtime@npm:^7.9.2":
   version: 7.19.0
   resolution: "@babel/runtime@npm:7.19.0"
@@ -3923,6 +3932,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@popperjs/core@npm:^2.9.2":
+  version: 2.11.8
+  resolution: "@popperjs/core@npm:2.11.8"
+  checksum: e5c69fdebf52a4012f6a1f14817ca8e9599cb1be73dd1387e1785e2ed5e5f0862ff817f420a87c7fc532add1f88a12e25aeb010ffcbdc98eace3d55ce2139cf0
+  languageName: node
+  linkType: hard
+
 "@release-it/conventional-changelog@npm:5.1.1":
   version: 5.1.1
   resolution: "@release-it/conventional-changelog@npm:5.1.1"
@@ -4144,6 +4160,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/bootstrap@npm:^5.2.6":
+  version: 5.2.9
+  resolution: "@types/bootstrap@npm:5.2.9"
+  dependencies:
+    "@popperjs/core": ^2.9.2
+  checksum: e5cb53bafb573f3baefee82979b9b2412f2ce565e3d1bdbf1c5906f0acee6b5cfdbac10c7ee60b406cbadc46e5c2b0a600550eaabbcfc5f86eb303c1ede2af78
+  languageName: node
+  linkType: hard
+
 "@types/http-cache-semantics@npm:^4.0.1":
   version: 4.0.1
   resolution: "@types/http-cache-semantics@npm:4.0.1"
@@ -4411,6 +4436,64 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@videojs/http-streaming@npm:3.7.0":
+  version: 3.7.0
+  resolution: "@videojs/http-streaming@npm:3.7.0"
+  dependencies:
+    "@babel/runtime": ^7.12.5
+    "@videojs/vhs-utils": 4.0.0
+    aes-decrypter: 4.0.1
+    global: ^4.4.0
+    m3u8-parser: ^7.1.0
+    mpd-parser: ^1.2.2
+    mux.js: 7.0.1
+    video.js: ^7 || ^8
+  peerDependencies:
+    video.js: ^7 || ^8
+  checksum: ea97db79841d08d9dba8db703dc9ccb45a85576662b54386a5b3a9c44248979ecf2e33fe2da25f22364a91105bdeb1df74c0d761e073568ccaaa2c94e6f56d00
+  languageName: node
+  linkType: hard
+
+"@videojs/vhs-utils@npm:4.0.0, @videojs/vhs-utils@npm:^4.0.0":
+  version: 4.0.0
+  resolution: "@videojs/vhs-utils@npm:4.0.0"
+  dependencies:
+    "@babel/runtime": ^7.12.5
+    global: ^4.4.0
+    url-toolkit: ^2.2.1
+  checksum: a824900d0173478c80ee9683f67cc041e204d79ac280ae369adb03357d51d8a51b296bd6aff96b2cce66633a63f05a10d11d53da6ec063ee7c4d6e38dabd826e
+  languageName: node
+  linkType: hard
+
+"@videojs/vhs-utils@npm:^3.0.5":
+  version: 3.0.5
+  resolution: "@videojs/vhs-utils@npm:3.0.5"
+  dependencies:
+    "@babel/runtime": ^7.12.5
+    global: ^4.4.0
+    url-toolkit: ^2.2.1
+  checksum: 637dc9a8848027eab4213d6e85439d216577d0cb0346767c15bbb07a5a730aa30545f0b5d7bfd636f40212e490f34bf103e331f0bc180b4d3c245e77f30b437f
+  languageName: node
+  linkType: hard
+
+"@videojs/xhr@npm:2.6.0":
+  version: 2.6.0
+  resolution: "@videojs/xhr@npm:2.6.0"
+  dependencies:
+    "@babel/runtime": ^7.5.5
+    global: ~4.4.0
+    is-function: ^1.0.1
+  checksum: 217d3d49f8088461959840f93f0b45d713e6d03254d89352e2eb4bfca9501eee03bac25d0ad878e976c9cbec902039210a86906ef57a5f8d86bfdfa1a3999def
+  languageName: node
+  linkType: hard
+
+"@xmldom/xmldom@npm:^0.8.3":
+  version: 0.8.10
+  resolution: "@xmldom/xmldom@npm:0.8.10"
+  checksum: 4c136aec31fb3b49aaa53b6fcbfe524d02a1dc0d8e17ee35bd3bf35e9ce1344560481cd1efd086ad1a4821541482528672306d5e37cdbd187f33d7fadd3e2cf0
+  languageName: node
+  linkType: hard
+
 "JSONStream@npm:^1.0.4":
   version: 1.3.5
   resolution: "JSONStream@npm:1.3.5"
@@ -4480,6 +4563,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"aes-decrypter@npm:4.0.1, aes-decrypter@npm:^4.0.1":
+  version: 4.0.1
+  resolution: "aes-decrypter@npm:4.0.1"
+  dependencies:
+    "@babel/runtime": ^7.12.5
+    "@videojs/vhs-utils": ^3.0.5
+    global: ^4.4.0
+    pkcs7: ^1.0.4
+  checksum: c09f47e928d88af2387690e47e60001be74095c10007fe44ef57663db17ee8e391310c6f0b023bc63257afe442900cc916f55fba7dd27ec1c394d616b062d664
+  languageName: node
+  linkType: hard
+
 "agent-base@npm:6, agent-base@npm:^6.0.2":
   version: 6.0.2
   resolution: "agent-base@npm:6.0.2"
@@ -5179,29 +5274,31 @@ __metadata:
   languageName: node
   linkType: hard
 
-"bootstrap-italia@npm:2.2.0":
-  version: 2.2.0
-  resolution: "bootstrap-italia@npm:2.2.0"
+"bootstrap-italia@npm:2.6.1":
+  version: 2.6.1
+  resolution: "bootstrap-italia@npm:2.6.1"
   dependencies:
     "@popperjs/core": ^2.11.2
     "@splidejs/splide": ^3.6.12
+    "@types/bootstrap": ^5.2.6
     accessible-autocomplete: ^2.0.4
     animejs: ^3.2.1
-    bootstrap: 5.1.3
+    bootstrap: 5.2.3
     just-validate: ^3.5.1
     masonry-layout: ^4.2.2
     progressbar.js: ^1.1.0
     uuid: ^8.3.2
-  checksum: 6a2c585698e051cd88760f34b67c2a447f40c364cee620c017b41e53ad4bee86d5068825e09fe18b37c6334e263055ff321ebdf018ea6053d9838702252c94c3
+    video.js: ^8.0.4
+  checksum: f23ffb76b47d3f2411753f4f4db6259a53da718571cf54dc008517332c9adf06df463b047912ef29586dcc31e9c41f56621f7713ef1a19bd11e79660aa421bab
   languageName: node
   linkType: hard
 
-"bootstrap@npm:5.1.3":
-  version: 5.1.3
-  resolution: "bootstrap@npm:5.1.3"
+"bootstrap@npm:5.2.3":
+  version: 5.2.3
+  resolution: "bootstrap@npm:5.2.3"
   peerDependencies:
-    "@popperjs/core": ^2.10.2
-  checksum: 301b5ed872efba061104cf22ac93568e3837867fb5527ab9326a51510fb752bd4883e1d488225c8be72f86d9d3a55ef5b166aa7fa62c2fdd077c3f05b65752f8
+    "@popperjs/core": ^2.11.6
+  checksum: 0211805dec6a190c0911d142966df30fdb4b4139a04cc6c23dd83c6045ea3cb0a966b360ab2e701e7b3ad96ff01e05fdc0914be97b41bd876b11e457a8bdc6a3
   languageName: node
   linkType: hard
 
@@ -6426,6 +6523,7 @@ __metadata:
     "@babel/core": 7.19.6
     "@babel/eslint-parser": 7.23.3
     "@babel/plugin-proposal-export-default-from": 7.18.9
+    "@babel/plugin-proposal-nullish-coalescing-operator": 7.18.6
     "@babel/plugin-proposal-throw-expressions": 7.18.6
     "@commitlint/cli": 17.6.6
     "@commitlint/config-conventional": 17.6.6
@@ -6434,9 +6532,9 @@ __metadata:
     "@plone-collective/volto-sentry": 0.3.0
     "@plone/scripts": "*"
     "@release-it/conventional-changelog": 5.1.1
-    bootstrap-italia: 2.2.0
+    bootstrap-italia: 2.6.1
     classnames: ^2.3.2
-    design-react-kit: "italia/design-react-kit#fc9b40257ba3cb613141faf217f1f5b806489740"
+    design-react-kit: 5.0.0-1
     eslint: 8.54.0
     eslint-config-prettier: 9.0.0
     eslint-config-react-app: 7.0.1
@@ -6496,11 +6594,10 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"design-react-kit@italia/design-react-kit#fc9b40257ba3cb613141faf217f1f5b806489740":
-  version: 4.0.2
-  resolution: "design-react-kit@https://github.com/italia/design-react-kit.git#commit=fc9b40257ba3cb613141faf217f1f5b806489740"
+"design-react-kit@npm:5.0.0-1":
+  version: 5.0.0-1
+  resolution: "design-react-kit@npm:5.0.0-1"
   dependencies:
-    bootstrap-italia: 2.2.0
     classnames: ^2.3.1
     is-number: ^7.0.0
     react-select: ^4.3.0
@@ -6511,9 +6608,9 @@ __metadata:
     reactstrap: ^9.1.4
     webfontloader: ^1.6.28
   peerDependencies:
-    bootstrap-italia: 2.2.0
+    bootstrap-italia: ^2.3.4
     react: ">=17.0.2"
-  checksum: 3b225994514ef2624ca5b16b23c6fd3ef62dbcd65c5d0752817284f73bb8edb4802fc340876e2bfeaea5095158e094513a18b32e7a5dc4f709953e890d118ac0
+  checksum: 077452a2a91e46031f9568e78bd5757d163f3ca59b13eba52bff30d67aa0d65b88f28b414a67314267b80f3e3dbff451406a9fe92254806daa558d7f42941a05
   languageName: node
   linkType: hard
 
@@ -6598,6 +6695,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"dom-walk@npm:^0.1.0":
+  version: 0.1.2
+  resolution: "dom-walk@npm:0.1.2"
+  checksum: 19eb0ce9c6de39d5e231530685248545d9cd2bd97b2cb3486e0bfc0f2a393a9addddfd5557463a932b52fdfcf68ad2a619020cd2c74a5fe46fbecaa8e80872f3
+  languageName: node
+  linkType: hard
+
 "dot-prop@npm:^5.1.0":
   version: 5.3.0
   resolution: "dot-prop@npm:5.3.0"
@@ -8106,6 +8210,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"global@npm:4.4.0, global@npm:^4.3.1, global@npm:^4.4.0, global@npm:~4.4.0":
+  version: 4.4.0
+  resolution: "global@npm:4.4.0"
+  dependencies:
+    min-document: ^2.19.0
+    process: ^0.11.10
+  checksum: 9c057557c8f5a5bcfbeb9378ba4fe2255d04679452be504608dd5f13b54edf79f7be1db1031ea06a4ec6edd3b9f5f17d2d172fb47e6c69dae57fd84b7e72b77f
+  languageName: node
+  linkType: hard
+
 "globals@npm:^11.1.0":
   version: 11.12.0
   resolution: "globals@npm:11.12.0"
@@ -8570,6 +8684,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"individual@npm:^2.0.0":
+  version: 2.0.0
+  resolution: "individual@npm:2.0.0"
+  checksum: 34f071ade77365e2cdb9e034e7dc92930450ce427415b9ef975a2c2a455b40aa9e071ae7888972f3d2ec7d977a32cf1af46e0b8d602d70d05da5b9bbc9e23392
+  languageName: node
+  linkType: hard
+
 "infer-owner@npm:^1.0.4":
   version: 1.0.4
   resolution: "infer-owner@npm:1.0.4"
@@ -8857,6 +8978,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"is-function@npm:^1.0.1":
+  version: 1.0.2
+  resolution: "is-function@npm:1.0.2"
+  checksum: 7d564562e07b4b51359547d3ccc10fb93bb392fd1b8177ae2601ee4982a0ece86d952323fc172a9000743a3971f09689495ab78a1d49a9b14fc97a7e28521dc0
+  languageName: node
+  linkType: hard
+
 "is-generator-function@npm:^1.0.10":
   version: 1.0.10
   resolution: "is-generator-function@npm:1.0.10"
@@ -9425,6 +9553,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"keycode@npm:2.2.0":
+  version: 2.2.0
+  resolution: "keycode@npm:2.2.0"
+  checksum: cb91c2940a892f1444a41fc08339b8831445a6b095af9103e3061ea7d4bdbfc420135dcb5d9257020e35c374468bb7d4495ea9fcea54e5760196daff3c874fa4
+  languageName: node
+  linkType: hard
+
 "keyv@npm:^4.5.2":
   version: 4.5.2
   resolution: "keyv@npm:4.5.2"
@@ -9868,6 +10003,28 @@ __metadata:
   languageName: node
   linkType: hard
 
+"m3u8-parser@npm:^6.0.0":
+  version: 6.2.0
+  resolution: "m3u8-parser@npm:6.2.0"
+  dependencies:
+    "@babel/runtime": ^7.12.5
+    "@videojs/vhs-utils": ^3.0.5
+    global: ^4.4.0
+  checksum: 8aa9c726436cbdc3952eaabc34e30317e9f7fd02efc3bc3332b6c93b24ba556ceb0f29b2bdeb1aefe4ef3a5c55070f0f8e14e5f15507ff03750cb10337e926e8
+  languageName: node
+  linkType: hard
+
+"m3u8-parser@npm:^7.1.0":
+  version: 7.1.0
+  resolution: "m3u8-parser@npm:7.1.0"
+  dependencies:
+    "@babel/runtime": ^7.12.5
+    "@videojs/vhs-utils": ^3.0.5
+    global: ^4.4.0
+  checksum: c7aa6faaf5ebbbbf4b6afe538da7c583bad8d17c1f80d17d9d17bb03df470d80d2c053620c439df38750b013d155eacfa83014f423f7df3a78acaf2efd2bdb76
+  languageName: node
+  linkType: hard
+
 "macos-release@npm:^3.1.0":
   version: 3.2.0
   resolution: "macos-release@npm:3.2.0"
@@ -10090,6 +10247,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"min-document@npm:^2.19.0":
+  version: 2.19.0
+  resolution: "min-document@npm:2.19.0"
+  dependencies:
+    dom-walk: ^0.1.0
+  checksum: da6437562ea2228041542a2384528e74e22d1daa1a4ec439c165abf0b9d8a63e17e3b8a6dc6e0c731845e85301198730426932a0e813d23f932ca668340c9623
+  languageName: node
+  linkType: hard
+
 "min-indent@npm:^1.0.0, min-indent@npm:^1.0.1":
   version: 1.0.1
   resolution: "min-indent@npm:1.0.1"
@@ -10244,6 +10410,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"mpd-parser@npm:^1.0.1, mpd-parser@npm:^1.2.2":
+  version: 1.2.2
+  resolution: "mpd-parser@npm:1.2.2"
+  dependencies:
+    "@babel/runtime": ^7.12.5
+    "@videojs/vhs-utils": ^3.0.5
+    "@xmldom/xmldom": ^0.8.3
+    global: ^4.4.0
+  bin:
+    mpd-to-m3u8-json: bin/parse.js
+  checksum: 29af36af2a6c9552315091e9170625f2dc1a8e5d49bce410bf788439e69c9a3ba0e9561865ff551eccf12959553913d05b181f18cabd2e8828777d0f6a526b31
+  languageName: node
+  linkType: hard
+
 "mrs-developer@npm:*":
   version: 1.7.1
   resolution: "mrs-developer@npm:1.7.1"
@@ -10277,6 +10457,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"mux.js@npm:7.0.1, mux.js@npm:^7.0.1":
+  version: 7.0.1
+  resolution: "mux.js@npm:7.0.1"
+  dependencies:
+    "@babel/runtime": ^7.11.2
+    global: ^4.4.0
+  bin:
+    muxjs-transmux: bin/transmux.js
+  checksum: c3945789f686798a8c8b70351b6d7a22d82111211c0cc4b18837786870fc00f9d317cdd01c1e6d1fa59ae2021684168bb18eb80a5f17d5df6c5c1b190a6be70b
+  languageName: node
+  linkType: hard
+
 "nanoid@npm:^3.3.4":
   version: 3.3.4
   resolution: "nanoid@npm:3.3.4"
@@ -11092,6 +11284,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"pkcs7@npm:^1.0.4":
+  version: 1.0.4
+  resolution: "pkcs7@npm:1.0.4"
+  dependencies:
+    "@babel/runtime": ^7.5.5
+  bin:
+    pkcs7: bin/cli.js
+  checksum: 926a713263c7656883d1fcc9fa709e08c26babc76d535dd76ccdf5ad1bc1c5931ecbbe2d7ae6075ad54897e1184be4ec304d295e28953c2ec0f1a04c27f4e838
+  languageName: node
+  linkType: hard
+
 "pofile@npm:1.0.10":
   version: 1.0.10
   resolution: "pofile@npm:1.0.10"
@@ -11303,6 +11506,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"process@npm:^0.11.10":
+  version: 0.11.10
+  resolution: "process@npm:0.11.10"
+  checksum: bfcce49814f7d172a6e6a14d5fa3ac92cc3d0c3b9feb1279774708a719e19acd673995226351a082a9ae99978254e320ccda4240ddc474ba31a76c79491ca7c3
+  languageName: node
+  linkType: hard
+
 "progress@npm:^2.0.3":
   version: 2.0.3
   resolution: "progress@npm:2.0.3"
@@ -12431,6 +12641,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"rust-result@npm:^1.0.0":
+  version: 1.0.0
+  resolution: "rust-result@npm:1.0.0"
+  dependencies:
+    individual: ^2.0.0
+  checksum: ccad2bdf79d3ff29e9f163db3121342b31e6d3008714851900c59da20489175f389dc3309cb92bfa5fa4d8f8842f0287567021912d37afbe5d379880af4bb95b
+  languageName: node
+  linkType: hard
+
 "rxjs@npm:^7.5.5":
   version: 7.5.7
   resolution: "rxjs@npm:7.5.7"
@@ -12475,6 +12694,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"safe-json-parse@npm:4.0.0":
+  version: 4.0.0
+  resolution: "safe-json-parse@npm:4.0.0"
+  dependencies:
+    rust-result: ^1.0.0
+  checksum: dab69dee6cfeeb5735447e4bb79da06054ff46954f9ef7504ade0ae8afe4984d44afb16adbd24adf89a83088fac8cdb07cf4ec0abc94422a1f54a4484cdb5c1a
+  languageName: node
+  linkType: hard
+
 "safe-regex-test@npm:^1.0.0":
   version: 1.0.0
   resolution: "safe-regex-test@npm:1.0.0"
@@ -14028,6 +14256,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"url-toolkit@npm:^2.2.1":
+  version: 2.2.5
+  resolution: "url-toolkit@npm:2.2.5"
+  checksum: c784040bd4dbd78647a62218b6b8c1abd9a2f7fd8adce1851daf21dc2d98e2a5d69b78a628ec07dcfa112c16a112a182e109b7c872b6e8a1e4a1547b49b81f7b
+  languageName: node
+  linkType: hard
+
 "use-callback-ref@npm:^1.3.0":
   version: 1.3.0
   resolution: "use-callback-ref@npm:1.3.0"
@@ -14092,6 +14327,55 @@ __metadata:
   languageName: node
   linkType: hard
 
+"video.js@npm:^7 || ^8, video.js@npm:^8.0.4":
+  version: 8.6.1
+  resolution: "video.js@npm:8.6.1"
+  dependencies:
+    "@babel/runtime": ^7.12.5
+    "@videojs/http-streaming": 3.7.0
+    "@videojs/vhs-utils": ^4.0.0
+    "@videojs/xhr": 2.6.0
+    aes-decrypter: ^4.0.1
+    global: 4.4.0
+    keycode: 2.2.0
+    m3u8-parser: ^6.0.0
+    mpd-parser: ^1.0.1
+    mux.js: ^7.0.1
+    safe-json-parse: 4.0.0
+    videojs-contrib-quality-levels: 4.0.0
+    videojs-font: 4.1.0
+    videojs-vtt.js: 0.15.5
+  checksum: 4acf9cc8284708304b316711588758207562275968042c1af71ba6dcd0fcb5e8e3ec0b576713f8d3f4ab7282687adb1bc9ec05dda19b57850b5a48811ac02a7e
+  languageName: node
+  linkType: hard
+
+"videojs-contrib-quality-levels@npm:4.0.0":
+  version: 4.0.0
+  resolution: "videojs-contrib-quality-levels@npm:4.0.0"
+  dependencies:
+    global: ^4.4.0
+  peerDependencies:
+    video.js: ^8
+  checksum: 08d6b1159f0c2a97994213ef5bf84498c29020b06ab8ac0095d5cf6e3400748eede5daf27877c1f52bcc8604e34046ba45e3ec69bb7fc184a33bca00237fab25
+  languageName: node
+  linkType: hard
+
+"videojs-font@npm:4.1.0":
+  version: 4.1.0
+  resolution: "videojs-font@npm:4.1.0"
+  checksum: 7259a9e1855e269cfc08c72b031e4fa1e0008a8da7f3352b407a990177a06176c3ba69d732d91f7c9b2c1ae8b62f6aa9b5b6049ad8e0a98b86f5baea44c3d31f
+  languageName: node
+  linkType: hard
+
+"videojs-vtt.js@npm:0.15.5":
+  version: 0.15.5
+  resolution: "videojs-vtt.js@npm:0.15.5"
+  dependencies:
+    global: ^4.3.1
+  checksum: 2658de26830e412f7539f2674019348374d36f05fcdae548be001d596798f50c0d2e026163afdeff34286919de7aae08cb97af612925164167204b301d246241
+  languageName: node
+  linkType: hard
+
 "volto-blocks-widget@npm:3.1.0":
   version: 3.1.0
   resolution: "volto-blocks-widget@npm:3.1.0"

From 12522b1929aa053a7bc5a60c982e5cb9f60306d9 Mon Sep 17 00:00:00 2001
From: Piero Nicolli <piero.nicolli@redturtle.it>
Date: Wed, 22 Nov 2023 17:50:00 +0100
Subject: [PATCH 18/26] chore: release v11.0.0-alpha.0

---
 CHANGELOG.md | 12 ++++++++++++
 package.json |  2 +-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index ec47e63ac..068643cda 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,4 +1,16 @@
 
+## [11.0.0-alpha.0](https://github.com/RedTurtle/design-comuni-plone-theme/compare/v10.4.1...v11.0.0-alpha.0) (2023-11-22)
+
+
+### ⚠ BREAKING CHANGES
+
+* upgrade to design-react-kit 5.0.0-1 and bootstrap-italia 2.6.1 (#407)
+* upgrade to volto 17.5.0 (#382)
+
+### Features
+
+* upgrade to design-react-kit 5.0.0-1 and bootstrap-italia 2.6.1 ([#407](https://github.com/RedTurtle/design-comuni-plone-theme/issues/407)) ([ec1ec5b](https://github.com/RedTurtle/design-comuni-plone-theme/commit/ec1ec5bd693df58653a7c10d17a4085305734625))
+* upgrade to volto 17.5.0 ([#382](https://github.com/RedTurtle/design-comuni-plone-theme/issues/382)) ([cef3f09](https://github.com/RedTurtle/design-comuni-plone-theme/commit/cef3f09ef971bfcc03b61dafe5e1c712ac6563da))
 
 ## [10.6.4](https://github.com/redturtle/design-comuni-plone-theme/compare/v10.6.3...v10.6.4) (2023-12-18)
 
diff --git a/package.json b/package.json
index 00b1d884f..60eacc173 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,7 @@
   "name": "design-comuni-plone-theme",
   "description": "Volto Theme for Italia design guidelines",
   "license": "GPL-v3",
-  "version": "10.6.4",
+  "version": "11.0.0-alpha.0",
   "main": "src/index.js",
   "keywords": [
     "volto-addon",

From d2a070368f9e70acb11e6ba3c74d11e93278cefa Mon Sep 17 00:00:00 2001
From: Giulia Ghisini <51911425+giuliaghisini@users.noreply.github.com>
Date: Thu, 23 Nov 2023 11:27:43 +0100
Subject: [PATCH 19/26] feat!: card image height from newest bootstrap-italia
 version (#406)

* fix: change image component in ctablock

* ci: upgrade volto

* fix: change image component in  hlcontent

* fix: change image component listingimage

* fix: change image component subevents

* fix: change image component gallery

* fix: change image component GenericCard

* fix: change image component

* fix: change image component (sponsor + venuesmall)

* fix: change image component

* fix: minutes with 00 format

* docs: rimosso commento obsoleto

* fix: review giulia

* fix: review giulia

* fix: scroll position on h2 .visually-hidden

* feat: upgrade to volto 17.5.0

* docs: fix order

Co-authored-by: Piero Nicolli <pnicolli@users.noreply.github.com>

* fix: review piero

* fix: sponsor evento without image

* fix: gallery preview

* feat: upgrade to design-react-kit 5.0.0-1 and bootstrap-italia 2.6.1

* fix: fix for new design-react-kit

* fix: card image height changed like bootstrap-italia templates

* fix: revert  card image height changed like bootstrap-italia templates

* fix: revert text-secondary class

* fix: stepper style ul

* fix. pr fixes

* chore: updated locales

* fix: screen reader for SearchModal

* fix: screen reader in SearchModal

* chore: update dependencies

* fix: bootstrap imports

* chore: release v11.0.0-alpha.0

* feat:change image card height

---------

Co-authored-by: Mauro Amico <mauro.amico@gmail.com>
Co-authored-by: Piero Nicolli <pnicolli@users.noreply.github.com>
Co-authored-by: Piero Nicolli <piero.nicolli@redturtle.it>
---
 RELEASE.md                                                 | 5 +++++
 .../ItaliaTheme/Blocks/Listing/CardWithImageTemplate.jsx   | 1 -
 .../ItaliaTheme/Blocks/Listing/InEvidenceTemplate.jsx      | 7 +------
 .../TemplatesSkeletons/CardWithImageTemplateSkeleton.jsx   | 6 +-----
 .../TemplatesSkeletons/InEvidenceTemplateSkeleton.jsx      | 7 +------
 .../Blocks/RssBlock/CardWithImageRssTemplate.jsx           | 2 +-
 .../TemplatesSkeleton/CardWithImageRssTemplateSkeleton.jsx | 2 +-
 .../CardWithImageTemplate.test_disabled.jsx                | 2 +-
 .../Blocks/__tests__/CardWithImageRssTemplate.test.jsx     | 2 +-
 .../Blocks/__tests__/CardWithoutImageRssTemplate.test.jsx  | 2 +-
 src/components/ItaliaTheme/View/Commons/Events.jsx         | 2 +-
 src/components/ItaliaTheme/View/Commons/GenericCard.jsx    | 2 +-
 12 files changed, 15 insertions(+), 25 deletions(-)

diff --git a/RELEASE.md b/RELEASE.md
index 1a68ead0c..8cad69fe3 100644
--- a/RELEASE.md
+++ b/RELEASE.md
@@ -99,6 +99,11 @@
 - Sistemato il layout della card nella variazione Bandi del Blocco Elenco per la modalità tablet
 - Sistemata accessibilità del read-more nel blocco elenco con variazione "Card con testo animato" quando si è in un sottosito con uno stile applicato.
 - Sistemato errore quando viene impostato "service-link" come ID lighthouse.
+## Versione X.X.X (dd/mm/yyyy)
+
+### Novità
+
+- Modificata l'altezza delle immagini delle card, per essere in linea con i template agid.
 
 ## Versione 10.4.1 (21/11/2023)
 
diff --git a/src/components/ItaliaTheme/Blocks/Listing/CardWithImageTemplate.jsx b/src/components/ItaliaTheme/Blocks/Listing/CardWithImageTemplate.jsx
index 54e5734fc..14f76ccf6 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/CardWithImageTemplate.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/CardWithImageTemplate.jsx
@@ -118,7 +118,6 @@ const CardWithImageTemplate = (props) => {
                 ) : (
                   <Card
                     className={cx('listing-item card-bg', {
-                      'card-img': showImage,
                       'card-teaser-image card-flex no-after':
                         item['@type'] === 'Persona',
                     })}
diff --git a/src/components/ItaliaTheme/Blocks/Listing/InEvidenceTemplate.jsx b/src/components/ItaliaTheme/Blocks/Listing/InEvidenceTemplate.jsx
index 408ab9182..c67bfbb5b 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/InEvidenceTemplate.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/InEvidenceTemplate.jsx
@@ -104,12 +104,7 @@ const InEvidenceTemplate = (props) => {
                 key={index}
               />
             ) : (
-              <Card
-                key={index}
-                className={cx('listing-item card-bg', {
-                  'card-img': index === 0 && image,
-                })}
-              >
+              <Card key={index} className={cx('listing-item card-bg')}>
                 {index === 0 && image && (
                   <div className="img-responsive-wrapper">
                     <div className="img-responsive">
diff --git a/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/CardWithImageTemplateSkeleton.jsx b/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/CardWithImageTemplateSkeleton.jsx
index eccdcc6f5..fc2194fe9 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/CardWithImageTemplateSkeleton.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/CardWithImageTemplateSkeleton.jsx
@@ -41,11 +41,7 @@ const CardWithImageTemplateSkeleton = ({
             {[0, 1, 2, 3, 4, 5].map((i) => {
               return (
                 <Col lg="4" key={i} className="col-item mb-3">
-                  <Card
-                    className={cx('listing-item card-bg', {
-                      'card-img': i < 3,
-                    })}
-                  >
+                  <Card className={cx('listing-item card-bg')}>
                     {/* wrapperClassName="card-overlapping" */}
                     {(i < 3 || always_show_image) && (
                       <div className="img-responsive-wrapper">
diff --git a/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/InEvidenceTemplateSkeleton.jsx b/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/InEvidenceTemplateSkeleton.jsx
index 1e6f43e9c..21fef3b44 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/InEvidenceTemplateSkeleton.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/TemplatesSkeletons/InEvidenceTemplateSkeleton.jsx
@@ -37,12 +37,7 @@ const InEvidenceTemplateSkeleton = ({
           <div className="in-evidence-cards-wrapper mb-5">
             {[0, 1, 2, 3, 4].map((i) => {
               return (
-                <Card
-                  key={i}
-                  className={cx('listing-item card-bg', {
-                    'card-img': i === 0,
-                  })}
-                >
+                <Card key={i} className={cx('listing-item card-bg')}>
                   {i === 0 && (
                     <div className="img-responsive-wrapper">
                       <div className="img-responsive">
diff --git a/src/components/ItaliaTheme/Blocks/RssBlock/CardWithImageRssTemplate.jsx b/src/components/ItaliaTheme/Blocks/RssBlock/CardWithImageRssTemplate.jsx
index 9b758507d..bbfbe7b03 100644
--- a/src/components/ItaliaTheme/Blocks/RssBlock/CardWithImageRssTemplate.jsx
+++ b/src/components/ItaliaTheme/Blocks/RssBlock/CardWithImageRssTemplate.jsx
@@ -53,7 +53,7 @@ const CardWithImageRssTemplate = ({
           <Row>
             {items.map((item) => (
               <Col lg={3} className="mb-3" key={item['@id']}>
-                <Card className="card-bg card-img" noWrapper={false} tag="div">
+                <Card className="card-bg" noWrapper={false} tag="div">
                   {item.enclosure?.url && (
                     <div className="img-responsive-wrapper">
                       <div className="img-responsive img-responsive-panoramic">
diff --git a/src/components/ItaliaTheme/Blocks/RssBlock/TemplatesSkeleton/CardWithImageRssTemplateSkeleton.jsx b/src/components/ItaliaTheme/Blocks/RssBlock/TemplatesSkeleton/CardWithImageRssTemplateSkeleton.jsx
index 3f9d3874d..1e1c39bec 100644
--- a/src/components/ItaliaTheme/Blocks/RssBlock/TemplatesSkeleton/CardWithImageRssTemplateSkeleton.jsx
+++ b/src/components/ItaliaTheme/Blocks/RssBlock/TemplatesSkeleton/CardWithImageRssTemplateSkeleton.jsx
@@ -25,7 +25,7 @@ const CardWithImageRssTemplateSkeleton = ({ isEditMode, data = {} }) => {
         <Row>
           {[0, 1, 2, 3, 4, 5, 6, 7].map((i) => (
             <Col lg={3} className="mb-3" key={i}>
-              <Card className="card-img" noWrapper={false} tag="div">
+              <Card noWrapper={false} tag="div">
                 <div className="img-responsive-wrapper">
                   <div className="img-responsive img-responsive-panoramic">
                     <figure className="img-wrapper"></figure>
diff --git a/src/components/ItaliaTheme/Blocks/__disabled_tests__/CardWithImageTemplate.test_disabled.jsx b/src/components/ItaliaTheme/Blocks/__disabled_tests__/CardWithImageTemplate.test_disabled.jsx
index 10b623b56..901f58751 100644
--- a/src/components/ItaliaTheme/Blocks/__disabled_tests__/CardWithImageTemplate.test_disabled.jsx
+++ b/src/components/ItaliaTheme/Blocks/__disabled_tests__/CardWithImageTemplate.test_disabled.jsx
@@ -1483,7 +1483,7 @@ test('View renders all fields', async () => {
   ).toBeInTheDocument();
 
   // mostra l'immagine per tutti gli elementi
-  const cardsWithImage = document.querySelectorAll('.card-img');
+  const cardsWithImage = document.querySelectorAll('.card');
   expect(cardsWithImage.length).toBe(mock_fields.items_total);
 
   // non alterare le dimensioni naturali dell'immagine
diff --git a/src/components/ItaliaTheme/Blocks/__tests__/CardWithImageRssTemplate.test.jsx b/src/components/ItaliaTheme/Blocks/__tests__/CardWithImageRssTemplate.test.jsx
index 9a477133b..69c851f4c 100644
--- a/src/components/ItaliaTheme/Blocks/__tests__/CardWithImageRssTemplate.test.jsx
+++ b/src/components/ItaliaTheme/Blocks/__tests__/CardWithImageRssTemplate.test.jsx
@@ -151,7 +151,7 @@ test('View renders all fields', async () => {
     screen.getByRole('heading', { name: /Is this the real life/i }),
   ).toBeInTheDocument();
   //numero massimo elementi da mostrare
-  const cards = document.querySelectorAll('.card-img');
+  const cards = document.querySelectorAll('.card');
   expect(cards.length).toBe(mock_fields.limit);
 
   //data card --> cambia in base a rss
diff --git a/src/components/ItaliaTheme/Blocks/__tests__/CardWithoutImageRssTemplate.test.jsx b/src/components/ItaliaTheme/Blocks/__tests__/CardWithoutImageRssTemplate.test.jsx
index 73ddcde25..7bacd7faf 100644
--- a/src/components/ItaliaTheme/Blocks/__tests__/CardWithoutImageRssTemplate.test.jsx
+++ b/src/components/ItaliaTheme/Blocks/__tests__/CardWithoutImageRssTemplate.test.jsx
@@ -151,7 +151,7 @@ test('View renders all fields', async () => {
     screen.getByRole('heading', { name: /Is this the real life/i }),
   ).toBeInTheDocument();
   //numero massimo elementi da mostrare
-  const cards = document.querySelectorAll('.card-img');
+  const cards = document.querySelectorAll('.card');
   expect(cards.length).toBe(mock_fields.limit);
 
   //data card --> data cambia in base a rss
diff --git a/src/components/ItaliaTheme/View/Commons/Events.jsx b/src/components/ItaliaTheme/View/Commons/Events.jsx
index 6f1bcc47c..8d90081d5 100644
--- a/src/components/ItaliaTheme/View/Commons/Events.jsx
+++ b/src/components/ItaliaTheme/View/Commons/Events.jsx
@@ -33,7 +33,7 @@ const SubEvent = ({ event, show_image }) => {
   const Image = config.getComponent({ name: 'Image' }).component;
   return event ? (
     <div className="card-wrapper card-teaser">
-      <Card noWrapper className="card card-img no-after shadow rounded">
+      <Card noWrapper className="card no-after shadow rounded">
         {show_image &&
           (event.image_field || event.preview_image || event.image) && (
             <div className="img-responsive-wrapper">
diff --git a/src/components/ItaliaTheme/View/Commons/GenericCard.jsx b/src/components/ItaliaTheme/View/Commons/GenericCard.jsx
index 07fdd7329..fb0b30ece 100644
--- a/src/components/ItaliaTheme/View/Commons/GenericCard.jsx
+++ b/src/components/ItaliaTheme/View/Commons/GenericCard.jsx
@@ -61,7 +61,7 @@ const GenericCard = ({
 
   return item ? (
     image ? (
-      <div className={cx('genericcard card card-img shadow rounded mt-3')}>
+      <div className={cx('genericcard card shadow rounded mt-3')}>
         <div className="img-responsive-wrapper">
           <div className="img-responsive img-responsive-panoramic">
             <figure className="img-wrapper">{image}</figure>

From 49acda41f212f742d4e13a9688bf37a4eedc8fba Mon Sep 17 00:00:00 2001
From: Sara Bianchi <43245702+SaraBianchi@users.noreply.github.com>
Date: Thu, 23 Nov 2023 11:32:05 +0100
Subject: [PATCH 20/26] fix: listing block card-slide-text-template read-more
 alignment (#416)

---
 src/theme/ItaliaTheme/Blocks/_cardWithSlideUpTextTemplate.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/theme/ItaliaTheme/Blocks/_cardWithSlideUpTextTemplate.scss b/src/theme/ItaliaTheme/Blocks/_cardWithSlideUpTextTemplate.scss
index cb9919fd0..faa6471b3 100644
--- a/src/theme/ItaliaTheme/Blocks/_cardWithSlideUpTextTemplate.scss
+++ b/src/theme/ItaliaTheme/Blocks/_cardWithSlideUpTextTemplate.scss
@@ -105,6 +105,7 @@
       position: relative;
       z-index: 2;
       overflow: hidden;
+      width: 100%;
       height: auto;
       max-height: 0;
       -webkit-transition: all 0.35s linear;

From 9b90860b69fa7b6968eaeaeafde930bf03fa3f43 Mon Sep 17 00:00:00 2001
From: Piero Nicolli <piero.nicolli@redturtle.it>
Date: Thu, 23 Nov 2023 12:48:10 +0100
Subject: [PATCH 21/26] chore: release v11.0.0-alpha.1

---
 CHANGELOG.md | 17 +++++++++++++++++
 package.json |  2 +-
 2 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 068643cda..887ea8c23 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,4 +1,21 @@
 
+
+## [11.0.0-alpha.1](https://github.com/RedTurtle/design-comuni-plone-theme/compare/v11.0.0-alpha.0...v11.0.0-alpha.1) (2023-11-23)
+
+
+### ⚠ BREAKING CHANGES
+
+* card image height from newest bootstrap-italia version (#406)
+
+### Features
+
+* card image height from newest bootstrap-italia version ([#406](https://github.com/RedTurtle/design-comuni-plone-theme/issues/406)) ([2cf34bc](https://github.com/RedTurtle/design-comuni-plone-theme/commit/2cf34bcfc961673a94b3d76c39632a764b1e322a))
+
+
+### Bug Fixes
+
+* listing block card-slide-text-template read-more alignment ([#416](https://github.com/RedTurtle/design-comuni-plone-theme/issues/416)) ([39c756c](https://github.com/RedTurtle/design-comuni-plone-theme/commit/39c756c9c350b9783b46259076842004df7751a6))
+
 ## [11.0.0-alpha.0](https://github.com/RedTurtle/design-comuni-plone-theme/compare/v10.4.1...v11.0.0-alpha.0) (2023-11-22)
 
 
diff --git a/package.json b/package.json
index 60eacc173..c6d4a1316 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,7 @@
   "name": "design-comuni-plone-theme",
   "description": "Volto Theme for Italia design guidelines",
   "license": "GPL-v3",
-  "version": "11.0.0-alpha.0",
+  "version": "11.0.0-alpha.1",
   "main": "src/index.js",
   "keywords": [
     "volto-addon",

From 15f974b56fe63e43c8245059160d9a7a3cd5bb7d Mon Sep 17 00:00:00 2001
From: Giulia Ghisini <giulia.ghisini@redturtle.it>
Date: Fri, 24 Nov 2023 10:10:40 +0100
Subject: [PATCH 22/26] fix: image size in listing

---
 .../ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss     | 6 ------
 1 file changed, 6 deletions(-)

diff --git a/src/theme/ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss b/src/theme/ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss
index 724e25178..249cc1a11 100644
--- a/src/theme/ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss
+++ b/src/theme/ItaliaTheme/Blocks/_cardWithImageAndInEvidence.scss
@@ -14,12 +14,6 @@
       display: inline;
     }
 
-    img.listing-image {
-      max-width: 100%;
-      height: auto;
-      object-position: center;
-    }
-
     .img-responsive-wrapper {
       width: inherit;
 

From a986dd9aa8f8593a1603d2c60b59de4343fc2f19 Mon Sep 17 00:00:00 2001
From: Piero Nicolli <piero.nicolli@redturtle.it>
Date: Fri, 24 Nov 2023 11:57:10 +0100
Subject: [PATCH 23/26] fix: update volto-editablefooter to 5.0.3

---
 package.json |  2 +-
 yarn.lock    | 10 +++++-----
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/package.json b/package.json
index c6d4a1316..57745f038 100644
--- a/package.json
+++ b/package.json
@@ -144,7 +144,7 @@
     "volto-blocks-widget": "3.1.0",
     "volto-data-grid-widget": "2.3.1",
     "volto-dropdownmenu": "4.1.0",
-    "volto-editablefooter": "5.0.1",
+    "volto-editablefooter": "5.0.3",
     "volto-feedback": "0.1.5",
     "volto-form-block": "3.1.0",
     "volto-gdpr-privacy": "2.1.1",
diff --git a/yarn.lock b/yarn.lock
index e61a1cdd0..b5500b0d4 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6574,7 +6574,7 @@ __metadata:
     volto-blocks-widget: 3.1.0
     volto-data-grid-widget: 2.3.1
     volto-dropdownmenu: 4.1.0
-    volto-editablefooter: 5.0.1
+    volto-editablefooter: 5.0.3
     volto-feedback: 0.1.5
     volto-form-block: 3.1.0
     volto-gdpr-privacy: 2.1.1
@@ -14405,14 +14405,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"volto-editablefooter@npm:5.0.1":
-  version: 5.0.1
-  resolution: "volto-editablefooter@npm:5.0.1"
+"volto-editablefooter@npm:5.0.3":
+  version: 5.0.3
+  resolution: "volto-editablefooter@npm:5.0.3"
   dependencies:
     react-outside-click-handler: 1.3.0
   peerDependencies:
     "@plone/volto": ">=16.0.0-alpha.38"
-  checksum: 8aecc466a36f8b53b1c84cd1c29860d3078d4e54ed9da35d4e0ad221d8545eecf8c14a324194c1a939fc21eca02b768367ade32e3baef2a1af6e9cd1ce519d05
+  checksum: efbc8e7679dc78727fa465e238421346d682edc80780baa56baa8ec047e6009ed5dee436b120143c464427735820f2dac52fa98f9c46890a17f0e16c30a18c36
   languageName: node
   linkType: hard
 

From f28cfa461a369329cfbbe7af2164110575fb5bad Mon Sep 17 00:00:00 2001
From: Piero Nicolli <pnicolli@users.noreply.github.com>
Date: Tue, 28 Nov 2023 15:33:50 +0100
Subject: [PATCH 24/26] fix: gallery component for ct views breaking with newer
 backend versions (#422)

---
 src/components/ItaliaTheme/View/Commons/Gallery.jsx | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/ItaliaTheme/View/Commons/Gallery.jsx b/src/components/ItaliaTheme/View/Commons/Gallery.jsx
index 8c2746031..fbc12a5ef 100644
--- a/src/components/ItaliaTheme/View/Commons/Gallery.jsx
+++ b/src/components/ItaliaTheme/View/Commons/Gallery.jsx
@@ -11,6 +11,7 @@ import EmbeddedVideo from './EmbeddedVideo';
 import { GalleryPreview } from 'design-comuni-plone-theme/components/ItaliaTheme';
 import PropTypes from 'prop-types';
 import { contentFolderHasItems } from 'design-comuni-plone-theme/helpers';
+import { UniversalLink } from '@plone/volto/components';
 import { flattenToAppURL } from '@plone/volto/helpers';
 import { injectLazyLibs } from '@plone/volto/helpers/Loadable/Loadable';
 import config from '@plone/volto/registry';
@@ -150,8 +151,8 @@ const Gallery = ({
                 {images.map((item, i) => (
                   <div className="it-single-slide-wrapper" key={item['@id']}>
                     <figure>
-                      <a
-                        href={flattenToAppURL(item.image.scales.large.download)}
+                      <UniversalLink
+                        item={item}
                         onClick={(e) => {
                           e.preventDefault();
                           e.stopPropagation();
@@ -175,7 +176,7 @@ const Gallery = ({
                           loading="lazy"
                           sizes={`(max-width:320px) 300px, (max-width:425px) 400px, ${default_width_image}`}
                         />
-                      </a>
+                      </UniversalLink>
                       <figcaption className="figure-caption mt-2">
                         {item.title}
                       </figcaption>

From f5bf04a53802062dee0c5eb584165aaa780a7522 Mon Sep 17 00:00:00 2001
From: Giulia Ghisini <51911425+giuliaghisini@users.noreply.github.com>
Date: Wed, 29 Nov 2023 11:16:24 +0100
Subject: [PATCH 25/26] fix: background image for NumbersBlock and Countdown
 block (#423)

* fix: background image for NumbersBlock and Countdown block

* fix: tests
---
 .../Blocks/CountDown/Background.jsx           |  7 --
 .../ItaliaTheme/Blocks/CountDown/Edit.jsx     |  8 +-
 .../ItaliaTheme/Blocks/CountDown/View.jsx     |  8 +-
 .../ItaliaTheme/Blocks/NumbersBlock/Edit.jsx  |  7 +-
 .../ItaliaTheme/Blocks/NumbersBlock/View.jsx  |  8 +-
 .../Blocks/__tests__/Countdown.test.jsx       | 84 +------------------
 6 files changed, 24 insertions(+), 98 deletions(-)
 delete mode 100644 src/components/ItaliaTheme/Blocks/CountDown/Background.jsx

diff --git a/src/components/ItaliaTheme/Blocks/CountDown/Background.jsx b/src/components/ItaliaTheme/Blocks/CountDown/Background.jsx
deleted file mode 100644
index 8fc4e65e9..000000000
--- a/src/components/ItaliaTheme/Blocks/CountDown/Background.jsx
+++ /dev/null
@@ -1,7 +0,0 @@
-import React from 'react';
-
-const Background = (props) => (
-  <div className="searchSections-background" {...props} />
-);
-
-export default Background;
diff --git a/src/components/ItaliaTheme/Blocks/CountDown/Edit.jsx b/src/components/ItaliaTheme/Blocks/CountDown/Edit.jsx
index 14bb2522f..976e26ae3 100644
--- a/src/components/ItaliaTheme/Blocks/CountDown/Edit.jsx
+++ b/src/components/ItaliaTheme/Blocks/CountDown/Edit.jsx
@@ -39,9 +39,13 @@ const Edit = (props) => {
               className="background-image"
               style={{
                 backgroundImage: `url(${
-                  data.background[0]?.image
+                  data.background[0]?.image_field
                     ? flattenToAppURL(
-                        data.background[0]['@id'] + '/@@images/image',
+                        data.background[0]['@id'] +
+                          '/' +
+                          data.background[0].image_scales?.[
+                            data.background[0].image_field
+                          ][0].download,
                       )
                     : addAppURL(data.background[0]?.['@id'])
                 })`,
diff --git a/src/components/ItaliaTheme/Blocks/CountDown/View.jsx b/src/components/ItaliaTheme/Blocks/CountDown/View.jsx
index b70c334c6..dbe9377d4 100644
--- a/src/components/ItaliaTheme/Blocks/CountDown/View.jsx
+++ b/src/components/ItaliaTheme/Blocks/CountDown/View.jsx
@@ -20,9 +20,13 @@ const View = ({ data, id }) => {
               className="background-image"
               style={{
                 backgroundImage: `url(${
-                  data.background[0]?.image
+                  data.background[0]?.image_field
                     ? flattenToAppURL(
-                        data.background[0]['@id'] + '/@@images/image',
+                        data.background[0]['@id'] +
+                          '/' +
+                          data.background[0].image_scales?.[
+                            data.background[0].image_field
+                          ][0].download,
                       )
                     : addAppURL(data.background[0]?.['@id'])
                 })`,
diff --git a/src/components/ItaliaTheme/Blocks/NumbersBlock/Edit.jsx b/src/components/ItaliaTheme/Blocks/NumbersBlock/Edit.jsx
index c72cdd6e7..a0ecec062 100644
--- a/src/components/ItaliaTheme/Blocks/NumbersBlock/Edit.jsx
+++ b/src/components/ItaliaTheme/Blocks/NumbersBlock/Edit.jsx
@@ -68,10 +68,13 @@ class Edit extends SubblocksEdit {
               className="background-image"
               style={{
                 backgroundImage: `url(${
-                  this.props.data.background[0]?.image
+                  this.props.data.background[0]?.image_field
                     ? flattenToAppURL(
                         this.props.data.background[0]['@id'] +
-                          '/@@images/image',
+                          '/' +
+                          this.props.data.background[0].image_scales?.[
+                            this.props.data.background[0].image_field
+                          ][0].download,
                       )
                     : addAppURL(this.props.data.background[0]?.['@id'])
                 })`,
diff --git a/src/components/ItaliaTheme/Blocks/NumbersBlock/View.jsx b/src/components/ItaliaTheme/Blocks/NumbersBlock/View.jsx
index 52f93a8b5..9808b9d72 100644
--- a/src/components/ItaliaTheme/Blocks/NumbersBlock/View.jsx
+++ b/src/components/ItaliaTheme/Blocks/NumbersBlock/View.jsx
@@ -29,9 +29,13 @@ const NumbersView = ({ data, block }) => {
               className="background-image"
               style={{
                 backgroundImage: `url(${
-                  data.background[0]?.image
+                  data.background[0]?.image_field
                     ? flattenToAppURL(
-                        data.background[0]['@id'] + '/@@images/image',
+                        data.background[0]['@id'] +
+                          '/' +
+                          data.background[0].image_scales?.[
+                            data.background[0].image_field
+                          ][0].download,
                       )
                     : addAppURL(data.background[0]?.['@id'])
                 })`,
diff --git a/src/components/ItaliaTheme/Blocks/__tests__/Countdown.test.jsx b/src/components/ItaliaTheme/Blocks/__tests__/Countdown.test.jsx
index 373ed8ac7..747fac87c 100644
--- a/src/components/ItaliaTheme/Blocks/__tests__/Countdown.test.jsx
+++ b/src/components/ItaliaTheme/Blocks/__tests__/Countdown.test.jsx
@@ -60,88 +60,6 @@ const mock_fields = {
       head_title: null,
       icona: null,
       id: 'business-teamwork-join-hands-together-business-teamwork-concept_1150-1804.webp',
-      image: {
-        scales: {
-          gallery: {
-            download:
-              'http://localhost:3000/is-this-the-real-life/business-teamwork-join-hands-together-business-teamwork-concept_1150-1804.webp/@@images/image/gallery',
-            height: 65536,
-            width: 250,
-          },
-          great: {
-            download:
-              'http://localhost:3000/is-this-the-real-life/business-teamwork-join-hands-together-business-teamwork-concept_1150-1804.webp/@@images/image/great',
-            height: 65536,
-            width: 1200,
-          },
-          huge: {
-            download:
-              'http://localhost:3000/is-this-the-real-life/business-teamwork-join-hands-together-business-teamwork-concept_1150-1804.webp/@@images/image/huge',
-            height: 65536,
-            width: 1600,
-          },
-          icon: {
-            download:
-              'http://localhost:3000/is-this-the-real-life/business-teamwork-join-hands-together-business-teamwork-concept_1150-1804.webp/@@images/image/icon',
-            height: 32,
-            width: 32,
-          },
-          large: {
-            download:
-              'http://localhost:3000/is-this-the-real-life/business-teamwork-join-hands-together-business-teamwork-concept_1150-1804.webp/@@images/image/large',
-            height: 65536,
-            width: 800,
-          },
-          larger: {
-            download:
-              'http://localhost:3000/is-this-the-real-life/business-teamwork-join-hands-together-business-teamwork-concept_1150-1804.webp/@@images/image/larger',
-            height: 65536,
-            width: 1000,
-          },
-          listing: {
-            download:
-              'http://localhost:3000/is-this-the-real-life/business-teamwork-join-hands-together-business-teamwork-concept_1150-1804.webp/@@images/image/listing',
-            height: 16,
-            width: 16,
-          },
-          midi: {
-            download:
-              'http://localhost:3000/is-this-the-real-life/business-teamwork-join-hands-together-business-teamwork-concept_1150-1804.webp/@@images/image/midi',
-            height: 65536,
-            width: 300,
-          },
-          mini: {
-            download:
-              'http://localhost:3000/is-this-the-real-life/business-teamwork-join-hands-together-business-teamwork-concept_1150-1804.webp/@@images/image/mini',
-            height: 65536,
-            width: 200,
-          },
-          preview: {
-            download:
-              'http://localhost:3000/is-this-the-real-life/business-teamwork-join-hands-together-business-teamwork-concept_1150-1804.webp/@@images/image/preview',
-            height: 65536,
-            width: 400,
-          },
-          teaser: {
-            download:
-              'http://localhost:3000/is-this-the-real-life/business-teamwork-join-hands-together-business-teamwork-concept_1150-1804.webp/@@images/image/teaser',
-            height: 65536,
-            width: 600,
-          },
-          thumb: {
-            download:
-              'http://localhost:3000/is-this-the-real-life/business-teamwork-join-hands-together-business-teamwork-concept_1150-1804.webp/@@images/image/thumb',
-            height: 65536,
-            width: 128,
-          },
-          tile: {
-            download:
-              'http://localhost:3000/is-this-the-real-life/business-teamwork-join-hands-together-business-teamwork-concept_1150-1804.webp/@@images/image/tile',
-            height: 64,
-            width: 64,
-          },
-        },
-      },
       image_field: 'image',
       image_scales: {
         image: [
@@ -345,7 +263,7 @@ test('View renders all fields', async () => {
   //immagine background
   const background = document.querySelector('.background-image');
   expect(background).toHaveStyle(
-    `background-image: url(/is-this-the-real-life/business-teamwork-join-hands-together-business-teamwork-concept_1150-1804.webp/@@images/image);`,
+    `background-image: url(/is-this-the-real-life/business-teamwork-join-hands-together-business-teamwork-concept_1150-1804.webp/@@images/image-2000-7d300845b28c407363d6e0f57c615056.webp);`,
   );
 
   //countdown position

From b1bb715e074178656bffc9583989ee42cd2fabd5 Mon Sep 17 00:00:00 2001
From: Piero Nicolli <piero.nicolli@redturtle.it>
Date: Wed, 29 Nov 2023 11:18:15 +0100
Subject: [PATCH 26/26] chore: release v11.0.0-alpha.2

---
 CHANGELOG.md | 12 +++++++++++-
 package.json |  2 +-
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 887ea8c23..6d0d7065b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,15 @@
 
 
+## [11.0.0-alpha.2](https://github.com/RedTurtle/design-comuni-plone-theme/compare/v11.0.0-alpha.1...v11.0.0-alpha.2) (2023-11-29)
+
+
+### Bug Fixes
+
+* background image for NumbersBlock and Countdown block ([#423](https://github.com/RedTurtle/design-comuni-plone-theme/issues/423)) ([28ba7ea](https://github.com/RedTurtle/design-comuni-plone-theme/commit/28ba7ea39701eed8e65843b68c62a29797dd7d4f))
+* gallery component for ct views breaking with newer backend versions ([#422](https://github.com/RedTurtle/design-comuni-plone-theme/issues/422)) ([45a52f7](https://github.com/RedTurtle/design-comuni-plone-theme/commit/45a52f7572cfc25b3adec897c089b848c215e359))
+* image size in listing ([397ba93](https://github.com/RedTurtle/design-comuni-plone-theme/commit/397ba932c0742690535c9dd6868cd0bda740f11b))
+* update volto-editablefooter to 5.0.3 ([8fcada1](https://github.com/RedTurtle/design-comuni-plone-theme/commit/8fcada1c5e36e67fd79f3fa99ec9077d0565a661))
+
 ## [11.0.0-alpha.1](https://github.com/RedTurtle/design-comuni-plone-theme/compare/v11.0.0-alpha.0...v11.0.0-alpha.1) (2023-11-23)
 
 
@@ -6418,4 +6428,4 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 - added onclick to viewAll button [`baa258a`](https://github.com/RedTurtle/design-volto-theme/commit/baa258a983f9619b18f9c8d9fb078fe9b17f338b)
 - todo [`7814f01`](https://github.com/RedTurtle/design-volto-theme/commit/7814f01e5dd883c83bca4ecf53425ada9942d9ab)
 - updated gitignore with .history [`e73a28c`](https://github.com/RedTurtle/design-volto-theme/commit/e73a28c94176a172219c1a740a97047b5e2fa400)
-- Added nvmrc [`fd54a3c`](https://github.com/RedTurtle/design-volto-theme/commit/fd54a3cbcf8df22997f036919dfafda870f85db7)
\ No newline at end of file
+- Added nvmrc [`fd54a3c`](https://github.com/RedTurtle/design-volto-theme/commit/fd54a3cbcf8df22997f036919dfafda870f85db7)
diff --git a/package.json b/package.json
index 57745f038..541c409fa 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,7 @@
   "name": "design-comuni-plone-theme",
   "description": "Volto Theme for Italia design guidelines",
   "license": "GPL-v3",
-  "version": "11.0.0-alpha.1",
+  "version": "11.0.0-alpha.2",
   "main": "src/index.js",
   "keywords": [
     "volto-addon",