diff --git a/CHANGELOG.md b/CHANGELOG.md index 5d418d078..89ae718ee 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,32 @@ +## [11.8.0](https://github.com/redturtle/design-comuni-plone-theme/compare/v11.7.0...v11.8.0) (2024-03-19) + + +### Features + +* added download link to filename in file widget ([#587](https://github.com/redturtle/design-comuni-plone-theme/issues/587)) ([96649e2](https://github.com/redturtle/design-comuni-plone-theme/commit/96649e29e79a7b71bf93a27406baa4fc1994a213)) +* print styles for UO ([#581](https://github.com/redturtle/design-comuni-plone-theme/issues/581)) ([91b4752](https://github.com/redturtle/design-comuni-plone-theme/commit/91b47526b69b0957eba6c8e803798f4b3ffcf9bb)) +* TextWidget to add alt text to image ([#573](https://github.com/redturtle/design-comuni-plone-theme/issues/573)) ([d183f27](https://github.com/redturtle/design-comuni-plone-theme/commit/d183f2749a2604ebecb0f0df09ec8770d84c7f59)) +* updated volto-form-block with email validation ([#596](https://github.com/redturtle/design-comuni-plone-theme/issues/596)) ([c21f65b](https://github.com/redturtle/design-comuni-plone-theme/commit/c21f65bc7e54d2fa092ae4bcfbfd1c99670cab5c)) + + +### Bug Fixes + +* link in header doesn't change color when inside cms-ui ([#583](https://github.com/redturtle/design-comuni-plone-theme/issues/583)) ([d076b0a](https://github.com/redturtle/design-comuni-plone-theme/commit/d076b0a540cf3de3c9f7f08cefca27eff3917f70)) +* updated volto-querywidget-with-browser to fix infinite loops on lost reference ([#599](https://github.com/redturtle/design-comuni-plone-theme/issues/599)) ([c6d4cb6](https://github.com/redturtle/design-comuni-plone-theme/commit/c6d4cb6b51447514fedf2938f40031e42779644e)) +* view form block ([5ff7ea7](https://github.com/redturtle/design-comuni-plone-theme/commit/5ff7ea70474963e3dca126a44d531cc4dc17be74)) + + +### Maintenance + +* updated volto-form-block to fix view form ([80a6586](https://github.com/redturtle/design-comuni-plone-theme/commit/80a6586ac7d458c46efe51bcc4fa4a9cb3b8d619)) + + +### Documentation + +* updated publiccode and release log ([3c52c12](https://github.com/redturtle/design-comuni-plone-theme/commit/3c52c12edfed3c12a4fdac212b9f229644bf913f)) + ## [11.7.0](https://github.com/redturtle/design-comuni-plone-theme/compare/v11.6.2...v11.7.0) (2024-03-15) diff --git a/RELEASE.md b/RELEASE.md index 053d81cd9..d3088ad62 100644 --- a/RELEASE.md +++ b/RELEASE.md @@ -46,6 +46,16 @@ ### Migliorie - Migliorata l'accessibilità del blocco Icone. +## Versione 11.8.0 (19/03/2024) + +### Migliorie + +- Gli stili del tipo di contenuto Unità Organizzativa sono stati ottimizzati per la stampa. + +### Novità + +- È possibile scaricare il file o l'immagine caricata dal widget di upload file cliccando sul nome del file stesso. +- È possibile aggiungere un testo alternativo per l'immagine del blocco Card con Immagine. ## Versione 11.7.0 (15/03/2024) diff --git a/locales/de/LC_MESSAGES/volto.po b/locales/de/LC_MESSAGES/volto.po index 986324175..35af469fd 100644 --- a/locales/de/LC_MESSAGES/volto.po +++ b/locales/de/LC_MESSAGES/volto.po @@ -778,6 +778,11 @@ msgstr "" msgid "allegati" msgstr "" +#: components/ItaliaTheme/Blocks/TextCard/CardWithImage/Sidebar +# defaultMessage: Testo alternativo per l'immagine +msgid "altText" +msgstr "" + #: components/ItaliaTheme/View/PersonaView/PersonaDocumenti # defaultMessage: Altre cariche msgid "altre_cariche" diff --git a/locales/en/LC_MESSAGES/volto.po b/locales/en/LC_MESSAGES/volto.po index 6a0c569ee..7a22d634d 100644 --- a/locales/en/LC_MESSAGES/volto.po +++ b/locales/en/LC_MESSAGES/volto.po @@ -763,6 +763,11 @@ msgstr "All topics" msgid "allegati" msgstr "Attached documents" +#: components/ItaliaTheme/Blocks/TextCard/CardWithImage/Sidebar +# defaultMessage: Testo alternativo per l'immagine +msgid "altText" +msgstr "" + #: components/ItaliaTheme/View/PersonaView/PersonaDocumenti # defaultMessage: Altre cariche msgid "altre_cariche" diff --git a/locales/es/LC_MESSAGES/volto.po b/locales/es/LC_MESSAGES/volto.po index af0188c2f..45dab89cb 100644 --- a/locales/es/LC_MESSAGES/volto.po +++ b/locales/es/LC_MESSAGES/volto.po @@ -772,6 +772,11 @@ msgstr "Todos los temas" msgid "allegati" msgstr "Documentos adjuntos" +#: components/ItaliaTheme/Blocks/TextCard/CardWithImage/Sidebar +# defaultMessage: Testo alternativo per l'immagine +msgid "altText" +msgstr "" + #: components/ItaliaTheme/View/PersonaView/PersonaDocumenti # defaultMessage: Altre cariche msgid "altre_cariche" diff --git a/locales/fr/LC_MESSAGES/volto.po b/locales/fr/LC_MESSAGES/volto.po index 93196a701..0b105fceb 100644 --- a/locales/fr/LC_MESSAGES/volto.po +++ b/locales/fr/LC_MESSAGES/volto.po @@ -780,6 +780,11 @@ msgstr "Tous les sujets" msgid "allegati" msgstr "Documents attachés" +#: components/ItaliaTheme/Blocks/TextCard/CardWithImage/Sidebar +# defaultMessage: Testo alternativo per l'immagine +msgid "altText" +msgstr "" + #: components/ItaliaTheme/View/PersonaView/PersonaDocumenti # defaultMessage: Altre cariche msgid "altre_cariche" diff --git a/locales/it/LC_MESSAGES/volto.po b/locales/it/LC_MESSAGES/volto.po index e1d3de2d7..b53d4f229 100644 --- a/locales/it/LC_MESSAGES/volto.po +++ b/locales/it/LC_MESSAGES/volto.po @@ -763,6 +763,11 @@ msgstr "Tutti gli argomenti" msgid "allegati" msgstr "Documenti allegati" +#: components/ItaliaTheme/Blocks/TextCard/CardWithImage/Sidebar +# defaultMessage: Testo alternativo per l'immagine +msgid "altText" +msgstr "" + #: components/ItaliaTheme/View/PersonaView/PersonaDocumenti # defaultMessage: Altre cariche msgid "altre_cariche" diff --git a/locales/volto.pot b/locales/volto.pot index 845d7b47d..dd3f2d722 100644 --- a/locales/volto.pot +++ b/locales/volto.pot @@ -1,7 +1,7 @@ msgid "" msgstr "" "Project-Id-Version: Plone\n" -"POT-Creation-Date: 2024-03-06T10:48:38.114Z\n" +"POT-Creation-Date: 2024-03-07T15:23:38.346Z\n" "Last-Translator: Plone i18n \n" "Language-Team: Plone i18n \n" "MIME-Version: 1.0\n" @@ -765,6 +765,11 @@ msgstr "" msgid "allegati" msgstr "" +#: components/ItaliaTheme/Blocks/TextCard/CardWithImage/Sidebar +# defaultMessage: Testo alternativo per l'immagine +msgid "altText" +msgstr "" + #: components/ItaliaTheme/View/PersonaView/PersonaDocumenti # defaultMessage: Altre cariche msgid "altre_cariche" diff --git a/package.json b/package.json index 2d21bbb80..4ee5146e9 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.7.0", + "version": "11.8.0", "main": "src/index.js", "keywords": [ "volto-addon", @@ -146,11 +146,11 @@ "volto-dropdownmenu": "4.1.1", "volto-editablefooter": "5.1.0", "volto-feedback": "0.3.0", - "volto-form-block": "3.5.2", + "volto-form-block": "3.7.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.1", + "volto-querywidget-with-browser": "0.4.2", "volto-rss-block": "3.0.0", "volto-secondarymenu": "4.0.0", "volto-social-settings": "3.0.0", diff --git a/publiccode.yml b/publiccode.yml index e8acbf330..9e163a351 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: '2024-03-15' +releaseDate: '2024-03-19' softwareType: standalone/web -softwareVersion: 11.7.0 +softwareVersion: 11.8.0 url: 'https://github.com/italia/design-comuni-plone-theme' usedBy: - ASP Comuni Modenesi Area Nord diff --git a/src/components/ItaliaTheme/Blocks/TextCard/CardWithImage/Block.jsx b/src/components/ItaliaTheme/Blocks/TextCard/CardWithImage/Block.jsx index c1f084b73..5857eb02c 100644 --- a/src/components/ItaliaTheme/Blocks/TextCard/CardWithImage/Block.jsx +++ b/src/components/ItaliaTheme/Blocks/TextCard/CardWithImage/Block.jsx @@ -24,7 +24,7 @@ const messages = defineMessages({ }, }); -const renderImage = (image, showImage, sizeNatural) => +const renderImage = (image, showImage, sizeNatural, altText = '') => showImage && image ? (
@@ -117,7 +117,12 @@ const Block = ({ > {hasImage && ( - {renderImage(data?.image, hasImage, data?.sizeNatural)} + {renderImage( + data?.image, + hasImage, + data?.sizeNatural, + data?.altText, + )} )}
- {renderImage(data?.image, hasImage, data?.sizeNatural)} + {renderImage( + data?.image, + hasImage, + data?.sizeNatural, + data?.altText, + )}
{ @@ -105,6 +110,14 @@ const Sidebar = ({ data, block, onChangeBlock }) => { value={data.sizeImage || 's'} /> + { + onChangeBlock({ ...data, altText: value }); + }} + /> diff --git a/src/customizations/volto/components/manage/Widgets/FileWidget.jsx b/src/customizations/volto/components/manage/Widgets/FileWidget.jsx new file mode 100644 index 000000000..0b879046a --- /dev/null +++ b/src/customizations/volto/components/manage/Widgets/FileWidget.jsx @@ -0,0 +1,232 @@ +// CUSTOMIZATION: +// - 177-179: Added link to download uploaded file + +/** + * FileWidget component. + * @module components/manage/Widgets/FileWidget + */ + +import React from 'react'; +import PropTypes from 'prop-types'; +import { Button, Image, Dimmer } from 'semantic-ui-react'; +import { readAsDataURL } from 'promise-file-reader'; +import { injectIntl } from 'react-intl'; +import deleteSVG from '@plone/volto/icons/delete.svg'; +import { Icon, FormFieldWrapper, UniversalLink } from '@plone/volto/components'; +import loadable from '@loadable/component'; +import { flattenToAppURL, validateFileUploadSize } from '@plone/volto/helpers'; +import { defineMessages, useIntl } from 'react-intl'; + +const imageMimetypes = [ + 'image/png', + 'image/jpeg', + 'image/webp', + 'image/jpg', + 'image/gif', + 'image/svg+xml', +]; +const Dropzone = loadable(() => import('react-dropzone')); + +const messages = defineMessages({ + releaseDrag: { + id: 'Drop files here ...', + defaultMessage: 'Drop files here ...', + }, + editFile: { + id: 'Drop file here to replace the existing file', + defaultMessage: 'Drop file here to replace the existing file', + }, + fileDrag: { + id: 'Drop file here to upload a new file', + defaultMessage: 'Drop file here to upload a new file', + }, + replaceFile: { + id: 'Replace existing file', + defaultMessage: 'Replace existing file', + }, + addNewFile: { + id: 'Choose a file', + defaultMessage: 'Choose a file', + }, +}); + +/** + * FileWidget component class. + * @function FileWidget + * @returns {string} Markup of the component. + * + * To use it, in schema properties, declare a field like: + * + * ```jsx + * { + * title: "File", + * widget: 'file', + * } + * ``` + * or: + * + * ```jsx + * { + * title: "File", + * type: 'object', + * } + * ``` + * + */ +const FileWidget = (props) => { + const { id, value, onChange, isDisabled } = props; + const [fileType, setFileType] = React.useState(false); + const intl = useIntl(); + + React.useEffect(() => { + if (value && imageMimetypes.includes(value['content-type'])) { + setFileType(true); + } + }, [value]); + + const imgsrc = value?.download + ? `${flattenToAppURL(value?.download)}?id=${Date.now()}` + : null || value?.data + ? `data:${value['content-type']};${value.encoding},${value.data}` + : null; + + /** + * Drop handler + * @method onDrop + * @param {array} files File objects + * @returns {undefined} + */ + const onDrop = (files) => { + const file = files[0]; + if (!validateFileUploadSize(file, intl.formatMessage)) return; + readAsDataURL(file).then((data) => { + const fields = data.match(/^data:(.*);(.*),(.*)$/); + onChange(id, { + data: fields[3], + encoding: fields[2], + 'content-type': fields[1], + filename: file.name, + }); + }); + + let reader = new FileReader(); + reader.onload = function () { + const fields = reader.result.match(/^data:(.*);(.*),(.*)$/); + if (imageMimetypes.includes(fields[1])) { + setFileType(true); + let imagePreview = document.getElementById(`field-${id}-image`); + imagePreview.src = reader.result; + } else { + setFileType(false); + } + }; + reader.readAsDataURL(files[0]); + }; + + return ( + + + {({ getRootProps, getInputProps, isDragActive }) => ( +
+ {isDragActive && } + {fileType ? ( + + ) : ( +
+ {isDragActive ? ( +

+ {intl.formatMessage(messages.releaseDrag)} +

+ ) : value ? ( +

+ {intl.formatMessage(messages.editFile)} +

+ ) : ( +

+ {intl.formatMessage(messages.fileDrag)} +

+ )} +
+ )} + + + +
+ )} + +
+ {value && ( + + {value.filename} + + )} + {value && ( + + )} +
+ + ); +}; + +/** + * Property types. + * @property {Object} propTypes Property types. + * @static + */ +FileWidget.propTypes = { + id: PropTypes.string.isRequired, + title: PropTypes.string.isRequired, + description: PropTypes.string, + required: PropTypes.bool, + error: PropTypes.arrayOf(PropTypes.string), + value: PropTypes.shape({ + '@type': PropTypes.string, + title: PropTypes.string, + }), + onChange: PropTypes.func.isRequired, + wrapped: PropTypes.bool, +}; + +/** + * Default properties. + * @property {Object} defaultProps Default properties. + * @static + */ +FileWidget.defaultProps = { + description: null, + required: false, + error: [], + value: null, +}; + +export default injectIntl(FileWidget); diff --git a/src/theme/ItaliaTheme/Print/_all_pages.scss b/src/theme/ItaliaTheme/Print/_all_pages.scss index 1cdcfd817..c2b5126bf 100644 --- a/src/theme/ItaliaTheme/Print/_all_pages.scss +++ b/src/theme/ItaliaTheme/Print/_all_pages.scss @@ -174,6 +174,9 @@ display: none; } } + .leaflet-container { + break-inside: avoid; + } #contenuti-correlati { display: none; diff --git a/src/theme/ItaliaTheme/Print/_uo.scss b/src/theme/ItaliaTheme/Print/_uo.scss new file mode 100644 index 000000000..98d52c025 --- /dev/null +++ b/src/theme/ItaliaTheme/Print/_uo.scss @@ -0,0 +1,88 @@ +.contenttype-unitaorganizzativa { + @media print { + .documentDescription { + font-size: 1rem; + } + + .card-wrapper { + padding-bottom: 0px; + &.card-teaser-wrapper { + margin: 0px; + &.row, + & { + --bs-gutter-y: 0px !important; + + .card { + border: none !important; + &.card-big-io-comune .card-body { + padding: 0px !important; + + .category-top { + display: none; + } + + .card-title a { + font-size: 16px; + display: flex; + + &::before { + content: '•'; + display: block; + margin-right: 5px; + } + } + } + + .avatar { + display: none; + } + + &.p-3, + &.p-4 { + padding: 0px !important; + } + + &.my-3 { + margin-top: 0px !important; + margin-bottom: 0px !important; + } + + &:after { + display: none; + } + + &.shadow-sm { + box-shadow: none !important; + } + } + } + } + } + + .ruolo-persone-struttura { + .card .card-body { + .card-title { + margin-bottom: 0px !important; + } + .card-text { + padding-top: 0px; + } + + h4 { + &.card-title { + & + .card-text { + padding-top: 0px; + } + } + } + } + .mb-3 { + margin-bottom: 6px !important; + } + } + + .anchor-offset:before { + display: none; + } + } +} diff --git a/src/theme/_cms-ui.scss b/src/theme/_cms-ui.scss index b4209fd67..fe3cf30ce 100644 --- a/src/theme/_cms-ui.scss +++ b/src/theme/_cms-ui.scss @@ -108,7 +108,7 @@ body.cms-ui { } } - .public-ui { + .public-ui:not(:has(.it-header-wrapper)) { a:not(.btn) { color: $link-color; } diff --git a/src/theme/site.scss b/src/theme/site.scss index 2703fc96c..eb25da48f 100644 --- a/src/theme/site.scss +++ b/src/theme/site.scss @@ -139,6 +139,7 @@ @import 'ItaliaTheme/Print/persona'; @import 'ItaliaTheme/Print/event'; @import 'ItaliaTheme/Print/servizio'; +@import 'ItaliaTheme/Print/uo'; @import 'ItaliaTheme/Print/blocks'; @import 'addonsThemeCustomizationsMain'; diff --git a/yarn.lock b/yarn.lock index fa26d7336..243f8d55d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6576,11 +6576,11 @@ __metadata: volto-dropdownmenu: 4.1.1 volto-editablefooter: 5.1.0 volto-feedback: 0.3.0 - volto-form-block: 3.5.2 + volto-form-block: 3.7.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.1 + volto-querywidget-with-browser: 0.4.2 volto-rss-block: 3.0.0 volto-secondarymenu: 4.0.0 volto-social-settings: 3.0.0 @@ -14355,9 +14355,9 @@ __metadata: languageName: node linkType: hard -"volto-form-block@npm:3.5.2": - version: 3.5.2 - resolution: "volto-form-block@npm:3.5.2" +"volto-form-block@npm:3.7.0": + version: 3.7.0 + resolution: "volto-form-block@npm:3.7.0" dependencies: "@hcaptcha/react-hcaptcha": ^0.3.6 file-saver: ^2.0.5 @@ -14366,7 +14366,7 @@ __metadata: peerDependencies: "@plone/volto": ">=16.0.0-alpha.38" volto-subblocks: ^2.0.0 - checksum: 8154132d440df4cd6d240fb4b913607890ca9128fae7b9efc7d2037bf47fbe0007cab51cc009fca14793db5dc38b18432383e5b491d0d9aeb56ab89cf65942df + checksum: c2289a75f34027be1f8fb6f8a69628f9dfc4b773ed757cad83be7a0f42259e3efdac56d5c17dbaca98aff772abc6a1cff8edaef766fe395ad18270cb36f2cf98 languageName: node linkType: hard @@ -14402,12 +14402,12 @@ __metadata: languageName: node linkType: hard -"volto-querywidget-with-browser@npm:0.4.1": - version: 0.4.1 - resolution: "volto-querywidget-with-browser@npm:0.4.1" +"volto-querywidget-with-browser@npm:0.4.2": + version: 0.4.2 + resolution: "volto-querywidget-with-browser@npm:0.4.2" peerDependencies: "@plone/volto": ^17.0.0 - checksum: a01eacb7fa67561066f288c7ba18f5af177a88deca142f57c33638eb63bc1894d46ac66f01c6d2e3ea4e4f43479b762a63246a08f6600d665174d55d2a49c207 + checksum: 881cede295a8609f1f01d67835533b73f0f8199e3fc2c209f350897b670a40f9c631567dacbbd0db8160a94c36c9b97465e87c2b90a82e2e128619f07658a212 languageName: node linkType: hard