From 069c248ddaf21d86463fc8dcf08d2611bea96aae Mon Sep 17 00:00:00 2001 From: Wagner Trezub <60133113+Wagner3UB@users.noreply.github.com> Date: Thu, 31 Oct 2024 12:50:49 +0100 Subject: [PATCH] feat: added validity dates to Alert block (#795) * fix: condition with has no content * feat: new date schedule for alert block * feat: condition to set visible the alert view * fix: file cleaned * chore: i18n * refact: changes to upgrade the code * refact: class component to function component for View * fix: condition re-thinked * Update src/components/ItaliaTheme/Blocks/Alert/Sidebar.jsx Co-authored-by: Giulia Ghisini <51911425+giuliaghisini@users.noreply.github.com> * Update src/components/ItaliaTheme/Blocks/Alert/Sidebar.jsx Co-authored-by: Giulia Ghisini <51911425+giuliaghisini@users.noreply.github.com> * Update src/components/ItaliaTheme/Blocks/Alert/Sidebar.jsx Co-authored-by: Giulia Ghisini <51911425+giuliaghisini@users.noreply.github.com> * chore: i18n * fix: removed utils * fix: message conditional * fix: removed unnecessary code * chore: i18n * fix: message as default --------- Co-authored-by: Giulia Ghisini <51911425+giuliaghisini@users.noreply.github.com> --- locales/de/LC_MESSAGES/volto.po | 40 +++++ locales/en/LC_MESSAGES/volto.po | 40 +++++ locales/es/LC_MESSAGES/volto.po | 40 +++++ locales/fr/LC_MESSAGES/volto.po | 40 +++++ locales/it/LC_MESSAGES/volto.po | 40 +++++ locales/volto.pot | 42 ++++- .../ItaliaTheme/Blocks/Alert/AlertWrapper.jsx | 89 ++++++++++ .../ItaliaTheme/Blocks/Alert/Edit.jsx | 161 ++++++++---------- .../ItaliaTheme/Blocks/Alert/Sidebar.jsx | 44 ++++- .../ItaliaTheme/Blocks/Alert/View.jsx | 80 ++++----- theme/ItaliaTheme/Blocks/_alert.scss | 12 ++ 11 files changed, 486 insertions(+), 142 deletions(-) create mode 100644 src/components/ItaliaTheme/Blocks/Alert/AlertWrapper.jsx diff --git a/locales/de/LC_MESSAGES/volto.po b/locales/de/LC_MESSAGES/volto.po index 09d96c5a8..62398c545 100644 --- a/locales/de/LC_MESSAGES/volto.po +++ b/locales/de/LC_MESSAGES/volto.po @@ -744,6 +744,46 @@ msgstr "" msgid "advandedSectionsFilters" msgstr "" +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Pubblicazione attiva. +msgid "alert_activeDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. C'è un errore sulle date: la data di scadenza è anteriore alla data d'inizio +msgid "alert_errorDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. E' scaduto il {date}. +msgid "alert_expiredDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. Verà pubblicato il {date} +msgid "alert_futureDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Scadrà il {date} +msgid "alert_willExpire" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Periodo di visualizzazione +msgid "alertblock_dateTitle" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Scadenza +msgid "alertblock_endDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Inizio +msgid "alertblock_startDate" +msgstr "" + #: components/ItaliaTheme/Blocks/IconBlocks/Sidebar # defaultMessage: Centrare i card msgid "alignCards" diff --git a/locales/en/LC_MESSAGES/volto.po b/locales/en/LC_MESSAGES/volto.po index b9ddbf17b..c67fe4797 100644 --- a/locales/en/LC_MESSAGES/volto.po +++ b/locales/en/LC_MESSAGES/volto.po @@ -729,6 +729,46 @@ msgstr "" msgid "advandedSectionsFilters" msgstr "Go to advanced search by sections" +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Pubblicazione attiva. +msgid "alert_activeDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. C'è un errore sulle date: la data di scadenza è anteriore alla data d'inizio +msgid "alert_errorDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. E' scaduto il {date}. +msgid "alert_expiredDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. Verà pubblicato il {date} +msgid "alert_futureDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Scadrà il {date} +msgid "alert_willExpire" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Periodo di visualizzazione +msgid "alertblock_dateTitle" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Scadenza +msgid "alertblock_endDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Inizio +msgid "alertblock_startDate" +msgstr "" + #: components/ItaliaTheme/Blocks/IconBlocks/Sidebar # defaultMessage: Centrare i card msgid "alignCards" diff --git a/locales/es/LC_MESSAGES/volto.po b/locales/es/LC_MESSAGES/volto.po index 4d489f8d7..284f8e067 100644 --- a/locales/es/LC_MESSAGES/volto.po +++ b/locales/es/LC_MESSAGES/volto.po @@ -738,6 +738,46 @@ msgstr "" msgid "advandedSectionsFilters" msgstr "Ir a búsqueda avanzada por secciones" +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Pubblicazione attiva. +msgid "alert_activeDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. C'è un errore sulle date: la data di scadenza è anteriore alla data d'inizio +msgid "alert_errorDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. E' scaduto il {date}. +msgid "alert_expiredDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. Verà pubblicato il {date} +msgid "alert_futureDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Scadrà il {date} +msgid "alert_willExpire" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Periodo di visualizzazione +msgid "alertblock_dateTitle" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Scadenza +msgid "alertblock_endDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Inizio +msgid "alertblock_startDate" +msgstr "" + #: components/ItaliaTheme/Blocks/IconBlocks/Sidebar # defaultMessage: Centrare i card msgid "alignCards" diff --git a/locales/fr/LC_MESSAGES/volto.po b/locales/fr/LC_MESSAGES/volto.po index a6e9758e9..dcdc9a0d5 100644 --- a/locales/fr/LC_MESSAGES/volto.po +++ b/locales/fr/LC_MESSAGES/volto.po @@ -746,6 +746,46 @@ msgstr "" msgid "advandedSectionsFilters" msgstr "Aller à la recherche avancée par rubrique" +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Pubblicazione attiva. +msgid "alert_activeDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. C'è un errore sulle date: la data di scadenza è anteriore alla data d'inizio +msgid "alert_errorDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. E' scaduto il {date}. +msgid "alert_expiredDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. Verà pubblicato il {date} +msgid "alert_futureDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Scadrà il {date} +msgid "alert_willExpire" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Periodo di visualizzazione +msgid "alertblock_dateTitle" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Scadenza +msgid "alertblock_endDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Inizio +msgid "alertblock_startDate" +msgstr "" + #: components/ItaliaTheme/Blocks/IconBlocks/Sidebar # defaultMessage: Centrare i card msgid "alignCards" diff --git a/locales/it/LC_MESSAGES/volto.po b/locales/it/LC_MESSAGES/volto.po index 9b6992b3b..52336cbf7 100644 --- a/locales/it/LC_MESSAGES/volto.po +++ b/locales/it/LC_MESSAGES/volto.po @@ -729,6 +729,46 @@ msgstr "" msgid "advandedSectionsFilters" msgstr "" +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Pubblicazione attiva. +msgid "alert_activeDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. C'è un errore sulle date: la data di scadenza è anteriore alla data d'inizio +msgid "alert_errorDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. E' scaduto il {date}. +msgid "alert_expiredDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. Verà pubblicato il {date} +msgid "alert_futureDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Scadrà il {date} +msgid "alert_willExpire" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Periodo di visualizzazione +msgid "alertblock_dateTitle" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Scadenza +msgid "alertblock_endDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Inizio +msgid "alertblock_startDate" +msgstr "" + #: components/ItaliaTheme/Blocks/IconBlocks/Sidebar # defaultMessage: Centrare i card msgid "alignCards" diff --git a/locales/volto.pot b/locales/volto.pot index 67d73aa7a..745c46b98 100644 --- a/locales/volto.pot +++ b/locales/volto.pot @@ -1,7 +1,7 @@ msgid "" msgstr "" "Project-Id-Version: Plone\n" -"POT-Creation-Date: 2024-09-04T10:35:48.334Z\n" +"POT-Creation-Date: 2024-10-30T13:16:00.707Z\n" "Last-Translator: Plone i18n \n" "Language-Team: Plone i18n \n" "MIME-Version: 1.0\n" @@ -731,6 +731,46 @@ msgstr "" msgid "advandedSectionsFilters" msgstr "" +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Pubblicazione attiva. +msgid "alert_activeDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. C'è un errore sulle date: la data di scadenza è anteriore alla data d'inizio +msgid "alert_errorDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. E' scaduto il {date}. +msgid "alert_expiredDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Non visibile. Verà pubblicato il {date} +msgid "alert_futureDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/AlertWrapper +# defaultMessage: Scadrà il {date} +msgid "alert_willExpire" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Periodo di visualizzazione +msgid "alertblock_dateTitle" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Scadenza +msgid "alertblock_endDate" +msgstr "" + +#: components/ItaliaTheme/Blocks/Alert/Sidebar +# defaultMessage: Inizio +msgid "alertblock_startDate" +msgstr "" + #: components/ItaliaTheme/Blocks/IconBlocks/Sidebar # defaultMessage: Centrare i card msgid "alignCards" diff --git a/src/components/ItaliaTheme/Blocks/Alert/AlertWrapper.jsx b/src/components/ItaliaTheme/Blocks/Alert/AlertWrapper.jsx new file mode 100644 index 000000000..20dd3cdff --- /dev/null +++ b/src/components/ItaliaTheme/Blocks/Alert/AlertWrapper.jsx @@ -0,0 +1,89 @@ +import React from 'react'; +import { useSelector } from 'react-redux'; +import { Row, Container } from 'design-react-kit/dist/design-react-kit'; +import { defineMessages, useIntl } from 'react-intl'; + +const messages = defineMessages({ + expiredDate: { + id: 'alert_expiredDate', + defaultMessage: "Non visibile. E' scaduto il {date}.", + }, + activeDate: { + id: 'alert_activeDate', + defaultMessage: 'Pubblicazione attiva.', + }, + futureDate: { + id: 'alert_futureDate', + defaultMessage: 'Non visibile. Verà pubblicato il {date}', + }, + errorDate: { + id: 'alert_errorDate', + defaultMessage: + "Non visibile. C'è un errore sulle date: la data di scadenza è anteriore alla data d'inizio", + }, + willExpire: { + id: 'alert_willExpire', + defaultMessage: 'Scadrà il {date}', + }, +}); + +const AlertWrapper = ({ data, children }) => { + const intl = useIntl(); + const userLogged = useSelector((state) => state.userSession.token); + + const isActive = () => { + const today = new Date().getTime(); + const start = data.startDate ? new Date(data.startDate).getTime() : 0; + const end = data.endDate + ? new Date(data.endDate).getTime() + : Number.MAX_SAFE_INTEGER; + + const returnValue = { + active: false, + message: intl.formatMessage(messages.expiredDate, { + date: new Date(data.endDate).toLocaleString(), + }), + }; + + if (end < start) { + returnValue.message = intl.formatMessage(messages.errorDate); + } else if (today < start) { + returnValue.message = intl.formatMessage(messages.futureDate, { + date: new Date(data.startDate).toLocaleString(), + }); + } else if (today < end) { + returnValue.message = intl.formatMessage(messages.activeDate); + if (data.endDate) { + returnValue.message += + ' ' + + intl.formatMessage(messages.willExpire, { + date: new Date(data.endDate).toLocaleString(), + }); + } + returnValue.active = true; + } + + return returnValue; + }; + + const activeStatus = isActive(); + + return ( + <> + {(userLogged || activeStatus.active) && ( + <> + {userLogged && ( + + +

{activeStatus.message}

+ + + )} + {children} + + )} + + ); +}; + +export default AlertWrapper; diff --git a/src/components/ItaliaTheme/Blocks/Alert/Edit.jsx b/src/components/ItaliaTheme/Blocks/Alert/Edit.jsx index 52de84dfc..04f255c51 100644 --- a/src/components/ItaliaTheme/Blocks/Alert/Edit.jsx +++ b/src/components/ItaliaTheme/Blocks/Alert/Edit.jsx @@ -3,126 +3,107 @@ * @module components/manage/Blocks/Image/Edit */ -import React, { Component } from 'react'; +import React, { useEffect } from 'react'; import PropTypes from 'prop-types'; -import { connect } from 'react-redux'; -import { compose } from 'redux'; -import { injectIntl } from 'react-intl'; import cx from 'classnames'; import { Container, Row, Col } from 'design-react-kit/dist/design-react-kit'; -import { createContent } from '@plone/volto/actions'; -import { SidebarPortal } from '@plone/volto/components'; import { EditTextBlock } from '@plone/volto/components'; +import AlertWrapper from 'design-comuni-plone-theme/components/ItaliaTheme/Blocks/Alert/AlertWrapper.jsx'; +import { SidebarPortal } from '@plone/volto/components'; import { AlertSidebar } from 'design-comuni-plone-theme/components/ItaliaTheme'; -/** - * Edit Alert block class. - * @class Edit - * @extends Component - */ -class Edit extends Component { - /** - * Property types. - * @property {Object} propTypes Property types. - * @static - */ - static propTypes = { - selected: PropTypes.bool.isRequired, - block: PropTypes.string.isRequired, - index: PropTypes.number.isRequired, - data: PropTypes.objectOf(PropTypes.any).isRequired, - content: PropTypes.objectOf(PropTypes.any).isRequired, - request: PropTypes.shape({ - loading: PropTypes.bool, - loaded: PropTypes.bool, - }).isRequired, - pathname: PropTypes.string.isRequired, - onChangeBlock: PropTypes.func.isRequired, - onSelectBlock: PropTypes.func.isRequired, - onDeleteBlock: PropTypes.func.isRequired, - onFocusPreviousBlock: PropTypes.func.isRequired, - onFocusNextBlock: PropTypes.func.isRequired, - handleKeyDown: PropTypes.func.isRequired, - createContent: PropTypes.func.isRequired, - }; - constructor(props) { - super(props); - if (!this.props.data.color) { - this.props.data.color = 'warning'; - } - this.blockNode = React.createRef(); - } +const Edit = (props) => { + const { + data, + block, + selected, + index, + onChangeBlock, + onSelectBlock, + onDeleteBlock, + onFocusPreviousBlock, + onFocusNextBlock, + onAddBlock, + } = props; - render() { - if (__SERVER__) { - return
; + useEffect(() => { + if (!data.bg_color) { + onChangeBlock(block, { + ...data, + bg_color: data.color ?? 'warning', + }); } - return ( + }, [data, onChangeBlock, block]); + + return ( +
-
- +
+ - {this.props.data.image?.data && ( + {data.image?.data && ( )}
- - + +
- ); - } -} + + ); +}; -export default compose( - injectIntl, - connect( - (state) => ({ - request: state.content.create, - content: state.content.data, - }), - { createContent }, - ), -)(Edit); +/** + * Property types. + * @property {Object} propTypes Property types. + * @static + */ +Edit.propTypes = { + selected: PropTypes.bool.isRequired, + block: PropTypes.string.isRequired, + index: PropTypes.number.isRequired, + data: PropTypes.objectOf(PropTypes.any).isRequired, + request: PropTypes.shape({ + loading: PropTypes.bool, + loaded: PropTypes.bool, + }).isRequired, + pathname: PropTypes.string.isRequired, + onChangeBlock: PropTypes.func.isRequired, + onSelectBlock: PropTypes.func.isRequired, + onDeleteBlock: PropTypes.func.isRequired, + onFocusPreviousBlock: PropTypes.func.isRequired, + onFocusNextBlock: PropTypes.func.isRequired, + handleKeyDown: PropTypes.func.isRequired, + createContent: PropTypes.func.isRequired, +}; +export default Edit; diff --git a/src/components/ItaliaTheme/Blocks/Alert/Sidebar.jsx b/src/components/ItaliaTheme/Blocks/Alert/Sidebar.jsx index f4d0c1c0d..b3b150466 100644 --- a/src/components/ItaliaTheme/Blocks/Alert/Sidebar.jsx +++ b/src/components/ItaliaTheme/Blocks/Alert/Sidebar.jsx @@ -5,6 +5,7 @@ import { defineMessages, FormattedMessage, injectIntl } from 'react-intl'; import { FileWidget } from '@plone/volto/components'; import { ColorListWidget } from 'design-comuni-plone-theme/components/ItaliaTheme'; import ImageSizeWidget from '@plone/volto/components/manage/Widgets/ImageSizeWidget'; +import { DatetimeWidget } from '@plone/volto/components'; const messages = defineMessages({ Color: { @@ -31,9 +32,17 @@ const messages = defineMessages({ id: 'CardImageSize', defaultMessage: 'Dimensione immagine', }, - CardImageSize: { - id: 'CardImageSize', - defaultMessage: 'Dimensione immagine', + alertblock_startDate: { + id: 'alertblock_startDate', + defaultMessage: 'Inizio', + }, + alertblock_endDate: { + id: 'alertblock_endDate', + defaultMessage: 'Scadenza', + }, + alertblock_dateTitle: { + id: 'alertblock_dateTitle', + defaultMessage: 'Periodo di visualizzazione', }, }); @@ -104,6 +113,35 @@ class Sidebar extends Component { value={this.props.data.sizeImage} /> + +
+

+ {this.props.intl.formatMessage(messages.alertblock_dateTitle)} +

+
+ { + this.props.onChangeBlock(this.props.block, { + ...this.props.data, + [name]: value, + }); + }} + /> + { + this.props.onChangeBlock(this.props.block, { + ...this.props.data, + [name]: value, + }); + }} + /> + ); } diff --git a/src/components/ItaliaTheme/Blocks/Alert/View.jsx b/src/components/ItaliaTheme/Blocks/Alert/View.jsx index bc160f6cb..ec7692cd3 100644 --- a/src/components/ItaliaTheme/Blocks/Alert/View.jsx +++ b/src/components/ItaliaTheme/Blocks/Alert/View.jsx @@ -1,63 +1,47 @@ -/** - * View Alert block. - * @module components/manage/Blocks/Hero/View - */ - import React from 'react'; import PropTypes from 'prop-types'; import cx from 'classnames'; import redraft from 'redraft'; import { Container, Row, Col } from 'design-react-kit/dist/design-react-kit'; -//import { isCmsUi } from '@plone/volto/helpers'; import config from '@plone/volto/registry'; +import AlertWrapper from 'design-comuni-plone-theme/components/ItaliaTheme/Blocks/Alert/AlertWrapper.jsx'; +import { checkRedraftHasContent } from 'design-comuni-plone-theme/helpers'; -/** - * View Alert block class. - * @class View - * @extends Component - */ -const View = ({ data, pathname }) => { - //const isCmsUI = pathname ? isCmsUi(pathname) : false - - const content = data.text - ? redraft( - data.text, - config.settings.richtextViewSettings.ToHTMLRenderers, - config.settings.richtextViewSettings.ToHTMLOptions, - ) - : ''; - - return ( +const View = ({ data }) => { + return checkRedraftHasContent(data.text) ? (
- - - - {data.image?.data && ( - - + + + + + {data.image?.data && ( + + + + )} + + {redraft( + data.text, + config.settings.richtextViewSettings.ToHTMLRenderers, + config.settings.richtextViewSettings.ToHTMLOptions, + )} - )} - {content} - - - + + + +
- ); + ) : null; }; -/** - * Property types. - * @property {Object} propTypes Property types. - * @static - */ View.propTypes = { data: PropTypes.objectOf(PropTypes.any).isRequired, }; diff --git a/theme/ItaliaTheme/Blocks/_alert.scss b/theme/ItaliaTheme/Blocks/_alert.scss index a913fdc1a..232a29ef7 100644 --- a/theme/ItaliaTheme/Blocks/_alert.scss +++ b/theme/ItaliaTheme/Blocks/_alert.scss @@ -1,6 +1,7 @@ .public-ui { .block.alertblock, .alertblock { + position: relative; .bg-alert-warning-orange, .bg-alert-warning, .bg-alert-danger { @@ -118,4 +119,15 @@ margin-top: 1rem; } } + .alert-info-dates { + position: absolute; + content: ''; + top: -1em; + .alert-info-text { + padding: 0 1em; + background-color: #fff; + border: 1px solid #000; + text-align: center; + } + } }