ant-design/components/timeline/style/index.less
偏右 2bced36f0c New component styles (#7731)
* Tweak button padding

* upgrade input and button size

* update form controls size

* update components size

* Add lemon color and update rate color

* Add new icons

* update layout style

* breadcrumb and dropdown

* update menu arrow width

* update layout and menu

* update steps

* fix var name

* update cascasder style

* Update DatePicker

* update InputNumber and Mention

* radio and switch

* select and transfer

* TimePicker & Upload

* more components

* calendar and list

* Tree Timeline Popover Tag

* divider modal popover

* update search input

* update card style

* update switch disabled opacity

* update shoadow and mask

* Add v2-compatible-reset.less

* Fix undefined className

* update snahshotssssssssssssssssss 👻
2017-09-27 22:32:49 +08:00

89 lines
1.7 KiB
Plaintext

@import "../../style/themes/default";
@import "../../style/mixins/index";
@timeline-prefix-cls: ~"@{ant-prefix}-timeline";
@timeline-color: @border-color-split;
.@{timeline-prefix-cls} {
.reset-component;
list-style: none;
margin: 0;
padding: 0;
&-item {
position: relative;
padding: 0 0 12px;
list-style: none;
margin: 0;
font-size: @font-size-base;
&-tail {
position: absolute;
left: 5px;
top: 0.75em;
height: 100%;
border-left: 2px solid @timeline-color;
}
&-pending &-tail {
display: none;
}
&-head {
position: absolute;
width: 12px;
height: 12px;
background-color: @component-background;
border-radius: 100px;
border: 2px solid transparent;
margin-top: -6px;
top: 0.75em;
&-blue {
border-color: @primary-color;
color: @primary-color;
}
&-red {
border-color: @error-color;
color: @error-color;
}
&-green {
border-color: @success-color;
color: @success-color;
}
}
&-head-custom {
position: absolute;
text-align: center;
line-height: 1;
margin-top: 0;
border: 0;
height: auto;
border-radius: 0;
padding: 3px 0;
transform: translate(-50%, -50%);
left: 6px;
width: auto;
}
&-content {
padding: 0 0 10px 24px;
}
&-last {
.@{timeline-prefix-cls}-item-tail {
border-left: 2px dotted @timeline-color;
display: none;
}
.@{timeline-prefix-cls}-item-content {
min-height: 48px;
}
}
}
&&-pending &-item-last &-item-tail {
display: block;
}
}