fix: update background to Canvas and color to CanvasText in high contrast

[khamudom]

Pull request checklist

• Addresses an existing issue: Fixes #0000
• Include a change request file using $ yarn change

Description of changes

changed the background on the card component to Canvas and the color to CanvasText

Focus areas to test

(optional)

[fabricteam]

📊 Bundle size report

_{🤖 This report was generated against d65c09077575d1a42ae9beb9ddd8a7b94452e13b}

[size-auditor]

Asset size changes

Size Auditor did not detect a change in bundle size for any component!

Baseline commit: d65c09077575d1a42ae9beb9ddd8a7b94452e13b (build)

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit e0a0e06:

Sandbox	Source
Fluent UI React Starter	Configuration

[fabricteam]

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
Avatar	mount	861	888	5000
BaseButton	mount	912	928	5000
Breadcrumb	mount	2614	2660	1000
ButtonNext	mount	429	437	5000
Checkbox	mount	1539	1539	5000
CheckboxBase	mount	1291	1266	5000
ChoiceGroup	mount	4716	4774	5000
ComboBox	mount	1017	955	1000
CommandBar	mount	10315	10286	1000
ContextualMenu	mount	6342	6362	1000
DefaultButton	mount	1149	1146	5000
DetailsRow	mount	3809	3823	5000
DetailsRowFast	mount	3705	3788	5000
DetailsRowNoStyles	mount	3587	3627	5000
Dialog	mount	2127	2133	1000
DocumentCardTitle	mount	153	140	1000
Dropdown	mount	3267	3248	5000
FluentProviderNext	mount	7514	7580	5000
FocusTrapZone	mount	1829	1756	5000
FocusZone	mount	1850	1834	5000
IconButton	mount	1742	1756	5000
Label	mount	341	326	5000
Layer	mount	1781	1764	5000
Link	mount	470	481	5000
MakeStyles	mount	1843	1862	50000
MenuButton	mount	1438	1444	5000
MessageBar	mount	2056	2086	5000
Nav	mount	3257	3289	1000
OverflowSet	mount	1066	1046	5000
Panel	mount	2071	2109	1000
Persona	mount	831	832	1000
Pivot	mount	1410	1419	1000
PrimaryButton	mount	1313	1299	5000
Rating	mount	7660	7596	5000
SearchBox	mount	1333	1310	5000
Shimmer	mount	2572	2621	5000
Slider	mount	1952	1987	5000
SpinButton	mount	5030	5026	5000
Spinner	mount	433	444	5000
SplitButton	mount	3193	3254	5000
Stack	mount	508	509	5000
StackWithIntrinsicChildren	mount	1520	1483	5000
StackWithTextChildren	mount	4471	4500	5000
SwatchColorPicker	mount	10271	10172	5000
Tabs	mount	1404	1439	1000
TagPicker	mount	2544	2595	5000
TeachingBubble	mount	11974	11976	5000
Text	mount	418	407	5000
TextField	mount	1363	1387	5000
ThemeProvider	mount	1215	1193	5000
ThemeProvider	virtual-rerender	596	612	5000
Toggle	mount	809	813	5000
buttonNative	mount	103	122	5000

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions

Scenario	Current PR Ticks	Baseline Ticks	Ratio
AccordionMinimalPerf.default	162	142	1.14:1
AvatarMinimalPerf.default	210	189	1.11:1
AttachmentMinimalPerf.default	159	150	1.06:1
FlexMinimalPerf.default	304	286	1.06:1
ListNestedPerf.default	569	537	1.06:1
SkeletonMinimalPerf.default	359	340	1.06:1
LayoutMinimalPerf.default	399	381	1.05:1
AlertMinimalPerf.default	275	265	1.04:1
HeaderSlotsPerf.default	780	748	1.04:1
InputMinimalPerf.default	1284	1231	1.04:1
ReactionMinimalPerf.default	386	371	1.04:1
TextMinimalPerf.default	345	332	1.04:1
RadioGroupMinimalPerf.default	442	428	1.03:1
CardMinimalPerf.default	554	544	1.02:1
ChatDuplicateMessagesPerf.default	285	280	1.02:1
DialogMinimalPerf.default	769	751	1.02:1
DividerMinimalPerf.default	352	345	1.02:1
DropdownManyItemsPerf.default	683	669	1.02:1
HeaderMinimalPerf.default	365	357	1.02:1
LabelMinimalPerf.default	387	380	1.02:1
ListMinimalPerf.default	510	499	1.02:1
ProviderMinimalPerf.default	974	959	1.02:1
TableManyItemsPerf.default	1915	1876	1.02:1
TableMinimalPerf.default	402	394	1.02:1
TreeWith60ListItems.default	173	170	1.02:1
AnimationMinimalPerf.default	409	406	1.01:1
AttachmentSlotsPerf.default	1078	1065	1.01:1
BoxMinimalPerf.default	346	343	1.01:1
ChatMinimalPerf.default	642	635	1.01:1
ItemLayoutMinimalPerf.default	1246	1230	1.01:1
ListWith60ListItems.default	645	638	1.01:1
MenuMinimalPerf.default	859	849	1.01:1
MenuButtonMinimalPerf.default	1648	1639	1.01:1
PortalMinimalPerf.default	174	173	1.01:1
ProviderMergeThemesPerf.default	1691	1679	1.01:1
RefMinimalPerf.default	236	233	1.01:1
SegmentMinimalPerf.default	344	339	1.01:1
SliderMinimalPerf.default	1538	1525	1.01:1
IconMinimalPerf.default	615	609	1.01:1
ToolbarMinimalPerf.default	939	932	1.01:1
TreeMinimalPerf.default	794	787	1.01:1
DropdownMinimalPerf.default	3143	3130	1:1
EmbedMinimalPerf.default	4110	4111	1:1
FormMinimalPerf.default	397	397	1:1
GridMinimalPerf.default	330	329	1:1
PopupMinimalPerf.default	581	583	1:1
CustomToolbarPrototype.default	3797	3813	1:1
VideoMinimalPerf.default	611	611	1:1
ButtonOverridesMissPerf.default	1687	1712	0.99:1
CarouselMinimalPerf.default	455	459	0.99:1
CheckboxMinimalPerf.default	2726	2763	0.99:1
ImageMinimalPerf.default	368	373	0.99:1
LoaderMinimalPerf.default	693	703	0.99:1
SplitButtonMinimalPerf.default	3724	3759	0.99:1
StatusMinimalPerf.default	659	668	0.99:1
TextAreaMinimalPerf.default	477	484	0.99:1
ButtonSlotsPerf.default	528	540	0.98:1
DatepickerMinimalPerf.default	5430	5545	0.98:1
TooltipMinimalPerf.default	1004	1023	0.98:1
ButtonMinimalPerf.default	159	166	0.96:1
ChatWithPopoverPerf.default	363	382	0.95:1
ListCommonPerf.default	633	678	0.93:1
RosterPerf.default	1103	1180	0.93:1

[msft-fluent-ui-bot]

🎉@fluentui/[email protected] has been released which incorporates this pull request.:tada:

Handy links:

• Release Notes
• Official NPM Release