You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Something I've noticed frequently when working with Primer components in flex layouts is that because of the way icon buttons are laid out (using width instead of padding to create the spacing around the sides) they are happy to shrink down to a thin rectangle if a flex layout asks them to. This is frequently a very subtle bug for two reasons: first, shrinking typically requires extra long content in the first place to cause the flex layout to need more space. And also, if button is variant=invisible as IconButtons often are, the shrinking is only apparent on hover.
IconButton should always be a square, so there's no risk to just adding flex-shrink: 0 by default to prevent this.
Something I've noticed frequently when working with Primer components in flex layouts is that because of the way icon buttons are laid out (using width instead of padding to create the spacing around the sides) they are happy to shrink down to a thin rectangle if a flex layout asks them to. This is frequently a very subtle bug for two reasons: first, shrinking typically requires extra long content in the first place to cause the flex layout to need more space. And also, if button is
variant=invisibleasIconButtons often are, the shrinking is only apparent on hover.IconButtonshould always be a square, so there's no risk to just addingflex-shrink: 0by default to prevent this.Example (https://github.com/github/copilot-productivity/issues/3222) note how this copy button shrinks down to a rectangle when the code here is long enough to make the flex layout try to shrink it:
Screen.Recording.2024-12-06.at.9.46.08.AM.mov