openeuropa / oe_whitelabel

European Union Public License 1.2
2 stars 4 forks source link

Listing item layout breaking with long badges #274

Open gingapa opened 2 months ago

gingapa commented 2 months ago

OEL-2270 introduced a .text-break class for the bcl-listing to fix the layout braking with long words, but this is not enough to solve the issue IF there are long BADGES inside the card (by default, badges have the rulewhite-space: nowrap):

image

On UCPKN we added the following SCSS as a quick fix:

.listing-item { .col-sm, .col-md, .col-lg, .col-xl, .col-xxl { // Add dynamic max-width of 100% less .bcl-card-start-col width less gutter-x size; max-width: calc(100% - $card-start-col-size - var(--bs-gutter-x)); } }