Minor Styling issues in the new documentation

SonarQube
1

Hi all,

while using the new documentation for 7.4 (nice new design!) I noticed two rather minor issues

When you expand a menu entry in the left-hand side menu, a small slightly darker grayish triangle appears on a fixed position, that overlays the actual menu entry

image
image.png290Ă—634 23.2 KB

It is more noticeable / distracting when scrolling (I first thought it was an issue with my screen)
image
But it seems to be an actual element
image

I know, a tiny bug :slight_smile:

The other issue is with some table layouts, as for instance in the LDAP authentication (there I stumbled over it), where the column size of description is suboptimal

image
image.png1373Ă—537 46.1 KB

I was using Chrome Version 70.0.3538.77 (Offizieller Build) (64-Bit) on Windows 10

2

Hi Gerald,

I really need to start by saying:

Documentation Feedback!!!:tada::heart_eyes::sparkler::fireworks: Woo hoo!!!

Ahem… Now that I’ve got that out of my system :smile:…

I can’t reproduce the extra element in the navigation column. Can you provide browser details? Is the glitch there when you first paint the page? Every time/window width? After some action?

Regarding the tables… yeah. We know. I also can’t have linebreaks in table cells, which really limited our abilities. I hope to get this worked on. and your feedback will help in prioritizing it. (Tell all your friends! :wink:)

 
Ann

3

It seems to occur only on 3rd-level menu entries, like this https://docs.sonarqube.org/latest/instance-administration/quality-profiles/

probably it belongs to the ballon-tip-style
grafik
but it’s position is fixed, which becomes visible when you scroll
grafik

I have this issue on

  • Chrome Version 70.0.3538.77 (Official Build) (64-Bit)
  • Chrome Version 69.0.3497.100 (Official Build) (64-bit)
  • Firefox 62.0.3 (64-Bit)
  • Microsoft Edge 42.17134.1.0
  • Internet Explorer 11.285.1734.0
    all on Windows 10 Version 1803 (Build 17134…286)

I have the issues on multiple window sizes, given the window height is enough to display a scrollable area. The issue only becomes really apparent once you vertically scroll the menu.
Example (edge):

grafik
grafik.png935Ă—1028 96.3 KB

Now Scroll Down
grafik
grafik.png935Ă—1028 99.6 KB

And it’s really hard to spot because the two colors (blueish gray on lighter gray) have very low contrast, but it gets more visible when the triangle overlays other menu entries.

4

Hi,

Thanks for your patience. I finally get/see it. We’ve already changed the page-level ToC behavior for 7.5, and the new version moves it to float on the right. You can see in action here:

https://docs3.sonarqube.org/latest/instance-administration/quality-profiles/

And BTW, we’re planning to implement this same functionality in the embedded docs as well:

SONAR-11282 - Enhance embedded docs navigation sidebar

Any additional feedback would be most welcome.

 
Ann

5

Ah, I see, yes the 7.5 docs don’t have this issue
and I’m sure you’ve already stumbled over this :slight_smile:

grafik
grafik.png1551Ă—385 42.1 KB

6

Yes, unfortunately I have. :roll_eyes:

The problem here (in case you care) is that we have a fixed content width that the table is breaking out of. And the limits on what we can do in a table combine with everything we need to cram into that table to make it decidedly awkward on some pages. Hopefully we’ll be able to do more in tables “soon” (altho this is not minor from a technical standpoint) and then we can address this overlap.

Thanks for pointing it out! Keep the feedback coming!

 
Thx,
Ann