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

feat(theme): adjust font-size in compact mode #23135

Merged
merged 12 commits into from
Apr 28, 2020
Merged

feat(theme): adjust font-size in compact mode #23135

merged 12 commits into from
Apr 28, 2020

Conversation

AshoneA
Copy link
Contributor

@AshoneA AshoneA commented Apr 10, 2020

Closes #23015

🤔 This is a ...

  • New feature
  • Bug fix
  • Site / document update
  • Component style update
  • TypeScript definition update
  • Refactoring
  • Code style optimization
  • Test Case
  • Branch merge
  • Other (about what?)

🔗 Related issue link

Closes #23015

💡 Background and solution

With compact theme mode, we adjust default font-size from 14px to 12px.

📝 Changelog

Language Changelog
🇺🇸 English adjust font-size in compact mode
🇨🇳 Chinese 调整紧凑模式下默认的字体大小

☑️ 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

@ant-design-bot
Copy link
Contributor

ant-design-bot commented Apr 10, 2020 •
edited
Loading

@afc163
Copy link
Member

afc163 commented Apr 11, 2020

feature branch

@AshoneA
feat(theme): adjust font-size in compact mode
de97b3e 
With compact theme mode, we adjust default font-size from 14px to 12px.

Closes #23015
@AshoneA AshoneA changed the base branch from master to feature April 12, 2020 03:08
@AshoneA AshoneA requested a review from zombieJ as a code owner April 12, 2020 03:08
@AshoneA AshoneA removed the request for review from zombieJ April 12, 2020 03:09
@codesandbox-ci
Copy link

codesandbox-ci bot commented Apr 13, 2020 •
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 b9d6a29:

Sandbox Source
antd reproduction template Configuration

@codecov
Copy link

codecov bot commented Apr 13, 2020 •
edited
Loading

Codecov Report

Merging #23135 into feature will decrease coverage by 0.00%.
The diff coverage is n/a.

Impacted file tree graph

@@             Coverage Diff             @@
##           feature   #23135      +/-   ##
===========================================
- Coverage    98.50%   98.50%   -0.01%     
===========================================
  Files          363      363              
  Lines         7237     7236       -1     
  Branches      1966     2004      +38     
===========================================
- Hits          7129     7128       -1     
  Misses         108      108
Impacted Files Coverage Δ
components/table/hooks/useSelection.tsx 98.31% <ø> (-0.01%) ⬇️

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 a534e4a...b9d6a29. Read the comment docs.

afc163
afc163 reviewed Apr 21, 2020
View reviewed changes
components/alert/style/index.less Outdated
@@ -113,7 +113,7 @@

&-with-description &-icon {
position: absolute;
top: 16px;
top: @alert-icon-top;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

这个值最好能根据标题大小和 alert padding top 算出来。

afc163
afc163 reviewed Apr 24, 2020
View reviewed changes
components/style/themes/default.less Outdated
@@ -854,6 +855,7 @@
@alert-with-description-padding: @padding-md - 1px 15px @padding-md - 1px 64px;
@alert-icon-top: 8px + @font-size-base * @line-height-base / 2 - @font-size-base / 2;
@alert-with-description-icon-size: 24px;
@alert-with-description-icon-top: @padding-md;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

这个 top 应该是可以根据 @alert-with-description-padding 算出来？

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

应该直接用垂直方向上的 padding 就好了。

@zombieJ zombieJ changed the title [WIP] feat(theme): adjust font-size in compact mode feat(theme): adjust font-size in compact mode Apr 28, 2020
@zombieJ zombieJ merged commit 14417f1 into feature Apr 28, 2020
@zombieJ zombieJ deleted the feat/compact-small-font branch April 28, 2020 03:16
@AshoneA AshoneA mentioned this pull request Apr 28, 2020
Closed
54 tasks
@afc163 afc163 mentioned this pull request Apr 30, 2020
Closed
1 task
@xrkffgg xrkffgg mentioned this pull request Apr 30, 2020
Merged
14 tasks
@yunsii
Copy link

yunsii commented May 21, 2020

从 v4.1.4 到 v4.2.4 ，紧凑模式下的字体和间距感觉有点太小了，应该怎么自定义配置回 4.1.4 的那种效果呢？

@yoyo837 yoyo837 mentioned this pull request Jun 18, 2020
Merged
17 tasks
This was referenced Jun 18, 2020
Closed
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@afc163 afc163 afc163 left review comments

@zombieJ zombieJ zombieJ approved these changes

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

Successfully merging this pull request may close these issues.

Enhancement of compact theme
5 participants
@AshoneA @ant-design-bot @afc163 @yunsii @zombieJ