Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(Datepicker): update 'today' cell background color in dark-v2 theme to increase contrast #18461

Merged
merged 3 commits into from
Jun 7, 2021

Conversation

YuanboXue-Amber
Copy link
Contributor

Pull request checklist

Description of changes

Datepicker's 'today' cell uses default backgroundFocus as background color. But it does not have enough contrast in dark-v2 theme:
Screenshot 2021-06-07 at 11 40 22

This PR added override in dark-v2 theme, with default background as background color:
Screenshot 2021-06-07 at 11 39 44
based on the suggestions in the original issue

Focus areas to test

(optional)

@YuanboXue-Amber YuanboXue-Amber enabled auto-merge (squash) June 7, 2021 09:47
@size-auditor
Copy link

size-auditor bot commented Jun 7, 2021

Asset size changes

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

Baseline commit: 6ef805ad0bda6dcde322ddb66587a1a9f0878dcd (build)

@fabricteam
Copy link
Collaborator

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 841 803 5000
BaseButton mount 934 923 5000
Breadcrumb mount 2638 2624 1000
ButtonNext mount 463 505 5000
Checkbox mount 1504 1515 5000
CheckboxBase mount 1289 1257 5000
ChoiceGroup mount 4638 4658 5000
ComboBox mount 959 973 1000
CommandBar mount 10073 10112 1000
ContextualMenu mount 6080 6126 1000
DefaultButton mount 1107 1111 5000
DetailsRow mount 3663 3730 5000
DetailsRowFast mount 3677 3654 5000
DetailsRowNoStyles mount 3552 3443 5000
Dialog mount 2125 2109 1000
DocumentCardTitle mount 142 152 1000
Dropdown mount 3179 3166 5000
FocusTrapZone mount 1761 1799 5000
FocusZone mount 1848 1773 5000
IconButton mount 1700 1713 5000
Label mount 334 322 5000
Layer mount 1743 1742 5000
Link mount 444 446 5000
MakeStyles mount 1741 1779 50000
MenuButton mount 1442 1414 5000
MessageBar mount 2019 1976 5000
Nav mount 3173 3173 1000
OverflowSet mount 1029 1016 5000
Panel mount 2054 2050 1000
Persona mount 815 821 1000
Pivot mount 1352 1372 1000
PrimaryButton mount 1287 1273 5000
Rating mount 7670 7464 5000
SearchBox mount 1278 1295 5000
Shimmer mount 2448 2433 5000
Slider mount 1919 1950 5000
SpinButton mount 4859 4811 5000
Spinner mount 418 402 5000
SplitButton mount 3066 3084 5000
Stack mount 473 486 5000
StackWithIntrinsicChildren mount 1486 1475 5000
StackWithTextChildren mount 4413 4395 5000
SwatchColorPicker mount 9925 9939 5000
Tabs mount 1383 1347 1000
TagPicker mount 2360 2396 5000
TeachingBubble mount 11671 11700 5000
Text mount 403 412 5000
TextField mount 1328 1338 5000
ThemeProvider mount 1167 1178 5000
ThemeProvider virtual-rerender 584 593 5000
ThemeProviderNext mount 7069 7038 5000
Toggle mount 800 784 5000
buttonNative mount 112 117 5000

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
ButtonMinimalPerf.default 164 153 1.07:1
ReactionMinimalPerf.default 376 352 1.07:1
ListNestedPerf.default 549 520 1.06:1
AvatarMinimalPerf.default 191 183 1.04:1
CardMinimalPerf.default 547 524 1.04:1
ImageMinimalPerf.default 375 361 1.04:1
LayoutMinimalPerf.default 370 356 1.04:1
PortalMinimalPerf.default 175 168 1.04:1
SegmentMinimalPerf.default 345 332 1.04:1
SkeletonMinimalPerf.default 357 344 1.04:1
TableMinimalPerf.default 419 402 1.04:1
AttachmentSlotsPerf.default 1132 1103 1.03:1
ChatWithPopoverPerf.default 361 352 1.03:1
FlexMinimalPerf.default 277 268 1.03:1
HeaderSlotsPerf.default 760 735 1.03:1
MenuMinimalPerf.default 848 826 1.03:1
SliderMinimalPerf.default 1594 1546 1.03:1
TextMinimalPerf.default 351 341 1.03:1
ButtonOverridesMissPerf.default 1673 1642 1.02:1
DropdownManyItemsPerf.default 679 668 1.02:1
GridMinimalPerf.default 334 327 1.02:1
HeaderMinimalPerf.default 354 347 1.02:1
LabelMinimalPerf.default 378 370 1.02:1
LoaderMinimalPerf.default 695 682 1.02:1
PopupMinimalPerf.default 570 557 1.02:1
TableManyItemsPerf.default 1874 1840 1.02:1
ToolbarMinimalPerf.default 923 904 1.02:1
TreeMinimalPerf.default 804 789 1.02:1
DialogMinimalPerf.default 755 748 1.01:1
FormMinimalPerf.default 393 390 1.01:1
InputMinimalPerf.default 1255 1248 1.01:1
ItemLayoutMinimalPerf.default 1249 1237 1.01:1
ProviderMergeThemesPerf.default 1670 1655 1.01:1
ProviderMinimalPerf.default 959 945 1.01:1
RefMinimalPerf.default 243 241 1.01:1
SplitButtonMinimalPerf.default 3692 3648 1.01:1
TooltipMinimalPerf.default 971 960 1.01:1
AttachmentMinimalPerf.default 152 152 1:1
CarouselMinimalPerf.default 457 458 1:1
ChatDuplicateMessagesPerf.default 284 284 1:1
DatepickerMinimalPerf.default 5377 5370 1:1
EmbedMinimalPerf.default 4075 4077 1:1
TextAreaMinimalPerf.default 488 489 1:1
AnimationMinimalPerf.default 403 409 0.99:1
BoxMinimalPerf.default 341 345 0.99:1
ChatMinimalPerf.default 599 604 0.99:1
DropdownMinimalPerf.default 3038 3062 0.99:1
ListCommonPerf.default 615 624 0.99:1
StatusMinimalPerf.default 655 661 0.99:1
CustomToolbarPrototype.default 3739 3790 0.99:1
ButtonSlotsPerf.default 547 557 0.98:1
CheckboxMinimalPerf.default 2707 2755 0.98:1
ListMinimalPerf.default 493 502 0.98:1
MenuButtonMinimalPerf.default 1540 1565 0.98:1
IconMinimalPerf.default 597 611 0.98:1
AccordionMinimalPerf.default 146 151 0.97:1
RadioGroupMinimalPerf.default 431 444 0.97:1
AlertMinimalPerf.default 266 277 0.96:1
RosterPerf.default 1126 1169 0.96:1
TreeWith60ListItems.default 161 168 0.96:1
DividerMinimalPerf.default 345 363 0.95:1
ListWith60ListItems.default 598 645 0.93:1
VideoMinimalPerf.default 612 665 0.92:1

@YuanboXue-Amber YuanboXue-Amber merged commit 5410ece into microsoft:master Jun 7, 2021
@YuanboXue-Amber YuanboXue-Amber deleted the datepicker-today branch June 7, 2021 14:13
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

React-northstar Datepicker - current day indicator contrast
5 participants