design-comuni-plone-theme 11.24.3 → 11.24.5

package/CHANGELOG.md

@@ -1,5 +1,40 @@
 
 
+## [11.24.5](https://github.com/RedTurtle/design-comuni-plone-theme/compare/v11.24.4...v11.24.5) (2024-11-22)
+
+
+### Bug Fixes
+
+* added info on contents file upload modal on restraint in servizio-modulistica folder ([#796](https://github.com/RedTurtle/design-comuni-plone-theme/issues/796)) ([cb7b3c8](https://github.com/RedTurtle/design-comuni-plone-theme/commit/cb7b3c83325f6aa3da94faa29eaf0c940e216a93))
+* removed whole day condition in page header subtitle ([#800](https://github.com/RedTurtle/design-comuni-plone-theme/issues/800)) ([cc7d668](https://github.com/RedTurtle/design-comuni-plone-theme/commit/cc7d6686dc91aaaf3eaef51102c8e035540efe46))
+* safari rendering issues and overhaul old dynamic bootstrap italia icons import using cache map ([#810](https://github.com/RedTurtle/design-comuni-plone-theme/issues/810)) ([9c23ac6](https://github.com/RedTurtle/design-comuni-plone-theme/commit/9c23ac6fd172f31c0aa4723d4db008a92100b1a1))
+* updated lockfile ([8d1cf74](https://github.com/RedTurtle/design-comuni-plone-theme/commit/8d1cf74defdec9059dff9a1e1b4313fa7b4c0402))
+* updated volto-gdpr-privacy addon version to 2.2.9([#806](https://github.com/RedTurtle/design-comuni-plone-theme/issues/806)) ([f785ddd](https://github.com/RedTurtle/design-comuni-plone-theme/commit/f785ddd651e1528439a58852f852a9331df2a57e))
+
+
+### Maintenance
+
+* removed additional info from release.md from september ([#799](https://github.com/RedTurtle/design-comuni-plone-theme/issues/799)) ([60052e7](https://github.com/RedTurtle/design-comuni-plone-theme/commit/60052e77b71a9f9dbb59714240acadc01e14ee0a))
+
+
+### Documentation
+
+* updated publiccode and release log ([6a5e490](https://github.com/RedTurtle/design-comuni-plone-theme/commit/6a5e490248df7e53784b5f730b096ab9d6553ad8))
+
+## [11.24.4](https://github.com/RedTurtle/design-comuni-plone-theme/compare/v11.24.3...v11.24.4) (2024-11-07)
+
+
+### Bug Fixes
+
+* arlogin styles in 992px-1200px media query space ([#802](https://github.com/RedTurtle/design-comuni-plone-theme/issues/802)) ([eebf6e4](https://github.com/RedTurtle/design-comuni-plone-theme/commit/eebf6e4129c021dc361638c940b62b67a5b15739))
+* page freeze when updateSideMenuOnLoadingBlocks=true and page has gallery ([#805](https://github.com/RedTurtle/design-comuni-plone-theme/issues/805)) ([cab333e](https://github.com/RedTurtle/design-comuni-plone-theme/commit/cab333e35dc7faac5fbc61a41fdec02922378b00))
+
+
+### Documentation
+
+* update docs link in publiccode.yml ([#190](https://github.com/RedTurtle/design-comuni-plone-theme/issues/190)) ([34a35b2](https://github.com/RedTurtle/design-comuni-plone-theme/commit/34a35b2ac7c6301e1bbf22a6109fef8d8135db3f))
+* updated publiccode and release log ([67a062c](https://github.com/RedTurtle/design-comuni-plone-theme/commit/67a062cf007333435046c1b3cf8cf0d34bf59abc))
+
 ## [11.24.3](https://github.com/RedTurtle/design-comuni-plone-theme/compare/v11.24.2...v11.24.3) (2024-10-24)
 
 

package/RELEASE.md

@@ -39,7 +39,25 @@
 ### Fix
 
 - ...
--->
+ -->
+
+## Versione 11.24.5 (22/11/2024)
+
+### Migliorie
+
+- Inserito messaggio di avviso quando si tenta di caricare un file dalla cartella Modulistica all'interno di un Servizio per segnalare limitazione sull'upload
+
+### Fix
+
+- L'impostazione "Solo cookie tecnici" non causa problemi nell'apertura del cookie banner.
+- [WebKit, Safari, iOS] Risolto un problema di visualizzazione grafica di alcuni bottoni che contengono al loro interno un link ad un sito esterno.
+- Quando un evento ha impostata l'opzione "Tutta la giornata", le date sotto il titolo vengono visualizzate in maniera corretta.
+
+## Versione 11.24.4 (07/11/2024)
+
+### Fix
+
+- Risolto un problema di visualizzazione grafica per il bottone di login all'area personale per alcune specifiche dimensioni di schermi
 
 ## Versione 11.24.3 (24/10/2024)
 
@@ -91,7 +109,7 @@
 
 ### Fix
 
-- Rimosso il campo "ID lighthouse" dal blocco elenco con variazione Card con Testo Animato perchè entra in contrasto con asseveratore. Pianificato evento per ripristinarlo.
+- Rimosso il campo "ID lighthouse" dal blocco elenco con variazione Card con Testo Animato perchè entra in contrasto con asseveratore
 
 ## Versione 11.22.0 (05/09/2024)
 

package/locales/de/LC_MESSAGES/volto.po

@@ -2644,6 +2644,11 @@ msgstr ""
 msgid "modulistica"
 msgstr ""
 
+#: overrideTranslations
+# defaultMessage: As per the official information architecture outlined in measure 1.4.1, all forms must be properly uploaded in the designated section within Amministrazione > Documenti e Dati > Modulistica, and linked to the relevant service sheet. It is no longer possible to upload files and attachments directly into this container.
+msgid "modulistica_restraint"
+msgstr ""
+
 #: components/ItaliaTheme/View/Commons/DownloadFileFormat
 # defaultMessage: Scarica il file
 msgid "modulo_download_file"

package/locales/en/LC_MESSAGES/volto.po

@@ -2629,6 +2629,11 @@ msgstr "Last update"
 msgid "modulistica"
 msgstr "Forms"
 
+#: overrideTranslations
+# defaultMessage: As per the official information architecture outlined in measure 1.4.1, all forms must be properly uploaded in the designated section within Amministrazione > Documenti e Dati > Modulistica, and linked to the relevant service sheet. It is no longer possible to upload files and attachments directly into this container.
+msgid "modulistica_restraint"
+msgstr ""
+
 #: components/ItaliaTheme/View/Commons/DownloadFileFormat
 # defaultMessage: Scarica il file
 msgid "modulo_download_file"

package/locales/es/LC_MESSAGES/volto.po

@@ -2638,6 +2638,11 @@ msgstr "Última actualización"
 msgid "modulistica"
 msgstr "Formularios"
 
+#: overrideTranslations
+# defaultMessage: As per the official information architecture outlined in measure 1.4.1, all forms must be properly uploaded in the designated section within Amministrazione > Documenti e Dati > Modulistica, and linked to the relevant service sheet. It is no longer possible to upload files and attachments directly into this container.
+msgid "modulistica_restraint"
+msgstr ""
+
 #: components/ItaliaTheme/View/Commons/DownloadFileFormat
 # defaultMessage: Scarica il file
 msgid "modulo_download_file"

package/locales/fr/LC_MESSAGES/volto.po

@@ -2646,6 +2646,11 @@ msgstr "Dernière mise à jour"
 msgid "modulistica"
 msgstr "Formes"
 
+#: overrideTranslations
+# defaultMessage: As per the official information architecture outlined in measure 1.4.1, all forms must be properly uploaded in the designated section within Amministrazione > Documenti e Dati > Modulistica, and linked to the relevant service sheet. It is no longer possible to upload files and attachments directly into this container.
+msgid "modulistica_restraint"
+msgstr ""
+
 #: components/ItaliaTheme/View/Commons/DownloadFileFormat
 # defaultMessage: Scarica il file
 msgid "modulo_download_file"

package/locales/it/LC_MESSAGES/volto.po

@@ -2629,6 +2629,11 @@ msgstr "Ultimo aggiornamento"
 msgid "modulistica"
 msgstr "Modulistica"
 
+#: overrideTranslations
+# defaultMessage: As per the official information architecture outlined in measure 1.4.1, all forms must be properly uploaded in the designated section within Amministrazione > Documenti e Dati > Modulistica, and linked to the relevant service sheet. It is no longer possible to upload files and attachments directly into this container.
+msgid "modulistica_restraint"
+msgstr "Come da architettura informativa ufficiale prevista dalla misura 1.4.1, tutta la modulistica dovrà essere correttamente caricata nella sezione apposita, all'interno di amministrazione, documenti e dati, modulistica, e relazionata con la scheda servizio. Non è più possibile caricare file ed allegati direttamente in questo contenitore."
+
 #: components/ItaliaTheme/View/Commons/DownloadFileFormat
 # defaultMessage: Scarica il file
 msgid "modulo_download_file"

package/locales/volto.pot

@@ -1,7 +1,7 @@
 msgid ""
 msgstr ""
 "Project-Id-Version: Plone\n"
-"POT-Creation-Date: 2024-09-26T08:07:45.909Z\n"
+"POT-Creation-Date: 2024-10-29T14:58:46.664Z\n"
 "Last-Translator: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "Language-Team: Plone i18n <plone-i18n@lists.sourceforge.net>\n"
 "MIME-Version: 1.0\n"
@@ -2631,6 +2631,11 @@ msgstr ""
 msgid "modulistica"
 msgstr ""
 
+#: overrideTranslations
+# defaultMessage: As per the official information architecture outlined in measure 1.4.1, all forms must be properly uploaded in the designated section within Amministrazione > Documenti e Dati > Modulistica, and linked to the relevant service sheet. It is no longer possible to upload files and attachments directly into this container.
+msgid "modulistica_restraint"
+msgstr ""
+
 #: components/ItaliaTheme/View/Commons/DownloadFileFormat
 # defaultMessage: Scarica il file
 msgid "modulo_download_file"

package/package.json

@@ -2,7 +2,7 @@
   "name": "design-comuni-plone-theme",
   "description": "Volto Theme for Italia design guidelines",
   "license": "GPL-v3",
-  "version": "11.24.3",
+  "version": "11.24.5",
   "main": "src/index.js",
   "repository": {
     "type": "git",
@@ -153,7 +153,7 @@
     "volto-editablefooter": "5.1.7",
     "volto-feedback": "0.3.2",
     "volto-form-block": "3.10.0",
-    "volto-gdpr-privacy": "2.2.7",
+    "volto-gdpr-privacy": "2.2.9",
     "volto-google-analytics": "2.0.0",
     "volto-multilingual-widget": "3.2.1",
     "volto-querywidget-with-browser": "0.4.2",

package/publiccode.yml

@@ -20,7 +20,7 @@ logo: docs/logo-io-comune.png
 description:
   it:
     documentation: |-
-      https://docs.google.com/document/d/1SThuxa_ah0BuNXukWs564kKPfprK41WLQE8Mome-0xg/
+      https://docs.google.com/document/d/1BrlGYmE3Z4y6FMIrfBJWOX1P2JVEGzJZS6TRbeIiFSk/edit?tab=t.0
     features:
       - PNRR
       - PNRR/Misura/1.2
@@ -227,9 +227,9 @@ maintenance:
 name: io-Comune - Il sito AgID per Comuni ed Enti Pubblici
 platforms:
   - web
-releaseDate: '2024-10-24'
+releaseDate: '2024-11-22'
 softwareType: standalone/web
-softwareVersion: 11.24.3
+softwareVersion: 11.24.5
 url: 'https://github.com/italia/design-comuni-plone-theme'
 usedBy:
   - ASP Comuni Modenesi Area Nord

package/src/components/ItaliaTheme/Header/HeaderSlim/LoginButton.jsx

@@ -9,7 +9,7 @@ import { Button } from 'design-react-kit';
 const LoginButton = ({ children, baseLoginUrl, size = 'full' }) => {
   return baseLoginUrl ? (
     <Button
-      className="btn-icon"
+      className="btn-icon login-button"
       color="primary"
       href={baseLoginUrl}
       icon={false}

package/src/components/ItaliaTheme/Icons/DesignIcon.jsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useRef, useMemo } from 'react';
+import React, { useState, useEffect } from 'react';
 import { v4 as uuid } from 'uuid';
 import PropTypes from 'prop-types';
 
@@ -12,50 +12,101 @@ const propTypes = {
 
 const defaultProps = {
   color: '',
-  size: '',
+  size: '24px',
   icon: '',
   padding: false,
 };
 
+// No ts means we get many different things here, standardize it
+const SIZE_MAPPINGS = {
+  xs: '1rem',
+  sm: '1.25rem',
+  md: defaultProps.size,
+  lg: '1.75rem',
+  xl: '2rem',
+};
+
+function getIconMapSizeConfig(size) {
+  const mapKeys = Object.keys(SIZE_MAPPINGS);
+  if (mapKeys.includes(size)) return SIZE_MAPPINGS[size];
+  return size;
+}
+
+const iconCache = new Map(); // Global cache using Map
+
 const Icon = ({ icon, title, className, size }) => {
-  const ImportedIconRef = useRef(null);
-  const [loading, setLoading] = useState(false);
-  const iconID = useMemo(() => uuid(), []);
+  const [iconState, setIconState] = useState({
+    loading: true,
+    icon: undefined,
+    // Move to useId in react18
+    id: uuid(),
+  });
 
   useEffect(() => {
-    setLoading(true);
-    const importIcon = async () => {
-      try {
-        const { default: namedImport } = await import(
-          `bootstrap-italia/src/svg/${icon}.svg`
-        );
-        ImportedIconRef.current = namedImport;
-      } catch (err) {
-        throw err;
-      } finally {
-        setLoading(false);
-      }
-    };
-    importIcon();
+    let loadableIcon = iconCache.get(icon);
+    // Use the cached icon if available
+    if (loadableIcon) {
+      setIconState((prev) => ({
+        ...prev,
+        loading: false,
+        icon: loadableIcon,
+      }));
+    } else {
+      // Otherwise, dynamically import the icon
+      const importIcon = async () => {
+        try {
+          const { default: namedImport } = await import(
+            `bootstrap-italia/src/svg/${icon}.svg`
+          );
+          iconCache.set(icon, namedImport); // Cache the imported icon
+          loadableIcon = namedImport;
+        } catch (err) {
+          console.error(`Error loading icon: ${icon}`, err);
+        } finally {
+          setIconState((prev) => ({
+            ...prev,
+            loading: false,
+            icon: loadableIcon,
+          }));
+        }
+      };
+      importIcon();
+    }
   }, [icon]);
 
-  if (!loading && ImportedIconRef.current) {
-    const { current: name } = ImportedIconRef;
+  const iconSize = getIconMapSizeConfig(size);
+
+  // Placeholder that is shown while the icon is loading
+  if (iconState.loading) {
+    return (
+      <span
+        style={{
+          width: iconSize,
+          height: iconSize,
+          backgroundColor: 'transparent',
+        }}
+        className={className}
+      />
+    );
+  }
+
+  // Render the icon once it's loaded
+  if (iconState.icon) {
     return (
       <svg
-        xmlns={name.attributes?.xmlns}
-        viewBox={name.attributes?.viewBox}
-        width={name.attributes?.width}
-        height={name.attributes?.height}
-        style={{ height: size, width: 'auto' }}
+        xmlns={iconState.icon.attributes?.xmlns}
+        viewBox={iconState.icon.attributes?.viewBox}
+        width={iconState.icon.attributes?.width}
+        height={iconState.icon.attributes?.height}
+        style={{ height: iconSize, width: iconSize }}
         className={className}
         aria-hidden="true"
         dangerouslySetInnerHTML={{
           __html: title
-            ? `<title id="${iconID}">${title}</title>${name.content}`
-            : name.content,
+            ? `<title id="${iconState.id}">${title}</title>${iconState.icon.content}`
+            : iconState.icon.content,
         }}
-        aria-labelledby={iconID}
+        aria-labelledby={iconState.id}
       />
     );
   }

package/src/components/ItaliaTheme/Icons/FontAwesomeIcon.jsx

@@ -36,12 +36,12 @@ const FontAwesomeIcon = (props) => {
       prefixKey === 'fab'
         ? 'brands'
         : prefixKey === 'far'
-          ? 'regular'
-          : prefixKey === 'fas'
-            ? 'solid'
-            : prefixKey != null
-              ? prefixKey
-              : 'solid',
+        ? 'regular'
+        : prefixKey === 'fas'
+        ? 'solid'
+        : prefixKey != null
+        ? prefixKey
+        : 'solid',
       iconName,
     ];
   };

package/src/components/ItaliaTheme/Icons/Icon.jsx

@@ -12,6 +12,7 @@ import { FontAwesomeIcon } from 'design-comuni-plone-theme/components/ItaliaThem
 
 const Icon = (props) => {
   const { icon, className, color, size, padding, ...rest } = props;
+
   if (icon) {
     const classes = classNames(
       'icon',

package/src/components/ItaliaTheme/View/Commons/PageHeader/PageHeaderEventDates.jsx

@@ -83,9 +83,7 @@ const PageHeaderEventDates = ({ content, moment, rrule }) => {
         !openEnd &&
         !renderOnlyStart &&
         `dal ${Moment(content.start).format('DD-MM-Y')} al ${endDate}`}
-      {(wholeDay ||
-        renderOnlyStart ||
-        Moment(content.end).isSame(actualEndDate)) &&
+      {(renderOnlyStart || Moment(content.end).isSame(actualEndDate)) &&
         !openEnd &&
         `${Moment(content.start).format('DD-MM-Y')}`}
       {openEnd &&

package/src/components/ItaliaTheme/View/ViewUtils.jsx

@@ -67,9 +67,8 @@ export const useSideMenu = (content, documentBody) => {
     }
     if (observer) {
       observer.observe(documentBody.current, {
-        //attributes: true,
         childList: true,
-        subtree: true,
+        //subtree: true, //commentato, perchè a noi interessano solo i figli di primo livello. Con questo abilitato, se in pagina ci sono delle gallery si impalla il browser
       });
     }
     return () => {

package/src/customizations/volto/components/manage/Contents/ContentsUploadModal.jsx

@@ -0,0 +1,373 @@
+// CUSTOMIZATION:
+// - 196-202 - 230-262: added file upload restraint message as per agid regulations
+
+/**
+ * Contents upload modal.
+ * @module components/manage/Contents/ContentsUploadModal
+ */
+
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { connect } from 'react-redux';
+import { compose } from 'redux';
+import {
+  Button,
+  Dimmer,
+  Header,
+  Icon,
+  Image,
+  Loader,
+  Modal,
+  Table,
+  Segment,
+  TableCell,
+} from 'semantic-ui-react';
+import loadable from '@loadable/component';
+import { concat, filter, map } from 'lodash';
+import filesize from 'filesize';
+import { readAsDataURL } from 'promise-file-reader';
+import { FormattedMessage, defineMessages, injectIntl } from 'react-intl';
+import { FormattedRelativeDate } from '@plone/volto/components';
+import { createContent, getTypes } from '@plone/volto/actions';
+import { validateFileUploadSize, getBaseUrl } from '@plone/volto/helpers';
+
+const Dropzone = loadable(() => import('react-dropzone'));
+
+const messages = defineMessages({
+  cancel: {
+    id: 'Cancel',
+    defaultMessage: 'Cancel',
+  },
+  upload: {
+    id: '{count, plural, one {Upload {count} file} other {Upload {count} files}}',
+    defaultMessage:
+      '{count, plural, one {Upload {count} file} other {Upload {count} files}}',
+  },
+});
+
+const SUBREQUEST = 'batch-upload';
+
+/**
+ * ContentsUploadModal class.
+ * @class ContentsUploadModal
+ * @extends Component
+ */
+class ContentsUploadModal extends Component {
+  /**
+   * Property types.
+   * @property {Object} propTypes Property types.
+   * @static
+   */
+  static propTypes = {
+    createContent: PropTypes.func.isRequired,
+    pathname: PropTypes.string.isRequired,
+    request: PropTypes.shape({
+      loading: PropTypes.bool,
+      loaded: PropTypes.bool,
+    }).isRequired,
+    open: PropTypes.bool.isRequired,
+    onOk: PropTypes.func.isRequired,
+    onCancel: PropTypes.func.isRequired,
+    getTypes: PropTypes.func,
+  };
+
+  /**
+   * Constructor
+   * @method constructor
+   * @param {Object} props Component properties
+   * @constructs ContentsUploadModal
+   */
+  constructor(props) {
+    super(props);
+    this.onRemoveFile = this.onRemoveFile.bind(this);
+    this.onDrop = this.onDrop.bind(this);
+    this.onCancel = this.onCancel.bind(this);
+    this.onSubmit = this.onSubmit.bind(this);
+    this.state = {
+      files: [],
+    };
+  }
+
+  /**
+   * Component will receive props
+   * @method componentWillReceiveProps
+   * @param {Object} nextProps Next properties
+   * @returns {undefined}
+   */
+  UNSAFE_componentWillReceiveProps(nextProps) {
+    if (this.props.request.loading && nextProps.request.loaded) {
+      this.props.onOk();
+      this.setState({
+        files: [],
+      });
+    }
+  }
+
+  /**
+   * Remove file handler
+   * @method onRemoveFile
+   * @param {Object} event Event object
+   * @returns {undefined}
+   */
+  onRemoveFile(event) {
+    this.setState({
+      files: filter(
+        this.state.files,
+        (file, index) =>
+          index !== parseInt(event.target.getAttribute('value'), 10),
+      ),
+    });
+  }
+
+  /**
+   * Drop handler
+   * @method onDrop
+   * @param {array} files File objects
+   * @returns {undefined}
+   */
+  onDrop = async (files) => {
+    const validFiles = [];
+    for (let i = 0; i < files.length; i++) {
+      if (validateFileUploadSize(files[i], this.props.intl.formatMessage)) {
+        await readAsDataURL(files[i]).then((data) => {
+          const fields = data.match(/^data:(.*);(.*),(.*)$/);
+          files[i].preview = fields[0];
+        });
+        validFiles.push(files[i]);
+      }
+    }
+    this.setState({
+      files: concat(this.state.files, validFiles),
+    });
+  };
+
+  /**
+   * Cancel handler
+   * @method onCancel
+   * @returns {undefined}
+   */
+  onCancel() {
+    this.props.onCancel();
+    this.setState({
+      files: [],
+    });
+  }
+
+  /**
+   * Submit handler
+   * @method onSubmit
+   * @returns {undefined}
+   */
+  onSubmit() {
+    Promise.all(map(this.state.files, (file) => readAsDataURL(file))).then(
+      (files) => {
+        this.props.createContent(
+          this.props.pathname,
+          map(this.state.files, (file, index) => {
+            const fields = files[index].match(/^data:(.*);(.*),(.*)$/);
+            const image = fields[1].split('/')[0] === 'image';
+            return {
+              '@type': image ? 'Image' : 'File',
+              title: file.name,
+              [image ? 'image' : 'file']: {
+                data: fields[3],
+                encoding: fields[2],
+                'content-type': fields[1],
+                filename: file.name,
+              },
+            };
+          }),
+          SUBREQUEST,
+        );
+      },
+    );
+  }
+
+  componentDidMount() {
+    this.props.getTypes(getBaseUrl(this.props.pathname));
+  }
+
+  /**
+   * Render method.
+   * @method render
+   * @returns {string} Markup for the component.
+   */
+  render() {
+    // as per agid guidelines, files cannot be uploaded in modulistica folder inside ct servizio
+    // show restraint and hide upload button when page is called modulistica and when there's a restraint
+    // this is enough to identify this only case bc even if another page is called 'modulistica', it will have 'File'
+    // as addable type
+    const showFileRestraint =
+      this.props.pathname.includes('modulistica') &&
+      !this.props.types.some((type) => type.id === 'File');
+
+    return (
+      this.props.open && (
+        <Modal open={this.props.open}>
+          <Header>
+            <FormattedMessage id="Upload files" defaultMessage="Upload files" />
+          </Header>
+          <Dimmer active={this.props.request.loading}>
+            <Loader>
+              <FormattedMessage
+                id="Uploading files"
+                defaultMessage="Uploading files"
+              />
+            </Loader>
+          </Dimmer>
+          <Modal.Content>
+            <Dropzone
+              onDrop={this.onDrop}
+              className="dropzone"
+              noDragEventsBubbling={true}
+              multiple={true}
+            >
+              {({ getRootProps, getInputProps }) => (
+                <div {...getRootProps({ className: 'dashed' })}>
+                  <Segment>
+                    <Table basic="very">
+                      <Table.Body>
+                        {showFileRestraint ? (
+                          <Table.Row>
+                            <TableCell>
+                              <FormattedMessage
+                                id="modulistica_restraint"
+                                defaultMessage="As per the official information architecture outlined in measure 1.4.1, all forms must be properly uploaded in the designated section within Amministrazione > Documenti e Dati > Modulistica, and linked to the relevant service sheet. It is no longer possible to upload files and attachments directly into this container."
+                              />
+                            </TableCell>
+                          </Table.Row>
+                        ) : (
+                          <Table.Row>
+                            <Table.Cell>
+                              <FormattedMessage
+                                id="Drag and drop files from your computer onto this area or click the “Browse” button."
+                                defaultMessage="Drag and drop files from your computer onto this area or click the “Browse” button."
+                              />
+                            </Table.Cell>
+                            <Table.Cell>
+                              <Button className="ui button primary">
+                                <FormattedMessage
+                                  id="Browse"
+                                  defaultMessage="Browse"
+                                />
+                              </Button>
+                              <input
+                                {...getInputProps({
+                                  type: 'file',
+                                  style: { display: 'none' },
+                                })}
+                              />
+                            </Table.Cell>
+                          </Table.Row>
+                        )}
+                      </Table.Body>
+                    </Table>
+                  </Segment>
+                </div>
+              )}
+            </Dropzone>
+            {this.state.files.length > 0 && (
+              <Table compact singleLine>
+                <Table.Header>
+                  <Table.Row>
+                    <Table.HeaderCell width={8}>
+                      <FormattedMessage
+                        id="Filename"
+                        defaultMessage="Filename"
+                      />
+                    </Table.HeaderCell>
+                    <Table.HeaderCell width={4}>
+                      <FormattedMessage
+                        id="Last modified"
+                        defaultMessage="Last modified"
+                      />
+                    </Table.HeaderCell>
+                    <Table.HeaderCell width={4}>
+                      <FormattedMessage
+                        id="File size"
+                        defaultMessage="File size"
+                      />
+                    </Table.HeaderCell>
+                    <Table.HeaderCell width={4}>
+                      <FormattedMessage id="Preview" defaultMessage="Preview" />
+                    </Table.HeaderCell>
+                    <Table.HeaderCell />
+                  </Table.Row>
+                </Table.Header>
+                <Table.Body>
+                  {map(this.state.files, (file, index) => (
+                    <Table.Row className="upload-row" key={file.name}>
+                      <Table.Cell>{file.name}</Table.Cell>
+                      <Table.Cell>
+                        {file.lastModifiedDate && (
+                          <FormattedRelativeDate date={file.lastModifiedDate} />
+                        )}
+                      </Table.Cell>
+                      <Table.Cell>
+                        {filesize(file.size, { round: 0 })}
+                      </Table.Cell>
+                      <Table.Cell>
+                        {file.type.split('/')[0] === 'image' && (
+                          <Image src={file.preview} height={60} />
+                        )}
+                      </Table.Cell>
+                      <Table.Cell>
+                        <Icon
+                          name="close"
+                          value={index}
+                          link
+                          onClick={this.onRemoveFile}
+                        />
+                      </Table.Cell>
+                    </Table.Row>
+                  ))}
+                </Table.Body>
+              </Table>
+            )}
+          </Modal.Content>
+          <Modal.Actions>
+            {this.state.files.length > 0 && (
+              <Button
+                basic
+                circular
+                primary
+                floated="right"
+                icon="arrow right"
+                aria-label={this.props.intl.formatMessage(messages.upload, {
+                  count: this.state.files.length,
+                })}
+                onClick={this.onSubmit}
+                title={this.props.intl.formatMessage(messages.upload, {
+                  count: this.state.files.length,
+                })}
+                size="big"
+              />
+            )}
+            <Button
+              basic
+              circular
+              secondary
+              icon="remove"
+              aria-label={this.props.intl.formatMessage(messages.cancel)}
+              title={this.props.intl.formatMessage(messages.cancel)}
+              floated="right"
+              size="big"
+              onClick={this.onCancel}
+            />
+          </Modal.Actions>
+        </Modal>
+      )
+    );
+  }
+}
+
+export default compose(
+  injectIntl,
+  connect(
+    (state) => ({
+      request: state.content.subrequests?.[SUBREQUEST] || {},
+      types: filter(state.types.types, 'addable'),
+    }),
+    { createContent, getTypes },
+  ),
+)(ContentsUploadModal);

package/src/overrideTranslations.jsx

@@ -94,4 +94,9 @@ defineMessages({
     id: 'form_limit',
     defaultMessage: 'Submission limit',
   },
+  modulistica_restraint: {
+    id: 'modulistica_restraint',
+    defaultMessage:
+      'As per the official information architecture outlined in measure 1.4.1, all forms must be properly uploaded in the designated section within Amministrazione > Documenti e Dati > Modulistica, and linked to the relevant service sheet. It is no longer possible to upload files and attachments directly into this container.',
+  },
 });

package/src/theme/ItaliaTheme/_main.scss

@@ -152,6 +152,37 @@ iframe {
         font-weight: 700;
       }
     }
+    /*
+      Safari rendering issue workaround - B#60364
+      Safari rendering fix, icons and fonts coming late means shenanigans for Safari rendering, as
+      Safari is lazy and slow in loading fonts and icons dynamically.
+      Problem: Safari (tested on Safari 17.6) sometimes fails to calculate the layout correctly
+      when dealing with dynamic content such as lazy-loaded icons or fonts, combined with
+      `display: inline-block`. This can result in improperly positioned elements
+      until the page is re-rendered or refocused.
+
+      Solution: To fix this issue:
+      1. Replace `display: inline-block` with `display: inline-flex`. This ensures Safari
+          handles the box model and inline context properly, especially when the element's
+          size or alignment depends on dynamic content.
+      2. Add `position: relative;` to force a recalculation of layout, resolving rendering quirks.
+
+      Background: Safari's WebKit engine has known issues with `inline-block` combined
+      with delayed content rendering, such as lazy-loaded icons. Switching to `inline-flex`
+      better aligns with modern CSS rendering engines, while `position: relative;`
+      ensures the layout is recalculated.
+
+      References:
+      - CSS-Tricks: What Forces Layout or Reflow: https://css-tricks.com/what-forces-layout-reflow/
+      - WebKit Bug Reports on `inline-block` rendering issues with dynamic content.
+      - Testing and observations on Safari 17.6 behavior with lazy-loaded assets.
+    */
+    @supports (-webkit-appearance: none) {
+      a {
+        display: inline-flex; /* Evita problemi con inline-block */
+        position: relative; /* Forza Safari a calcolare il layout reflow correttamente */
+      }
+    }
   }
 
   div[class^='draftJsToolbar__toolbar__'] {
@@ -381,3 +412,13 @@ iframe {
     }
   }
 }
+
+.public-ui
+  .it-header-slim-wrapper
+  .it-header-slim-wrapper-content
+  .it-header-slim-right-zone.header-slim-right-zone
+  .login-button {
+  @media (min-width: #{map-get($grid-breakpoints, md)}) and (max-width:#{map-get($grid-breakpoints, xl)}) {
+    flex: unset;
+  }
+}