SOLVED: Overlay and CSS transitions don't work in Posts module

Bricks Version: 1.4.0.2
Browser: Chrome 103
OS: Linux Mint 20.2
URL: https://bricks.2sinn.it/

Current Results:

  1. When setting up an overlay in the Posts module, nothing appears on the canvas or front-end. Screenshot: https: double slash paste.pics/HPOP9

  2. Also, when defining a box-shadow for images to display on :hover, the transition defined in the “transition” field does nothing. In order to transition the box-shadow, an extra rule has to be written in the custom CSS field. Screenshot: https: double slash paste.pics/HPOOD

Expected Results:

  1. When setting up an overlay to be displayed on hover in the posts module, something should happen when hovering over a post.

  2. CSS transitions should apply to the posts module for the properties specified.

Hi,
Thanks so much for your report!

  1. The overlay setting is meant to work with the metro layout only. There is no info text about that and therefore I can understand your report, however it is not a bug :slight_smile:

  2. Are you talking about images in general or the images in the Posts element? If the latter: You can’t address the image inside the posts element directly via :hover (except with custom CSS), because the :hover properties probably land on the whole element (and not on the image). This is also true for the transition. How does the transition field supposed to know where to apply the transition to?
    Accordingly, this is not a bug because you cannot address the individual elements within the Post Content element if they do not have the appropriate settings.

In general, it is currently not yet possible, for example, to address the elements inside when hovering a div (*within the classes or hover states panel).

Example:

.myDiv:hover .myImage {
  box-shadow: 10px 5px 5px black;
}

Best regards,
timmse

Hey @timmse, thanks for your reply and sorry for not getting back to you sooner. Re. #2, yes, you’re right, that was exactly what I was trying to do: I thought perhaps the images inside the post element would inherit the transition CSS from their parent. Your explanation makes sense, though. I addressed this by writing custom CSS and it worked out well :slight_smile:

Thanks for the additional info re. the metro layout!

By all means, feel free to close this bug report.

1 Like