Select to view content in your preferred language

calcite shell panel display help

81
2
Jump to solution
a week ago
DeanWilson
Regular Contributor

I'm attempting to kind of mimic the foldable theme from web appbuilder into the calcite design system via web components.  I have almost all of it completely developed except for the attribute table widget (normally at the bottom of the application).  Looking at this screenshot:

DeanWilson_0-1758812607323.png

 

You can see that the shell panel is set to the panel-end slot.   When it's like this, anything put into the panel-bottom slot loses that width. Like in this screenshot:

DeanWilson_1-1758812829016.png

 


Now. If I assign to panel-top for the ui components instead of the panel-end slot, it indeed gives me full width on the panel-bottom attached calcite-shell-panel.  The problem is now my ui components are shifted to the left, as in this screenshot:  

DeanWilson_2-1758812871561.png

 




I tried flexing them in css to justify-content at the end but to no avail.  I have other issues I need to address but this is the first one I'm trying to tackle and can't seem to find a resolution. Any thoughts to how I can accomplish this?  Claude has been no help.  LOL

 

Thanks in advance!

 

Dean Wilson

0 Kudos
1 Solution

Accepted Solutions
DeanWilson
Regular Contributor

I just said forget it and I'm using my own shell setup with media queries. Seems to be working out great now. 

View solution in original post

0 Kudos
2 Replies
DeanWilson
Regular Contributor

Bump!

0 Kudos
DeanWilson
Regular Contributor

I just said forget it and I'm using my own shell setup with media queries. Seems to be working out great now. 

0 Kudos