calcite-shell needs content-behind to use display-mode="float"?

LefterisKoumis — Fri, 21 Jul 2023 16:26:30 GMT

I have two shell panels for each side of the app. I'd like to use the end panel with an adjustable height.

So the script is like this:

<calcite-shell content-behind> <calcite-shell-panel slot="panel-start" collapsed id="shell-panel-start" position="start" width-scale="l" display-mode="dock"> ---- ----- </calcite-shell-panel> <calcite-shell-panel slot="panel-end" position="end" resizable width-scale="l" display-mode="float"> <div style="height:500px"><p>THis is a test</p></div> </calcite-shell-panel> </calcite-shell>

https://codepen.io/lkoumis1/pen/BaGJeaK

In addition, I'd like to use the the features widget and see the popup in the start panel without overlapping the map. Thanks to @KittyHurley I was informed to see the popup without overlapping the map, I will need to remove the content-behind from the calcite-shell.

However, when I remove content-behind, the end panel height changes to 100% even though it is set to display-mode to "float"

Suggestions?

@KittyHurley @BenElan

Re: calcite-shell needs content-behind to use display-mode="float"?

KittyHurley — Fri, 21 Jul 2023 16:57:34 GMT

This would be a great enhancement, there is an open enhancement request at https://github.com/Esri/calcite-design-system/issues/1932. Just added additional context to the issue with the use case for context and have escalated the request for consideration.

As a workaround in the meantime, could leverage adding an element using the view.ui from the Maps SDK, something like this perhaps: https://codepen.io/geospatialem/pen/oNQyaPM.

topic calcite-shell needs content-behind to use display-mode="float"? in Calcite Design System Questions

calcite-shell needs content-behind to use display-mode="float"?

Re: calcite-shell needs content-behind to use display-mode="float"?