[EuiPagination] Hide of text on small screens
#4661
Conversation
|
Preview documentation changes for this PR: https://eui.elastic.co/pr_4661/ |
There was a problem hiding this comment.
Can you check the alignments out in the default theme too? It looks like they get wonky again:
And maybe there's a way to get the of text to be the same size as the button text in both themes? I"m thinking that maybe the x-small empty buttons for the numbers are just too small and could just be s.
| }} | ||
| /> | ||
| </EuiText> | ||
| <EuiHideFor sizes={['xs', 's']}> |
There was a problem hiding this comment.
Nice! This may even open it up for consumers to be able to customize these breakpoint sizes ❤️
|
Preview documentation changes for this PR: https://eui.elastic.co/pr_4661/ |
Co-authored-by: Caroline Horn <[email protected]>
…miukimiu/eui into pagination-hide-when-compressed
|
Preview documentation changes for this PR: https://eui.elastic.co/pr_4661/ |
|
jenkins test this |
|
Preview documentation changes for this PR: https://eui.elastic.co/pr_4661/ |
Summary
This PR fixes #4654. The
oftext was showing on small screens for compressed EuiPagination. Now, this text is hidden inxsandsscreens.I also fixed a center aligning issue in WebKit browsers. As we can see in the first image the
ofwas not center aligned.Checklist
[ ] Props have proper autodocs and playground toggles[ ] Added documentation[ ] Checked Code Sandbox works for the any docs examples[ ] Added or updated jest tests[ ] Checked for breaking changes and labeled appropriately[ ] Checked for accessibility including keyboard-only and screenreader modes