feat(tooltip): Tooltip support colour background #23155

AshoneA · 2020-04-12T05:47:27Z

🤔 This is a ...

🔗 Related issue link

💡 Background and solution

📝 Changelog

Language	Changelog
🇺🇸 English	Tooltip support color props to config background.
🇨🇳 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

View rendered components/tooltip/demo/colorful.md
View rendered components/tooltip/index.en-US.md
View rendered components/tooltip/index.zh-CN.md

AshoneA · 2020-04-12T05:48:30Z

@afc163 需要支持自定义的颜色吗？这样的话可能得改动 rc-tooltip 或者运行时动态生成 css 文件了。

ant-design-bot · 2020-04-12T05:50:27Z

zombieJ · 2020-04-12T06:10:54Z

自定义颜色参考 Tag 组件。

codesandbox-ci · 2020-04-12T06:18:07Z

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 9f5853d00d0ee9bf7f0aa61189dc1c13f17b5165:

Sandbox	Source
antd reproduction template	Configuration

afc163 · 2020-04-12T06:34:44Z

feature branch

zombieJ · 2020-05-14T03:28:07Z

Conflict

AshoneA · 2020-05-14T03:29:41Z

Conflict

react-component/tooltip#213

这个还没合呢

zombieJ · 2020-05-21T14:10:52Z

+ rc-tooltip@4.2.0

zombieJ · 2020-05-21T14:11:01Z

需要改成 feature branch

AshoneA · 2020-05-25T07:01:47Z

/rebase

Closes ant-design#23127

afc163 · 2020-05-25T07:27:26Z

为啥 dist 老是挂，rebase 一下 feature 试试。

AshoneA · 2020-05-25T07:54:22Z

为啥 dist 老是挂，rebase 一下 feature 试试。

已经是 rebase 过 feature 了的。

afc163 · 2020-05-25T08:00:32Z

components/tooltip/demo/colorful.md

+const customColors = ['#f50', '#2db7f5', '#87d068', '#108ee9'];
+
+ReactDOM.render(
+  <div>


Suggested change

<div>

<>

afc163 · 2020-05-25T08:00:40Z

components/tooltip/demo/colorful.md

+
+ReactDOM.render(
+  <div>
+    <h4 style={{ marginBottom: 16 }}>Presets:</h4>


用 Divider

afc163 · 2020-05-25T09:52:33Z

components/badge/demo/colorful.md

@@ -34,15 +34,15 @@ const colors = [

 ReactDOM.render(
  <div>


Suggested change

<div>

<>

afc163 · 2020-05-25T09:52:43Z

components/tooltip/demo/colorful.md

-  <div>
-    <h4 style={{ marginBottom: 16 }}>Presets:</h4>
+  <>
+    <Divider orientation="left">Presets</Divider>


snapshot 要更新掉。

xrkffgg · 2020-05-26T03:19:52Z

components/tooltip/index.zh-CN.md

@@ -28,6 +28,7 @@ title: Tooltip
 | arrowPointAtCenter | 箭头是否指向目标元素中心 | boolean | `false` |  |
 | autoAdjustOverflow | 气泡被遮挡时自动调整位置 | boolean | `true` |  |
 | defaultVisible | 默认是否显隐 | boolean | false |  |
+| color | 背景颜色 | string | - |


版本号木有加呀

嗯...我加下

backgroundColor 会不会好点

跟 Tag 保持一致就用 color 吧！

要不加个判断，如果是纯白，就把字体变黑。

😂😂😂 你提醒我了，看了下 tag 的效果。鼠标选择才能看到

xrkffgg · 2020-05-26T03:40:51Z

我搜了一下，网上有很多，根据颜色判断是深色还是浅色的，要不要加个这样的判断设置下 color

AshoneA · 2020-05-26T03:57:51Z

我搜了一下，网上有很多，根据颜色判断是深色还是浅色的，要不要加个这样的判断设置下 color

感觉有点麻烦，白色的话表达有 white #fff #ffffff 还有 rgba、hsl 等等表达... 黑色同理，需要考虑的情况感觉有点多

b1ngx · 2020-06-01T02:20:31Z

字体颜色也需要能配置吧

xrkffgg · 2020-06-01T02:34:37Z

字体颜色也需要能配置吧

字体颜色其实可以先通过 css 变

pr-triage bot added the PR: unreviewed label Apr 12, 2020

AshoneA requested a review from afc163 April 12, 2020 05:48

AshoneA mentioned this pull request Apr 19, 2020

feat: support to config overlay inner style react-component/tooltip#213

Merged

ant-design-bot added the Inactive label May 13, 2020

afc163 mentioned this pull request May 21, 2020

feat: optmize tooptip destroyTooltipOnHide feature #24362

Merged

17 tasks

AshoneA changed the base branch from master to feature May 22, 2020 03:27

AshoneA force-pushed the feat/colour-tooltip branch from 9f5853d to e851c0c Compare May 22, 2020 04:26

AshoneA removed the Inactive label May 22, 2020

AshoneA added 2 commits May 25, 2020 07:02

feat(tooltip): Tooltip support colour background

6a6bfaa

Closes ant-design#23127

patch: update test case

61cc77a

github-actions bot force-pushed the feat/colour-tooltip branch from e851c0c to 61cc77a Compare May 25, 2020 07:02

afc163 reviewed May 25, 2020

View reviewed changes

components/tooltip/demo/colorful.md Outdated

ReactDOM.render(

<div>

<h4 style={{ marginBottom: 16 }}>Presets:</h4>

Copy link

Member

afc163 May 25, 2020

Choose a reason for hiding this comment

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

用 Divider

chore: repalce h1 tag to Divider

bef6eea

afc163 reviewed May 25, 2020

View reviewed changes

components/badge/demo/colorful.md Outdated

@@ -34,15 +34,15 @@ const colors = [

ReactDOM.render(

<div>

Copy link

Member

afc163 May 25, 2020

Choose a reason for hiding this comment

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

Suggested change

<div>

<>

afc163 reviewed May 25, 2020

View reviewed changes

chore: update demo

a64717a

afc163 approved these changes May 25, 2020

View reviewed changes

pr-triage bot added PR: reviewed-approved and removed PR: unreviewed labels May 25, 2020

afc163 merged commit cb20942 into ant-design:feature May 25, 2020

pr-triage bot added PR: merged and removed PR: reviewed-approved labels May 25, 2020

xrkffgg reviewed May 26, 2020

View reviewed changes

pr-triage bot added PR: reviewed-approved and removed PR: merged labels May 26, 2020

zombieJ mentioned this pull request May 31, 2020

docs: 4.3.0 changelog #24607

Merged

13 tasks

hsuanxyz mentioned this pull request Oct 10, 2020

[Tooltip] support color background NG-ZORRO/ng-zorro-antd#5884

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(tooltip): Tooltip support colour background #23155

feat(tooltip): Tooltip support colour background #23155

AshoneA commented Apr 12, 2020 •

edited by markdownify bot

Loading

AshoneA commented Apr 12, 2020

ant-design-bot commented Apr 12, 2020 •

edited

Loading

zombieJ commented Apr 12, 2020

codesandbox-ci bot commented Apr 12, 2020

afc163 commented Apr 12, 2020

zombieJ commented May 14, 2020

AshoneA commented May 14, 2020

zombieJ commented May 21, 2020

zombieJ commented May 21, 2020

AshoneA commented May 25, 2020

afc163 commented May 25, 2020

AshoneA commented May 25, 2020

afc163 May 25, 2020

afc163 May 25, 2020

afc163 May 25, 2020

afc163 May 25, 2020

xrkffgg May 26, 2020

AshoneA May 26, 2020

hengkx May 26, 2020

AshoneA May 26, 2020

xrkffgg May 26, 2020

xrkffgg May 26, 2020

xrkffgg May 26, 2020

xrkffgg commented May 26, 2020

AshoneA commented May 26, 2020

b1ngx commented Jun 1, 2020

xrkffgg commented Jun 1, 2020

feat(tooltip): Tooltip support colour background #23155

feat(tooltip): Tooltip support colour background #23155

Conversation

AshoneA commented Apr 12, 2020 • edited by markdownify bot Loading

🤔 This is a ...

🔗 Related issue link

💡 Background and solution

📝 Changelog

☑️ Self Check before Merge

AshoneA commented Apr 12, 2020

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

zombieJ commented Apr 12, 2020

codesandbox-ci bot commented Apr 12, 2020

afc163 commented Apr 12, 2020

zombieJ commented May 14, 2020

AshoneA commented May 14, 2020

zombieJ commented May 21, 2020

zombieJ commented May 21, 2020

AshoneA commented May 25, 2020

afc163 commented May 25, 2020

AshoneA commented May 25, 2020

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

xrkffgg commented May 26, 2020

AshoneA commented May 26, 2020

b1ngx commented Jun 1, 2020

xrkffgg commented Jun 1, 2020

AshoneA commented Apr 12, 2020 •

edited by markdownify bot

Loading

ant-design-bot commented Apr 12, 2020 •

edited

Loading