Uploaded image for project: 'PUBLIC - Liferay Portal Community Edition'
  1. PUBLIC - Liferay Portal Community Edition
  2. LPS-81415

If a fragment has an editable field near the top of the fragment, a user cannot map or edit those fields because the buttons to do so will be blocked



      fragment-entry-link-content was given overflow:hidden CSS property to prevent images from overflowing out of bounds. However, the toolbar for mapping Display Pages is trapped inside of this element regardless of its overflow value because fragment-entry-link-content is its parent and has overflow:hidden property. This causes the toolbar to be really hard to see for most elements, and even invisible in smaller elements because its position is out of the fragment-entry-link-content parent. Screenshots will show the effects of this.

      Note: Possible idea to fix would be to remove overflow:hidden from content and just have the content box to fit what it contains inside to prevent overflow

      Steps to Reproduce

      1. Navigate to Site Admin > Build > Fragments
      2. Create a lfr-editable fragment
        <lfr-editable id="test" type="text">TEST</lfr-editable>
      3. Navigate to Site Admin > Build > Site Pages > Display Pages
      4. Create a Display Page
      5. Add your Fragment
      6. Set Web Content Article > Basic Web Content to be the asset type to be mapped
      7. Click on the editable text of your fragment
      8. View Toolbar (FAILS)
      9. Modify CSS rule in devtools
        .fragment-entry-link-wrapper .fragment-entry-link-content {
            /* overflow: hidden;   previous rule */
            overflow: visible; /* new rule */
            position: relative;
            z-index: -1;
      10. Don't refresh Page, try to click on editable text on fragment

      Expected Result
      Toolbar somehow visible without having to modify overflow:hidden

      Actual Result
      Toolbar only visible with overflow:hidden changed to visible

      Reproduced on:
      Tomcat 9.0.6 + MySQL 5.7
      Portal master GIT ID: b650b3d6a8d8188bff32b02b30306daa80638e69




            • Assignee:
              kyle.miho Kyle Miho
              kyle.miho Kyle Miho
              Participants of an Issue:
              Recent user:
              Marta Elicegui
            • Votes:
              0 Vote for this issue
              0 Start watching this issue


              • Created:
                Days since last comment:
                2 years, 2 days ago


                Version Package
                7.1.0 Beta 3