Idea - Enhancing Readability: Preventing Image Blur for a better experience

Enhancing Readability: Preventing Image Blur for a better experience

New

Documentation

When reading OutSystems documentation or forum posts, I’ve noticed that images usually appear bright and clear. However, when I reach a step where I need to read the content of an image step by step, hovering over it causes the image to become less bright or slightly blurred. To restore its original clarity, I have to click on it to zoom in.

If the goal is simply to follow the flow and read the content while pointing at different parts of the image—without zooming—it would be helpful if the image didn’t blur upon hovering.

on focus: -

normal view: -

on focus/hover: -

Just a suggestion!

10 Mar 2025

Dorine Boudry

MVP

You've got my vote 👍

As a workaround, when websites don't style the way you like, you could look into using Firefox, and adding your own styling in userContent.css.

With this styling in that file:

@-moz-document url-prefix(https://www.outsystems.com/forums/)  .image-zoom img:hover, video:hover {
     filter: alpha(opacity = 100) !important;
     opacity: 1 !important;
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  }
}

It looks like this when hovered : a little bit of a shadow instead of the content loosing opacity

Dorine

11 Mar 2025