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: [Chat] Modify the problem that the picture will be deformed when… #2496

Merged
merged 1 commit into from
Sep 14, 2024

Conversation

YyumeiZhang
Copy link
Collaborator

… the picture ratio is not 1:1

中文模板 / Chinese Template

What kind of change does this PR introduce? (check at least one)

  • Bugfix
  • Feature
  • Code style update
  • Refactor
  • Test Case
  • TypeScript definition update
  • Document improve
  • CI/CD improve
  • Branch sync
  • Other, please describe:

PR description

Fixes #
在聊天框区域和输入框区域的图片展示效果中 ,未设置 object-fit 属性(默认为 fill 效果,宽高填充)。导致在图片比例非1:1时候,图片会发生变形。因此修改为 cover ,图片以宽高比例填充。
修改前:
image

修改后:
image

Changelog

🇨🇳 Chinese

  • Style: 修改 Chat 组件聊天框中的图片展示以及输入框中的上传图片展示效果,从填充到保持宽高比例填充(object-fit 从 fill -> cover),防止图片变形。

🇺🇸 English

  • Fix: Modify the image display in the Chat component chat box and the uploaded image display effect in the input box, from filling to maintaining width-to-height ratio filling (object-fit from fill -> cover), prevent image deformation.

Checklist

  • Test or no need
  • Document or no need
  • Changelog or no need

Other

  • Skip Changelog

Additional information

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 142a2b3:

Sandbox Source
pr-story Configuration

Copy link

cypress bot commented Sep 13, 2024

semi-design    Run #2821

Run Properties:  status check passed Passed #2821  •  git commit 1d2299b87d ℹ️: Merge 142a2b321e76d669a50b97ea7ea2b7189fa7b56b into 2a066f3b39ed6443fb21655a08bc...
Project semi-design
Branch Review fix/chat-image
Run status status check passed Passed #2821
Run duration 07m 43s
Commit git commit 1d2299b87d ℹ️: Merge 142a2b321e76d669a50b97ea7ea2b7189fa7b56b into 2a066f3b39ed6443fb21655a08bc...
Committer YyumeiZhang
View all properties for this run ↗︎

Test results
Tests that failed  Failures 0
Tests that were flaky  Flaky 0
Tests that did not run due to a developer annotating a test with .skip  Pending 11
Tests that did not run due to a failure in a mocha hook  Skipped 0
Tests that passed  Passing 263
⚠️ You've recorded test results over your free plan limit.
Upgrade your plan to view test results.
View all changes introduced in this branch ↗︎

@pointhalo pointhalo merged commit f182880 into main Sep 14, 2024
11 checks passed
@pointhalo pointhalo deleted the fix/chat-image branch September 14, 2024 03:33
Copy link

cypress bot commented Sep 14, 2024

semi-design    Run #2824

Run Properties:  status check passed Passed #2824  •  git commit f182880c12: fix: [Chat] Modify the problem that the picture will be deformed when the pictur...
Project semi-design
Branch Review main
Run status status check passed Passed #2824
Run duration 07m 34s
Commit git commit f182880c12: fix: [Chat] Modify the problem that the picture will be deformed when the pictur...
Committer YyumeiZhang
View all properties for this run ↗︎

Test results
Tests that failed  Failures 0
Tests that were flaky  Flaky 0
Tests that did not run due to a developer annotating a test with .skip  Pending 11
Tests that did not run due to a failure in a mocha hook  Skipped 0
Tests that passed  Passing 263
⚠️ You've recorded test results over your free plan limit.
Upgrade your plan to view test results.
View all changes introduced in this branch ↗︎

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants