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.

Sign up for GitHub

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

Jump to bottom

fix: Row with gutter has additional gap #29059

Merged
merged 9 commits into from
Jan 27, 2021
Merged

fix: Row with gutter has additional gap #29059

merged 9 commits into from
Jan 27, 2021

Conversation

zombieJ
Copy link
Member

@zombieJ zombieJ commented Jan 26, 2021 •
edited by markdownify bot
Loading

[中文版模板 / Chinese template]

🤔 This is a ...

  • New feature
  • Bug fix
  • Site / documentation update
  • Demo update
  • Component style update
  • TypeScript definition update
  • Bundle size optimization
  • Performance optimization
  • Enhancement feature
  • Internationalization
  • Refactoring
  • Code style optimization
  • Test Case
  • Branch merge
  • Other (about what?)

🔗 Related issue link

resolve #28976

💡 Background and solution

📝 Changelog

Language Changelog
🇺🇸 English Fix Row with vertical gutter provides additional margin-bottom style.
🇨🇳 Chinese 修复 Row 配置垂直 gutter 时会额外添加 margin-bottom 样式的问题。

☑️ Self Check before Merge

⚠️ Please check all items below before review. ⚠️

  • Doc is updated/provided or not needed
  • Demo is updated/provided or not needed
  • TypeScript definition is updated/provided or not needed
  • Changelog is provided or not needed

View rendered components/grid/demo/playground.md

@zombieJ
Copy link
Member Author

zombieJ commented Jan 26, 2021

原本双负 margin 只会有一个有效，现在改为使用现代游览器通过 flex 的 gap 样式来实现。
对于不支持的游览器，降级为原本的 margin + padding 方案。

cc @ant-design/ant-design-collaborators

@zombieJ zombieJ requested review from afc163 and shaodahong January 26, 2021 11:38
@ant-design-bot
Copy link
Contributor

ant-design-bot commented Jan 26, 2021 •
edited
Loading

@github-actions
Copy link
Contributor

github-actions bot commented Jan 26, 2021 •
edited
Loading

Size Change: +936 B (0%)

Total Size: 835 kB

Filename Size Change
./dist/antd-with-locales.min.js 336 kB +176 B (0%)
./dist/antd.compact.min.css 67.1 kB +207 B (0%)
./dist/antd.dark.min.css 68.4 kB +205 B (0%)
./dist/antd.min.css 67.1 kB +209 B (0%)
./dist/antd.min.js 296 kB +139 B (0%)

compressed-size-action

@shaodahong
Copy link
Member

有点不对

image

@codesandbox-ci
Copy link

codesandbox-ci bot commented Jan 26, 2021 •
edited
Loading

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 3cd4896:

Sandbox Source
antd reproduction template Configuration

@codecov
Copy link

codecov bot commented Jan 26, 2021 •
edited
Loading

Codecov Report

Merging #29059 (3cd4896) into feature (cbbffe4) will not change coverage.
The diff coverage is 100.00%.

Impacted file tree graph

@@            Coverage Diff            @@
##           feature    #29059   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files          393       393           
  Lines         7607      7628   +21     
  Branches      2210      2211    +1     
=========================================
+ Hits          7607      7628   +21
Impacted Files Coverage Δ
components/_util/styleChecker.tsx 100.00% <100.00%> (ø)
components/grid/col.tsx 100.00% <100.00%> (ø)
components/grid/row.tsx 100.00% <100.00%> (ø)
components/modal/Modal.tsx 100.00% <100.00%> (ø)

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update cbbffe4...3cd4896. Read the comment docs.

@zombieJ
Copy link
Member Author

zombieJ commented Jan 26, 2021 •
edited
Loading

有点不对

image

是对的，2 & 3 行是2个Row，没有间距。

Update: 我加个文字描述

@zombieJ zombieJ merged commit f45bb9f into feature Jan 27, 2021
@zombieJ zombieJ deleted the gap branch January 27, 2021 06:03
chenshuai2144 added a commit that referenced this pull request Feb 1, 2021
@chenshuai2144 @ant-design-bot
@harrisoff @afc163 @zombieJ @kerm1it
megre Feature into master (#29141)
40f9be9 
* feat: Allow user to configure the Tooltip in the Table header (#29002)

* feat: Table header supports tooltipPlacement

* docs: add Table tooltipPlacement

* feat: Allow user to configure the Tooltip in the Table header

* fix: fix jsx and use old code style

* fix: replace if blocks with ternary operator

* docs: fix url

Co-authored-by: 偏右 <afc163@gmail.com>

* docs: fix url

Co-authored-by: harrisoff <john@smith.kyon>
Co-authored-by: 偏右 <afc163@gmail.com>

* fix: Row with gutter has additional gap (#29059)

* chore: init gutter

* feat: col support gap

* chore: Update playground

* fix: Safari padding

* test: fix test case

* test: More test case

* docs: Update demo

* test: Update coverage

* test: Update test hack

* feat(input-number): add keyboard prop to support disable keyboard (#29110)

Co-authored-by: Ant Design GitHub Bot <yesmeck+ant-design-bot@gmail.com>
Co-authored-by: Harrison <stlebea@foxmail.com>
Co-authored-by: harrisoff <john@smith.kyon>
Co-authored-by: 偏右 <afc163@gmail.com>
Co-authored-by: 二货机器人 <smith3816@gmail.com>
Co-authored-by: Kermit <kermitlx@outlook.com>
@chenshuai2144 chenshuai2144 mentioned this pull request Feb 1, 2021
Merged
@afc163
Copy link
Member

afc163 commented Feb 2, 2021

https://preview-29059-ant-design.surge.sh/components/table-cn/ 布局挂了。

@zombieJ zombieJ mentioned this pull request Feb 2, 2021
Merged
19 tasks
@Ifeinstein
Copy link
Contributor

image
请问一下这个是用flex gap之后的正常表现吗，不太明白，如果是这样可能要手动改项目里的代码了

@afc163 afc163 mentioned this pull request Feb 3, 2021
Closed
1 task
@zombieJ zombieJ mentioned this pull request Feb 8, 2021
Closed
1 task
@sissbruecker sissbruecker mentioned this pull request Feb 9, 2021
Closed
1 task
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@kerm1it kerm1it kerm1it approved these changes

@xrkffgg xrkffgg xrkffgg approved these changes

@afc163 afc163 afc163 approved these changes

@shaodahong shaodahong Awaiting requested review from shaodahong

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
7 participants
@zombieJ @ant-design-bot @shaodahong @afc163 @Ifeinstein @xrkffgg @kerm1it