mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-24 11:10:01 +08:00
Code Issues Actions 25 Packages Projects Releases Wiki Activity

DRY the styles writing for maintenance (#10220)

Browse Source
This commit is contained in:
Zheeeng 2018-05-21 21:53:20 +08:00 committed by 偏右
parent 2955600642
commit 389c7c4f10
1 changed files with 25 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
components/divider/style/index.less
View File

@ -24,7 +24,10 @@
margin: 24px 0;
clear: both;
}
&-horizontal&-with-text {
&-horizontal&-with-text,
&-horizontal&-with-text-left,
&-horizontal&-with-text-right {
display: table;
white-space: nowrap;
text-align: center;
@ -33,7 +36,6 @@
color: @heading-color;
font-size: @font-size-lg;
margin: 16px 0;
&:before,
&:after {
content: '';
@ -45,77 +47,43 @@
transform: translateY(50%);
}
}
&-inner-text {
display: inline-block;
padding: 0 24px;
}
&-horizontal&-with-text-left {
display: table;
white-space: nowrap;
text-align: center;
background: transparent;
font-weight: 500;
color: @heading-color;
font-size: @font-size-base;
margin: 16px 0;
&:before {
content: '';
display: table-cell;
position: relative;
top: 50%;
width: 5%;
border-top: 1px solid @border-color-split;
transform: translateY(50%);
}
&:after {
content: '';
display: table-cell;
position: relative;
top: 50%;
width: 95%;
border-top: 1px solid @border-color-split;
transform: translateY(50%);
}
&-inner-text {
&-horizontal&-with-text-left,
&-horizontal&-with-text-right {
font-size: @font-size-base;
.@{divider-prefix-cls}-inner-text {
display: inline-block;
padding: 0 10px;
}
}
&-horizontal&-with-text-left {
&:before {
top: 50%;
width: 5%;
}
&:after {
top: 50%;
width: 95%;
}
}
&-horizontal&-with-text-right {
display: table;
white-space: nowrap;
text-align: center;
background: transparent;
font-weight: 500;
color: @heading-color;
font-size: @font-size-base;
margin: 16px 0;
&:before {
content: '';
display: table-cell;
position: relative;
top: 50%;
width: 95%;
border-top: 1px solid @border-color-split;
transform: translateY(50%);
}
&:after {
content: '';
display: table-cell;
position: relative;
top: 50%;
width: 5%;
border-top: 1px solid @border-color-split;
transform: translateY(50%);
}
&-inner-text {
display: inline-block;
padding: 0 10px;
}
}
&-inner-text {
display: inline-block;
padding: 0 24px;
}
&-dashed {
background: none;
border-top: 1px dashed @border-color-split;