diff --git a/css/backoffice/components/_field.scss b/css/backoffice/components/_field.scss index ae209b0de..e125240da 100644 --- a/css/backoffice/components/_field.scss +++ b/css/backoffice/components/_field.scss @@ -36,11 +36,18 @@ $ibo-field--value-decoration--spacing-x: 0.5rem !default; /* Avoid value to overflow from its container with very long strings (typically URLs) */ /* Note: Some types of attribute must be excluding as it can alter their rendering */ &:not([data-attribute-type="AttributeBlob"]):not([data-attribute-type="AttributeFile"]):not([data-attribute-type="AttributeImage"]):not([data-attribute-type="AttributeCustomFields"]):not(.ibo-input-file-select--container) { - /* We need the rule to apply for the class and all its descendants */ + /* We need the rule to apply for the class and all its descendants, hence the "&, & *" */ .ibo-field--value { - * { + &, & * { word-break: break-word; - white-space: pre-line; + white-space: inherit; /* Here we don't put break-spaces as it would put ".ibo-feld-small .ibo-field-value" on a new line due to the spaces/indentation of the HTML templates. For now we rather have this rule than diminish the templates readability/maintenability */ + } + } + &.ibo-field-large { + .ibo-field--value { + &, & * { + white-space: break-spaces; /* For large fields we don't have the issue stated above */ + } } } }