microsoft / essex-toolkit

Provides a set of useful tools, utilities, reusable components, and React hooks that are designed to capture common components and utilities common among Essex Alpha team projects.
https://microsoft.github.io/essex-toolkit/
MIT License
19 stars 7 forks source link

add icon and title to button choice #167

Closed dayesouza closed 2 years ago

natoverse commented 1 year ago

That should definitely work - does the theme say isInverted when in dark mode?

Get Outlook for iOShttps://aka.ms/o0ukef


From: Dayenne Souza @.> Sent: Friday, September 30, 2022 12:36:06 PM To: microsoft/essex-toolkit @.> Cc: Nathan Evans @.>; Comment @.> Subject: Re: [microsoft/essex-toolkit] add icon and title to button choice (PR #167)

@dayesouza commented on this pull request.


In packages/components/src/ButtonChoiceGroup/ButtonChoiceGroup.tsxhttps://nam06.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fmicrosoft%2Fessex-toolkit%2Fpull%2F167%23discussion_r984896768&data=05%7C01%7CNathan.Evans%40microsoft.com%7C511550bd2d8c4375e10308daa31b04ae%7C72f988bf86f141af91ab2d7cd011db47%7C1%7C0%7C638001633688181295%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000%7C%7C%7C&sdata=qETHtG9FFjTO3iKYHYiggB6SU1%2ByJDpkHo3IOx%2FhAYM%3D&reserved=0:

@@ -36,12 +43,13 @@ export const ButtonChoiceGroup: React.FC = memo( root: { margin: 'unset', borderRadius: '2px',

  • backgroundColor: thematic.application().background().hex(),

I tried that, but then when it's dark mode it will continue as white

— Reply to this email directly, view it on GitHubhttps://nam06.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fmicrosoft%2Fessex-toolkit%2Fpull%2F167%23discussion_r984896768&data=05%7C01%7CNathan.Evans%40microsoft.com%7C511550bd2d8c4375e10308daa31b04ae%7C72f988bf86f141af91ab2d7cd011db47%7C1%7C0%7C638001633688181295%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000%7C%7C%7C&sdata=qETHtG9FFjTO3iKYHYiggB6SU1%2ByJDpkHo3IOx%2FhAYM%3D&reserved=0, or unsubscribehttps://nam06.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fnotifications%2Funsubscribe-auth%2FAAFPZUZEMPMHWRM5XIOUG7DWA46KNANCNFSM6AAAAAAQZ66XA4&data=05%7C01%7CNathan.Evans%40microsoft.com%7C511550bd2d8c4375e10308daa31b04ae%7C72f988bf86f141af91ab2d7cd011db47%7C1%7C0%7C638001633688337961%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000%7C%7C%7C&sdata=BsrZ4z4BD9%2BRmpmNEdS9yf6XrUqDNw%2BwxfVs0lpa3KE%3D&reserved=0. You are receiving this because you commented.Message ID: @.***>

dayesouza commented 1 year ago

That should definitely work - does the theme say isInverted when in dark mode? Get Outlook for iOShttps://aka.ms/o0ukef ____ From: Dayenne Souza @.> Sent: Friday, September 30, 2022 12:36:06 PM To: microsoft/essex-toolkit @.> Cc: Nathan Evans @.>; Comment @.> Subject: Re: [microsoft/essex-toolkit] add icon and title to button choice (PR #167) @dayesouza commented on this pull request. ____ In packages/components/src/ButtonChoiceGroup/ButtonChoiceGroup.tsxhttps://nam06.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fmicrosoft%2Fessex-toolkit%2Fpull%2F167%23discussion_r984896768&data=05%7C01%7CNathan.Evans%40microsoft.com%7C511550bd2d8c4375e10308daa31b04ae%7C72f988bf86f141af91ab2d7cd011db47%7C1%7C0%7C638001633688181295%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000%7C%7C%7C&sdata=qETHtG9FFjTO3iKYHYiggB6SU1%2ByJDpkHo3IOx%2FhAYM%3D&reserved=0: @@ -36,12 +43,13 @@ export const ButtonChoiceGroup: React.FC = memo( root: { margin: 'unset', borderRadius: '2px', + backgroundColor: thematic.application().background().hex(), I tried that, but then when it's dark mode it will continue as white — Reply to this email directly, view it on GitHubhttps://nam06.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fmicrosoft%2Fessex-toolkit%2Fpull%2F167%23discussion_r984896768&data=05%7C01%7CNathan.Evans%40microsoft.com%7C511550bd2d8c4375e10308daa31b04ae%7C72f988bf86f141af91ab2d7cd011db47%7C1%7C0%7C638001633688181295%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000%7C%7C%7C&sdata=qETHtG9FFjTO3iKYHYiggB6SU1%2ByJDpkHo3IOx%2FhAYM%3D&reserved=0, or unsubscribehttps://nam06.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fnotifications%2Funsubscribe-auth%2FAAFPZUZEMPMHWRM5XIOUG7DWA46KNANCNFSM6AAAAAAQZ66XA4&data=05%7C01%7CNathan.Evans%40microsoft.com%7C511550bd2d8c4375e10308daa31b04ae%7C72f988bf86f141af91ab2d7cd011db47%7C1%7C0%7C638001633688337961%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000%7C%7C%7C&sdata=BsrZ4z4BD9%2BRmpmNEdS9yf6XrUqDNw%2BwxfVs0lpa3KE%3D&reserved=0. You are receiving this because you commented.Message ID: @.***>

I just tested and now it works. I don't know what was happening before O_O