Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[Search] [Playground] Re-enable Full width view + fix scrollbar issue (…
…#183213) ## Summary Fixes two issues: - the view should be full width, so removing restrictWidth option - in serverless, the content view was scrollable, even when the vertical content did not exceed the screen. On scrollbar fix: - grow adds a `min-block-size: max($minHeight, 100vh)`. minHeight is by default 460px. 100vh which doesn't take into account the header, adding a scrollbar with extra size from header. A fix ive seen other solutions do is either specify 0 in minHeight (which omits the block-size css style which is a side-effect) or switch off grow (`min-block-size:$minHeight`). I've opted for grow=false as our children components manage the height. **Without fix** <img width="1789" alt="image" src="https://github.com/elastic/kibana/assets/49480/1eb7bc88-f4a4-4544-8e69-a3621e365966"> **With fix** <img width="1562" alt="image" src="https://github.com/elastic/kibana/assets/49480/5569d3be-fda3-48f9-bb60-3cb8af90469d"> ### Checklist Delete any items that are not applicable to this PR. - [ ] Any text added follows [EUI's writing guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses sentence case text and includes [i18n support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md) - [ ] [Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html) was added for features that require explanation or tutorials - [ ] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios - [ ] [Flaky Test Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was used on any tests changed - [ ] Any UI touched in this PR is usable by keyboard only (learn more about [keyboard accessibility](https://webaim.org/techniques/keyboard/)) - [ ] Any UI touched in this PR does not create any new axe failures (run axe in browser: [FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/), [Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US)) - [ ] If a plugin configuration key changed, check if it needs to be allowlisted in the cloud and added to the [docker list](https://github.com/elastic/kibana/blob/main/src/dev/build/tasks/os_packages/docker_generator/resources/base/bin/kibana-docker) - [ ] This renders correctly on smaller devices using a responsive layout. (You can test this [in your browser](https://www.browserstack.com/guide/responsive-testing-on-local-server)) - [x] This was checked for [cross-browser compatibility](https://www.elastic.co/support/matrix#matrix_browsers) - [x] Tested in both serverless and stateful ### For maintainers - [ ] This was checked for breaking API changes and was [labeled appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) --------- Co-authored-by: Kibana Machine <[email protected]>
- Loading branch information