fix: Typography ellipsis flush when contain suffix (#30582)

* fix: Typography ellipsis flush when contain suffix

* update snapshot

* fix Text default rows

* fix Text default rows
This commit is contained in:
afc163 2021-05-19 13:17:58 +08:00 committed by GitHub
parent ceec57db72
commit e290874c51
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 10 additions and 6 deletions

View File

@ -522,6 +522,7 @@ class Base extends React.Component<InternalBlockProps, BaseState> {
[`${prefixCls}-${type}`]: type,
[`${prefixCls}-disabled`]: disabled,
[`${prefixCls}-ellipsis`]: rows,
[`${prefixCls}-single-line`]: rows === 1,
[`${prefixCls}-ellipsis-single-line`]: cssTextOverflow,
[`${prefixCls}-ellipsis-multiple-line`]: cssLineClamp,
},

View File

@ -231,7 +231,7 @@ Array [
/>
</button>,
<div
class="ant-typography ant-typography-ellipsis"
class="ant-typography ant-typography-ellipsis ant-typography-single-line"
>
Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team.
</div>,
@ -241,7 +241,7 @@ Array [
Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team.
</div>,
<span
class="ant-typography ant-typography-ellipsis"
class="ant-typography ant-typography-ellipsis ant-typography-single-line"
style="width:100px"
>
Ant Design, a design language for background applications, is refined by Ant UED Team.
@ -333,7 +333,7 @@ Array [
/>
</div>,
<div
class="ant-typography ant-typography-ellipsis"
class="ant-typography ant-typography-ellipsis ant-typography-single-line"
>
Ant Design, a design language for background applications, is refined by Ant UED Team. This is a nest sample
<span
@ -352,7 +352,7 @@ Array [
<p>
2333
<span
class="ant-typography ant-typography-ellipsis"
class="ant-typography ant-typography-ellipsis ant-typography-single-line"
>
2333
</span>
@ -853,7 +853,7 @@ Array [
/>
</div>,
<div
class="ant-typography ant-typography-ellipsis"
class="ant-typography ant-typography-ellipsis ant-typography-single-line"
title="To be, or not to be, that is a question: Whether it is nobler in the mind to suffer. The slings and arrows of outrageous fortune Or to take arms against a sea of troubles, And by opposing end them? To die: to sleep; No more; and by a sleep to say we end The heart-ache and the thousand natural shocks That flesh is heir to, 'tis a consummation Devoutly to be wish'd. To die, to sleep To sleep- perchance to dream: ay, there's the rub! For in that sleep of death what dreams may come When we have shuffled off this mortal coil, Must give us pause. There 's the respect That makes calamity of so long life--William Shakespeare"
>
To be, or not to be, that is a question: Whether it is nobler in the mind to suffer. The slings and arrows of outrageous fortune Or to take arms against a sea of troubles, And by opposing end them? To die: to sleep; No more; and by a sleep to say we end The heart-ache and the thousand natural shocks That flesh is heir to, 'tis a consummation Devoutly to be wish'd. To die, to sleep To sleep- perchance to dream: ay, there's the rub! For in that sleep of death what dreams may come When we have shuffled off this mortal coil, Must give us pause. There 's the respect That makes calamity of so long life--William Shakespeare

View File

@ -259,9 +259,12 @@
}
// ============ Ellipsis ============
&-single-line {
white-space: nowrap;
}
&-ellipsis-single-line {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
// https://blog.csdn.net/iefreer/article/details/50421025