Uploaded image for project: 'Magnolia UI'
  1. Magnolia UI
  2. MGNLUI-8067

Modify css to allow a multiline error notification

XMLWordPrintable

    • Icon: Bug Bug
    • Resolution: Unresolved
    • Icon: Neutral Neutral
    • None
    • 6.3.0, 6.2.35
    • None

      Steps to reproduce

      1. Generate a long error messages on vaadin one of the following:
        1. New page, changing error message to be long
        2. New error on GA4 when is released in the pane

       

      Some notifications with long message don't offer multiline message as there is an inconsistence in the css.

      Expected results

      The error appears in a multiline.

      Actual results

      The error shows in a single line, extending the horizontal width of the container, it can hide

      Workaround

      https://git.magnolia-cms.com/projects/PLATFORM/repos/ui.pub/browse/magnolia-resurface-theme/src/main/resources/VAADIN/themes/resurface/modal.scss#29

      This line produces a disruption in the UI, which needs to include some side effects.

      can be avoided with the following rule or similar (less restrictive):

      .v-label.v-widget.validation-display.v-label-validation-display.v-label-undef-w {
      white-space: break-spaces;
      } 

      Development notes

      The ticket has been developed on GA4 analytics release, but needs to be generalized to all modules in the UI module, and then removed on the analytics module.

      Pay attention to the general error that uses "v-label-undef-w" class and generates it. Removal of that class is also a solution. 

        Acceptance criteria

              Unassigned Unassigned
              asoto Alberto Soto
              Nucleus
              Votes:
              0 Vote for this issue
              Watchers:
              1 Start watching this issue

                Created:
                Updated:

                  Bug DoR
                  Task DoD