Add above and Add below links are too keen

Created on 10 April 2024, 8 months ago
Updated 26 April 2024, 8 months ago

Problem/Motivation

The horizontal extent of the Add above and Add below anchors is over-keen their extent being illustrated below with the red line...

What I mean by that is that you can click pretty anywhere along the length of the whole element and it triggers and addition which in turn opens up the off-canvas.

I am clear that the blue border on hover is VERY useful to who us the extent of the Paragraph but the ADD functionality should really only be on the actual blue circles themselves as shown in (1) below but it causes trouble when trying to access underlying links such as the 'Interactive challenge' (read more) shown in (2)...

It IS still just about possible to access the ''Interactive challenge' link in the example above but this is all far from ideal from the point of view of a content editors who all assuming that to Add they have to actual click the blue + circles.

Feature request
Status

Fixed

Version

1.6

Component

Code

Created by

🇬🇧United Kingdom SirClickALot Somerset

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Merge Requests

Comments & Activities

  • Issue created by @SirClickALot
  • Assigned to bbruno
  • 🇵🇹Portugal bbruno Poland
  • Pipeline finished with Success
    8 months ago
    Total: 143s
    #142848
  • 🇵🇹Portugal bbruno Poland

    Added an MR which reduces the size of the 'Add' links to only the button. This change only applies when not using the Hover Highlight Mode - for those the blue area will still be clickable.

  • Issue was unassigned.
  • Status changed to Needs review 8 months ago
  • 🇵🇹Portugal bbruno Poland
  • Status changed to Fixed 8 months ago
  • 🇩🇪Germany a.dmitriiev

    I have checked and it is now fixed. MR is merged and will be part of next release

  • 🇬🇧United Kingdom SirClickALot Somerset

    I am using 1.63 which, according to the release notes, says that this is fixed.

    In my case, the effective bounds of the +Add anchor are now what they should be BUT, I am seeing no + sign at all.

    Looking into the underlying markup, I do not see a any reference now to the plus_circle.svg image.

    I may not have been clear enough in my original post is that what I hoping for was an easy way for site-builders to either: 1) override that SVG with an upload or 2) the ability to re-colour the SVG using our theme but not for it to disappear altogether.

    I hope that make sense.

  • 🇩🇪Germany a.dmitriiev

    Actually, svg file is now in the HTML markup, and not added via CSS. See the screenshot:

  • 🇬🇧United Kingdom SirClickALot Somerset

    Aha!

    Yes, a great solution, a huge improvement.

    It turns out that in our site, we have forced every .region-content anchor to be display: inline-block; and while that might not the best idea, it maybe points to the something that you should set explicitly in the module?

    We have adjusted things in our theme and the plus signs now appear but they do seem to have a rather odd (blurring) shadow to them as can be seen here...

    I cannot see this shadow applied to any of: the surrounding div.add-paragraphs, the a.frontend-editing-open-sidebar.frontend-editing__action.frontend-editing__action--beforeanchor itself, or 'inside' the svg?

  • Automatically closed - issue fixed for 2 weeks with no activity.

Production build 0.71.5 2024