Please refer to the attached screen grab.
The page you see is a Views page of teasers. Hovering over either a) any teaser or b) anywhere covered by the view that isn't a teaser (you know how it works) produces the same result: all contextual links in the view (including those for teasers) stacked up on top of each other, stuffed up in the top right corner of the view. If you look real closely, the contextual link's cog icon is a bit ragged where you can see edges of other icons below.
The top-most contextual link wins out when clicking (the one for editing the view) - likely because it's higher up in the markup.
The screen grab is of the Ohm theme but I've definitely seen this in custom sub themes based on Omega 4 before Ohm even existed (hence filing this issue under "Code" and not "Ohm").
Comment | File | Size | Author |
---|---|---|---|
Google Chrome.png | 480.18 KB | dddbbb |
Comments
Comment #1
fubhy CreditAttribution: fubhy commentedOh, right... Well, that's not an Omega issue though afaik. It's contextual links CSS in general. Will see if we can fix that anyways though. Otherwise we should just file it as a contextual links module issue.
Comment #2
dddbbb CreditAttribution: dddbbb commentedAah, sorry. Hadn't seen the same issue in Bartik so just presumed it was due to the only contrib theme I had installed - Omega 4.
But yes, an Omega-side fix would be grand :D
Comment #3
dddbbb CreditAttribution: dddbbb commentedThis appears to be a Display Suite related issue.
Steps to reproduce
1) Enable (and set as default) a theme that isn't already providing a CSS fix for this issue (e.g. Omega 4).
2) Create a view page of nodes that displays content teasers.
3) Select a Display Suite provided layout for said node's teaser display (e.g. "One column").
4) Check out the view page: all the contextual links will be absolutely positioned on top of each other in the top right corner of the view (like the screen shot in the OP).
Solution
The display suite layout doesn't explicitly set the teaser wrapper div to
position: relative;
so this needs to be set somewhere in order to position the contextual links correctly, relative to the position of each teaser.In my example above, the following would work:
But this only caters to the "One column" layout. A more brutal solution would be:
But this is probably a bit over the top and we can't ensure that Views is always going to provide the list of teasers so that class may not be reliable.
What would be really handy is if we could print an extra class whenever a Display Suite layout is used, in addition to the class for the layout itself. So rather than:
we'd actually have:
so that we could do this:
So do we add this extra class in Omega via a hook or process function or do we now consider this a Display Suite issue and see about a fix at that end? Or both?
Comment #4
DamienMcKennaComment #5
joelstein CreditAttribution: joelstein commentedSee #1914966: Nested contextual links triggers don't work well.