fix: content switcher icon position

[lee-chase]

Icons not positioned correctly in the content switcher.

Changelog

Changed

• src/components/content-switcher/_content-switcher.scss

Testing / Reviewing

The content switcher icon should align centrally with the text.

See https://codepen.io/lee-chase/pen/mgmmEN with an example of fix.

[netlify]

Deploy preview for the-carbon-components ready!

Built with commit de8f984

https://deploy-preview-2290--the-carbon-components.netlify.com

[asudoh]

Hi @lee-chase thank you for trying to address the use case - CC @IBM/carbon-designers to make sure that icon in content switch won't be a problem. BTW comparing https://deploy-preview-2290--the-carbon-components.netlify.com/?nav=content-switcher and https://the-carbon-components.netlify.com/?nav=content-switcher there are some content misalignments - Would you want to try to fix? Thanks!

[lee-chase]

@asudoh Fix attempted ;-)

p.s. Assuming you were referring to the overflow.

[asudoh]

Thanks @lee-chase for your quick fix! A couple wrt the update:

• Do we still need text-overflow style in content switcher button?
• Given this is a markup change, are you willing to change our React variant as well?

[lee-chase]

Thanks @lee-chase for your quick fix! A couple wrt the update:

• Do we still need text-overflow style in content switcher button?
• Given this is a markup change, are you willing to change our React variant as well?

Ah yes a bit slapdash of me, hmm must read up on what TDD has to say for superfluous code but harmless code. Probably it isn't broke don't fix it.

Strictly speaking, as there's no space between a potential icon and the label you could lose the white-space: nowrap on the btn too. Not sure I'd want to guarantee browser consistency though.

React change.. I could probably manage that, but I'd feel a little dirty ;-)

Not tonight though.

[lee-chase]

@asudoh done

[asudoh]

Thanks @lee-chase for the update!