Sidebar content overflows into next element

[Krismix1]

Describe the bug
The content of the sidebar overflows. See attached picture.

To Reproduce
Steps to reproduce the behaviour:

1. Go to a page that has the sidebar + search input, e.g. https://cucumber.io/docs/gherkin/reference/
2. Wait for the search input to load
3. See error

Expected behaviour
The content to not overflow.

Screenshots

Desktop (please complete the following information):

• OS: Linux
• Browser: Firefox Developer Edition
• Version: 95.0b12 (64-bit)
  I can also reproduce it in Chromium Version 96.0.4664.45 (Official Build) and Chrome Version 96.0.4664.45, both with an out-of-the-box setup.

Aditional context
It would seem the initial height calculation does not take into account the height of the search input and it is not recalculated when the input loads.
If the open or resize the browser devtools, or resize the browser window, the height of the scrollable content is adjusted and the issue is no longer visible.

[aurelien-reeves]

Thanks for the report :)

[aurelien-reeves]

@declark this seems to be related to the smartbear stylesheet.
Could you please take a look?

[10xtechie]

@aurelien-reeves ,
I have found the same issue on Chrome - version 102.0.5005.61 (Official Build) (x86_64) on Mac OS - at https://cucumber.io/docs/guides/10-minute-tutorial/

I have found that inline css rule are injected by the following codes.

docs/themes/cucumber-sb/static/js/cucumber-sb.min.js

Lines 7827 to 7829 in 2663a28

	_sidebar.height(winHeight - menuHeight).width(_sidebar.parent().width());
	$(sidebarClass + "-fixed").height(winHeight - menuHeight).width(_sidebar.parent().width());
	_sidebarNav.height(winHeight - menuHeight - _panelBottom - _panelSearch - 20).width(_sidebar.parent().width());

Also, here is the screenshot of Chrome's dev-tool.

I believe the above codes are the root cause of this issue. Please let me know what you think :)

[aurelien-reeves]

Thanks

Indeed, that looks related.

@declark do you know who at smartbear could help with this?

[mlvandijk]

@mattwynne Is there anyone at the Smartbear team that could pick this up?

[mattwynne]

@mattwynne Is there anyone at the Smartbear team that could pick this up?

I've assigned it to Doug Clarke, and I will ping him in Slack too to make sure it's come to his attention.