Skip to content

Commit

Permalink
fix: BandiInEvidenceTemplate layout to space bando dati when titles h…
Browse files Browse the repository at this point in the history
…ave different lengths (#410)

* fix: BandiInEvidenceTemplate layout to space bando dati when titles have different lengths

* chore: update release.md

---------

Co-authored-by: Piero Nicolli <[email protected]>
  • Loading branch information
sabrina-bongiovanni and pnicolli authored Nov 21, 2023
1 parent 72f7eae commit 4780b12
Show file tree
Hide file tree
Showing 3 changed files with 115 additions and 104 deletions.
4 changes: 4 additions & 0 deletions RELEASE.md
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,10 @@

## Versione X.X.X (dd/mm/yyyy)

### Migliorie

- Migliorato l'allineamento delle informazioni dei bandi nelle card dei blocchi elenco

### Fix

- Nel blocco Cerca, quando viene selezionata la variazione "Colonna a destra" o "Colonna a sinistra" i blocchi si allineano correttamente, e i bottoni nella testata si vedono correttamente in modalità Edit.
Expand Down
214 changes: 110 additions & 104 deletions src/components/ItaliaTheme/Blocks/Listing/BandiInEvidenceTemplate.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -103,126 +103,132 @@ const BandiInEvidenceTemplate = ({
{show_description && listingText && (
<div className="bando-description">{listingText}</div>
)}

<div className="bando-dati mb-2">
{/* Ente */}
{show_ente && item.ente_bando?.length > 0 && (
<span className="d-flex flex-wrap align-items-baseline bando-dati-info">
<div className="bando-dati-label me-2">
{intl.formatMessage(messages.ente)}:
</div>
<span className="bando-dati-date">
{item.ente_bando.map((ente, i) => (
<span>
{ente}
{i < item.ente_bando.length - 1 ? ', ' : ''}
</span>
))}
</span>
</span>
)}

{/* Tipologia */}
{show_tipologia && item?.tipologia_bando && (
<span className="d-flex flex-wrap align-items-baseline bando-dati-info">
<div className="bando-dati-label me-2">
{intl.formatMessage(messages.tipologia)}:
</div>
<span className="bando-dati-date">
{item.tipologia_bando}
<div className="bando-lower-section">
<div className="bando-dati mb-2">
{/* Ente */}
{show_ente && item.ente_bando?.length > 0 && (
<span className="d-flex flex-wrap align-items-baseline bando-dati-info">
<div className="bando-dati-label me-2">
{intl.formatMessage(messages.ente)}:
</div>
<span className="bando-dati-date">
{item.ente_bando.map((ente, i) => (
<span>
{ente}
{i < item.ente_bando.length - 1 ? ', ' : ''}
</span>
))}
</span>
</span>
</span>
)}
)}

{/* Pubblicazione */}
{item.effective && (
<span className="d-flex flex-wrap align-items-baseline bando-dati-info">
<div className="bando-dati-label me-2">
{intl.formatMessage(messages.pubblicazione)}:
</div>
<span className="bando-dati-date">
{viewDate(intl.locale, item.effective, 'DD-MM-YYYY')}
{/* Tipologia */}
{show_tipologia && item?.tipologia_bando && (
<span className="d-flex flex-wrap align-items-baseline bando-dati-info">
<div className="bando-dati-label me-2">
{intl.formatMessage(messages.tipologia)}:
</div>
<span className="bando-dati-date">
{item.tipologia_bando}
</span>
</span>
</span>
)}
)}

{/* Scadenza */}
{item.scadenza_bando && (
<span className="d-flex flex-wrap align-items-baseline bando-dati-info">
<div className="bando-dati-label me-2">
{intl.formatMessage(messages.scadenza)}:
</div>
<span className="bando-dati-date">
{item.scadenza_bando &&
viewDate(
{/* Pubblicazione */}
{item.effective && (
<span className="d-flex flex-wrap align-items-baseline bando-dati-info">
<div className="bando-dati-label me-2">
{intl.formatMessage(messages.pubblicazione)}:
</div>
<span className="bando-dati-date">
{viewDate(
intl.locale,
item.scadenza_bando,
item.effective,
'DD-MM-YYYY',
)}
</span>
</span>
</span>
)}
)}

{/* Chiusura procedimento */}
{item.chiusura_procedimento_bando && (
<span className="d-flex flex-wrap align-items-baseline bando-dati-info">
<div className="bando-dati-label me-2">
{intl.formatMessage(messages.chiusura_procedimento)}:
</div>
<span className="bando-dati-date">
{item.chiusura_procedimento_bando &&
viewDate(
intl.locale,
item.chiusura_procedimento_bando,
'DD-MM-YYYY',
)}
{/* Scadenza */}
{item.scadenza_bando && (
<span className="d-flex flex-wrap align-items-baseline bando-dati-info">
<div className="bando-dati-label me-2">
{intl.formatMessage(messages.scadenza)}:
</div>
<span className="bando-dati-date">
{item.scadenza_bando &&
viewDate(
intl.locale,
item.scadenza_bando,
'DD-MM-YYYY',
)}
</span>
</span>
</span>
)}

{/* Stato */}
{item?.bando_state?.length > 0 && (
<span className="d-flex align-items-baseline bando-dati-info">
<div className="bando-dati-label me-3">
{intl.formatMessage(messages.stato)}:
</div>
)}

<span className="bando-dati-date">
<div
className={cx('bando-state', {
open: item.bando_state?.includes('open'),
closed: item.bando_state?.includes('closed'),
scheduled: item.bando_state?.includes(
'scheduled',
),
'in-progress': item.bando_state?.includes(
'inProgress',
),
})}
>
<BandoStatus content={item} />
{/* Chiusura procedimento */}
{item.chiusura_procedimento_bando && (
<span className="d-flex flex-wrap align-items-baseline bando-dati-info">
<div className="bando-dati-label me-2">
{intl.formatMessage(messages.chiusura_procedimento)}
:
</div>
<span className="bando-dati-date">
{item.chiusura_procedimento_bando &&
viewDate(
intl.locale,
item.chiusura_procedimento_bando,
'DD-MM-YYYY',
)}
</span>
</span>
</span>
)}
)}

{/* Note aggiornamenti */}
{item.update_note &&
(item.bando_state?.includes('open') ||
item.bando_state?.includes('inProgress')) && (
<span className="d-flex bando-note">
<strong>{item.update_note}</strong>
{/* Stato */}
{item?.bando_state?.length > 0 && (
<span className="d-flex align-items-baseline bando-dati-info">
<div className="bando-dati-label me-3">
{intl.formatMessage(messages.stato)}:
</div>

<span className="bando-dati-date">
<div
className={cx('bando-state', {
open: item.bando_state?.includes('open'),
closed: item.bando_state?.includes('closed'),
scheduled: item.bando_state?.includes(
'scheduled',
),
'in-progress': item.bando_state?.includes(
'inProgress',
),
})}
>
<BandoStatus content={item} />
</div>
</span>
</span>
)}
</div>
<div className="read-more">
<CardReadMore
iconName="it-arrow-right"
tag={UniversalLink}
item={!isEditMode ? item : null}
href={isEditMode ? '#' : null}
text={intl.formatMessage(messages.vedi)}
/>

{/* Note aggiornamenti */}
{item.update_note &&
(item.bando_state?.includes('open') ||
item.bando_state?.includes('inProgress')) && (
<span className="d-flex bando-note">
<strong>{item.update_note}</strong>
</span>
)}
</div>
<div className="read-more">
<CardReadMore
iconName="it-arrow-right"
tag={UniversalLink}
item={!isEditMode ? item : null}
href={isEditMode ? '#' : null}
text={intl.formatMessage(messages.vedi)}
/>
</div>
</div>
</CardBody>
</Card>
Expand Down
1 change: 1 addition & 0 deletions src/theme/ItaliaTheme/Blocks/_bandiInEvidenceTemplate.scss
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@
flex-direction: column;
padding: 2.5rem;
padding-bottom: 0rem;
justify-content: space-between;
}
}

Expand Down

0 comments on commit 4780b12

Please sign in to comment.