fix(react-menu): update styles to not use CSS shorthands

[layershifter]

Pull request checklist

• Addresses an existing issue: extracted from makeStyles: do not use shorthand expansion #20539, related to RFC: Do not allow CSS shorthands in makeStyles() calls #20573
• Include a change request file using $ yarn change

Description of changes

This PR:

• updates styles to not use CSS shorthands
• cleanups TODOs in stories

[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 8308d28:

Sandbox	Source
@fluentui/react 8 starter	Configuration
@fluentui/react-components 9 starter	Configuration

[fabricteam]

📊 Bundle size report

_{🤖 This report was generated against 39306b458b3cfe98ea83fc436ce9663f57f1590f}

[size-auditor]

Asset size changes

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

Baseline commit: 39306b458b3cfe98ea83fc436ce9663f57f1590f (build)

[fabricteam]

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
Avatar	mount	1002	947	5000
BaseButton	mount	989	992	5000
Breadcrumb	mount	2704	2733	1000
ButtonNext	mount	620	631	5000
Checkbox	mount	1592	1607	5000
CheckboxBase	mount	1380	1349	5000
ChoiceGroup	mount	4750	4716	5000
ComboBox	mount	1051	1083	1000
CommandBar	mount	10167	10036	1000
ContextualMenu	mount	16100	16073	1000
DefaultButton	mount	1197	1242	5000
DetailsRow	mount	3888	3804	5000
DetailsRowFast	mount	3775	3880	5000
DetailsRowNoStyles	mount	3643	3591	5000
Dialog	mount	2666	2575	1000
DocumentCardTitle	mount	283	253	1000
Dropdown	mount	3292	3240	5000
FluentProviderNext	mount	4290	4170	5000
FluentProviderWithTheme	mount	335	357	10
FluentProviderWithTheme	virtual-rerender	215	208	10
FluentProviderWithTheme	virtual-rerender-with-unmount	376	380	10
FocusTrapZone	mount	1864	1898	5000
FocusZone	mount	1947	1874	5000
IconButton	mount	1816	1811	5000
Label	mount	456	436	5000
Layer	mount	3033	3001	5000
Link	mount	583	586	5000
MakeStyles	mount	1907	1904	50000
MenuButton	mount	1566	1542	5000
MessageBar	mount	2064	2053	5000
Nav	mount	3311	3300	1000
OverflowSet	mount	1200	1201	5000
Panel	mount	2620	2595	1000
Persona	mount	923	954	1000
Pivot	mount	1519	1529	1000
PrimaryButton	mount	1354	1344	5000
Rating	mount	7661	7590	5000
SearchBox	mount	1377	1419	5000
Shimmer	mount	2594	2611	5000
Slider	mount	1965	2034	5000
SpinButton	mount	5085	4969	5000
Spinner	mount	543	553	5000
SplitButton	mount	3162	3160	5000
Stack	mount	607	617	5000
StackWithIntrinsicChildren	mount	1753	1764	5000
StackWithTextChildren	mount	4609	4600	5000
SwatchColorPicker	mount	10281	10332	5000
TagPicker	mount	2672	2667	5000
TeachingBubble	mount	12904	12940	5000
Text	mount	527	558	5000
TextField	mount	1470	1439	5000
ThemeProvider	mount	1271	1291	5000
ThemeProvider	virtual-rerender	724	705	5000
ThemeProvider	virtual-rerender-with-unmount	1981	1964	5000
Toggle	mount	908	908	5000
buttonNative	mount	244	244	5000

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions

Scenario	Current PR Ticks	Baseline Ticks	Ratio
TreeWith60ListItems.default	189	170	1.11:1
PortalMinimalPerf.default	197	181	1.09:1
DividerMinimalPerf.default	375	352	1.07:1
HeaderMinimalPerf.default	373	348	1.07:1
ChatWithPopoverPerf.default	396	372	1.06:1
GridMinimalPerf.default	347	328	1.06:1
ImageMinimalPerf.default	394	370	1.06:1
LabelMinimalPerf.default	389	374	1.04:1
RadioGroupMinimalPerf.default	448	431	1.04:1
SegmentMinimalPerf.default	360	345	1.04:1
AlertMinimalPerf.default	273	265	1.03:1
CardMinimalPerf.default	567	550	1.03:1
DialogMinimalPerf.default	776	757	1.03:1
MenuMinimalPerf.default	855	827	1.03:1
RefMinimalPerf.default	240	234	1.03:1
TextAreaMinimalPerf.default	509	494	1.03:1
ChatDuplicateMessagesPerf.default	309	304	1.02:1
DropdownMinimalPerf.default	3050	2976	1.02:1
FormMinimalPerf.default	404	396	1.02:1
ListNestedPerf.default	549	540	1.02:1
ReactionMinimalPerf.default	378	369	1.02:1
TableManyItemsPerf.default	1897	1860	1.02:1
TableMinimalPerf.default	401	394	1.02:1
ToolbarMinimalPerf.default	954	936	1.02:1
TooltipMinimalPerf.default	1054	1030	1.02:1
VideoMinimalPerf.default	607	593	1.02:1
AttachmentSlotsPerf.default	1065	1056	1.01:1
ButtonOverridesMissPerf.default	1679	1658	1.01:1
DropdownManyItemsPerf.default	675	669	1.01:1
ItemLayoutMinimalPerf.default	1199	1184	1.01:1
ListCommonPerf.default	628	621	1.01:1
ListMinimalPerf.default	520	515	1.01:1
ListWith60ListItems.default	663	658	1.01:1
ProviderMergeThemesPerf.default	1735	1713	1.01:1
AvatarMinimalPerf.default	205	205	1:1
ButtonSlotsPerf.default	546	545	1:1
CheckboxMinimalPerf.default	2690	2694	1:1
DatepickerMinimalPerf.default	5520	5536	1:1
EmbedMinimalPerf.default	4128	4129	1:1
SliderMinimalPerf.default	1662	1660	1:1
SplitButtonMinimalPerf.default	4252	4243	1:1
CustomToolbarPrototype.default	4044	4044	1:1
AttachmentMinimalPerf.default	164	165	0.99:1
BoxMinimalPerf.default	346	350	0.99:1
ChatMinimalPerf.default	665	673	0.99:1
InputMinimalPerf.default	1294	1301	0.99:1
MenuButtonMinimalPerf.default	1617	1633	0.99:1
PopupMinimalPerf.default	599	603	0.99:1
ProviderMinimalPerf.default	1092	1103	0.99:1
TextMinimalPerf.default	352	354	0.99:1
AccordionMinimalPerf.default	160	163	0.98:1
CarouselMinimalPerf.default	484	492	0.98:1
LoaderMinimalPerf.default	667	683	0.98:1
TreeMinimalPerf.default	787	804	0.98:1
AnimationMinimalPerf.default	420	433	0.97:1
LayoutMinimalPerf.default	363	374	0.97:1
RosterPerf.default	1178	1218	0.97:1
SkeletonMinimalPerf.default	351	362	0.97:1
StatusMinimalPerf.default	657	679	0.97:1
HeaderSlotsPerf.default	730	758	0.96:1
ButtonMinimalPerf.default	169	178	0.95:1
FlexMinimalPerf.default	286	302	0.95:1
IconMinimalPerf.default	588	616	0.95:1

[ling1726]

Thx for removing this uncaught gem 👍