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(react-input): Remove box-shadow from Input filled appearances #24491

Merged
merged 3 commits into from
Aug 23, 2022

Conversation

sopranopillow
Copy link
Contributor

Current Behavior

Input has a box-shadow in filled appearances.

image
Note: I've removed the contrasting background and made the label black to differentiate the before and after.

New Behavior

Input does not have a box-shadow in filled appearances.

image
Note: I've removed the contrasting background and made the label black to differentiate the before and after.

Note: this is the only input control that has this box-shadow, here's a list of the files that have a box-shadow:

image

Related Issue(s)

Fixes #24076

@codesandbox-ci
Copy link

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 34d2e9a:

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

@fabricteam
Copy link
Collaborator

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-input
Input
23.554 kB
7.644 kB
23.498 kB
7.617 kB
-56 B
-27 B
react-spinbutton
SpinButton
43.899 kB
12.362 kB
43.843 kB
12.336 kB
-56 B
-26 B
Unchanged fixtures
Package & Exports Size (minified/GZIP)
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
188.818 kB
51.901 kB
react-components
react-components: FluentProvider & webLightTheme
33.19 kB
10.921 kB
🤖 This report was generated against 23a0768ad4a127f31c06449ae4b8ebf0b986bc19

@size-auditor
Copy link

size-auditor bot commented Aug 23, 2022

Asset size changes

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

Baseline commit: 23a0768ad4a127f31c06449ae4b8ebf0b986bc19 (build)

@fabricteam
Copy link
Collaborator

Perf Analysis (@fluentui/react-components)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 1282 1280 5000
Button mount 945 927 5000
FluentProvider mount 1482 1462 5000
FluentProviderWithTheme mount 576 563 10
FluentProviderWithTheme virtual-rerender 544 538 10
FluentProviderWithTheme virtual-rerender-with-unmount 587 568 10
MakeStyles mount 1975 1992 50000
SpinButton mount 2331 2315 5000

@sopranopillow sopranopillow merged commit c868d64 into microsoft:master Aug 23, 2022
@sopranopillow sopranopillow deleted the input/remove-shadows branch August 23, 2022 23:05
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.

[Bug]: v9 Input (filled) has a shadow by default - not matching the spec
3 participants