GSB default slotted content is difficult to center on page #933
kiley-mitti
started this conversation in
Feature Requests
Replies: 1 comment 1 reply
-
We have added two more shadow parts to the global status bar, one surrounding the app meta and the other to the container of the default slot. While this won't automatically center the content of the default slot on the page, it will allow for easier styling so that the default slot can be more easily centered on the page if that is what the developer wishes to do. This change should be released next Thursday 12/01/22 |
Beta Was this translation helpful? Give feedback.
1 reply
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Describe the issue
It's not really a bug so much as a nit that we could improve.
When the right side of the default slotted content is a different width than the left side of the GSB content, the content in the default slot is challenging to properly center on the page.
Normally this could be done using flex box but the div around default slot isn't accessible in shadow parts and has a flex-basis of 100%.
Current behavior
It is difficult to center default slotted content on the GSB (such as ) with regard to the entire width of the page. It DOES center in its own element (the div around default slot) just fine.
Desired behavior
It would be nice if devs had extra control over the flex box elements that make up the GSB so that it would be easier to do things like center this content.
Screenshots
CodeSandbox
Check out the example on a larger screen: CodeSandbox
Environment (please complete the following information):
Additional context
I think we could just add a couple more shadow parts to accomplish this. We also may want to check out the css on the div around default slot.
Beta Was this translation helpful? Give feedback.
All reactions