nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

How to remove shading from image viewer

David Bounds

The new jira view has a shading at the top and bottom of the image when viewed. This hides the URL which is very important for reproduction/documentation. Is there a way to stop the image viewer from shading the picture?

Click any image that is attached to a ticket and notice that the top and bottom are obscured.

Accepted answers

All comments

Angélica Luz

Hello David,

Thank you for reaching out to Atlassian Community!

Testing on my local site, I didn’t see much difference between the old and new issue view when viewing an image or another attachment.

It does show the shadow when the mouse pointer is over the image, but it shows the same information.

Can you please let us know more details about the URL that is hidden when viewing the image?

Old view:

Screen Shot 2021-03-23 at 15.47.19.png

New view:

Screen Shot 2021-03-23 at 15.48.38.png

We can create a feature request suggesting to remove this because currently, it’s not possible to disable it.

Kind regards,
Angélica

David Bounds

@Angélica Luz Sorry for the delay!

Yes, your second image shows the problem. The grayed out area at the top is typically covering the URL. We use the URL to identify pages being referenced.

As you can see it is darker at the top of your second image and this darkness is what obscures the URL in many of the images we attach to tickets.

Notice in the old view that there is no portion of the image that is obscured.

Angélica Luz

Hi David,

Thank you for the details.

It’s not possible to disable this preview. Depending on the type of the file, it will show this shadow on the top and bottom.

There is a feature suggesting improvements for that:

Improved Zoom Resolution in Image Preview

What I tested here that can be a workaround, is to open the developer tools on the browser, where it will be possible to have more control of the zoom.

When opening an image to preview it, right-click and select “Inspect”.

- https://share.getcloudapp.com/DOuDz5Qn

Russell Hiscock

i vote to remove the 'feature'. Who decided obscuring part of an image arbitrarily was a good idea? a triumph of 'pretty' over 'usable'.

Deb Rogowski

Yes, by all means, PLEASE get rid of that shadow! What was the reasoning behind obscuring part of a valuable image??

Simon Marriott

Another vote to remove the annoying top/bottom shading

Marshall Palfenier

I'm also here to bump/upvote the request to remove this shadow which obscures critical information.

Michael Poremba_zde3nq

Atlassian, the navigation controls and information labels shown over the image are in white. So it makes sense that the shadow serves as a helpful background for the controls and labels. Many of the users commenting here are frustrated when viewing images containing critical information at the top or bottom of the image, where the shadow obscures that information.

The frustration results mostly from moving the mouse over the image viewer. After the shadow appears, there's then a three-second delay waiting for it to disappear again. The shadow is a huge distraction from trying to read those important parts of the image. On top of that, the three-second wait is super frustrating. User have no control over the distraction or the cure.

Solution proposal 1 - One easy fix is for the shadow and navigation controls to disappear immediately when the image is clicked. That would get rid of the issue around the three-second delay, giving control back to the user. At the time of this writing, there is no other action associated with clicking directly on the image.
Solution proposal 2 - A second fix is for the shadow to appear only around the navigation controls and information labels, rather than banded across the entire top and bottom of the image. This might be somewhat challenging to implement well where the filename is shown in the upper left hand corner. But the other user elements might be easy to shadow locally.
Solution proposal 2a - Notice that the forward / backward navigation arrows do not require a shadow at all. The other labels and navigation controls could be implemented without resorting to shadow banding at all.
Solution proposal 3 - A third fix is for the shadow gradient to be less severe near the absolute top and bottom. At those edges, the shadow is all-black. The sad part is, the shadow isn't even needed in the areas where it's all-black--the information labels and navigation controls are in areas where the shadow is more translucent. The all-black areas should be translucent or maybe even transparent. This would help reveal any critical information shown at the top or bottom of images.
Solution proposal 4 - Another approach is to simply reserve space above and below the image for information labels and navigation controls, making the image slightly smaller. Not the end of the world.

Please forward these solution proposals on to your usability team. A frontend engineer should be able to implement all of these approaches in one afternoon. As is often the case, more time will be spent on planning, coordinating and testing the new behavior.

Note that these proposed solutions doesn't remedy the complaint from Joans Levin. One suggestion for his scenario would be to open the image in a new tab. In Chrome browser I see this feature in the right mouse click menu when clicking on the image. Hopefully this quick and easy workaround is helpful for Jonas, or a similar operation in whatever browser he's using.

Rene C. [Atlassian Support]

Hi @Michael Poremba and everyone in this conversation! I believe all your points are more than fair, and noting that there hasn't been a feature request raised for this, I went ahead and created one: JRACLOUD-84617 - Remove shading from image previews

I added a synthesized version of your suggestions there, according to what I think are the most feasible and effective ones, but feel free to expand in the feature request by adding a comment of your own.

For everyone interested in this, please remember to hit the "Vote for this issue" link on the right side of that issue.
A reminder that adding a comment ("+1 for this", or similar) does not count as a vote.

Jeffrey Pilley

Hi. I do graphics, so it is super-annoying when my artwork all-of-a-sudden has gradients/shading when I submit it to my superiors. So..... Here is a solution: All you have to do is click on the top bar of your browser. OR, just wait a few seconds for it to disappear. It takes focus off the "active window" and removes the gradient. A simple, annoying solution for now. You just have to tell anyone you are submitting your work to: "I just finished my assignment. You can find it here (LINK). Just remember to click on the top of your browser bar for each image you view, OR keep your mouse completely motionless for a few seconds for each image you are looking at. And since I shared 20 images with you, all you have to do is wait 3 seconds times 20 images so it doesn't look inaccurate. That's a reasonable request, right?" Ahh"features". Gotta love 'em

Rene C. [Atlassian Support]

Perfectly reasonable request and great workarounds! It is funny when we try to do something with the best intentions (on any level of life) and turns out to be more inconvenient than helpful.

Since the best way we have to gather feedback for changes is through Suggestions/Feature requests, I went ahead and created:

JRACLOUD-84617 - Remove shading from image previews

Make sure to drop a vote (right side of the screen >Vote for this issue) and feel free to take your feedback and workarounds and also share them as a comment there!

Jeffrey Pilley

Hi Rene

Thank you so much for that.

I have worked with software companies for decades, and I love your comment on "we try to do something with the best intentions". I have been there so many times. One suggestion I had for making the interface "more cool" on a piece of audio software, was by adding gradients here and there to the GUI. It did look cool. BUT... this made many people mad at me because it created eye-strain. Apparently the old clunky/chunky version was easier to see. This was just around the time every software company on the planet was going with a more neutral "clean look". I missed the mark on that one. Again...with the best intentions" haha

I sincerely appreciate your help

Have a great day!

Samuel Thomas_x2l4uw

Please remove this useless feature!

Samuel Thomas_x2l4uw

Please remove this!

Rene C. [Atlassian Support]

Remember to add it into the feature request: JRACLOUD-84617 - Remove shading from image previews

Rene C. [Atlassian Support]

Hi, @Samuel Thomas ! This is a community thread and although product managers do check them when making their assessment about changing behaviors, the usual initial point is a feature request/suggestion, which can be found here: JRACLOUD-84617 - Remove shading from image previews. Cast your vote in it and add your feedback in it!

Welcome!

It looks like you're new here. Sign in or register to get started.

Quick Links

Find more posts tagged with

cloud

jira-software

jira-software-cloud