Yao 451a3b19fc
[new feature] 增加 css 编译,方便组件书写 (#40)
* add src dir && add build

* add build watch && change dir name

* bower ignore package.json
2017-10-29 10:42:28 +08:00

134 lines
2.6 KiB
Plaintext

.zan-steps--steps.zan-steps--5 .zan-steps__step {
width: 25%;
}
.zan-steps--steps.zan-steps--4 .zan-steps__step {
width: 33%;
}
.zan-steps--steps.zan-steps--3 .zan-steps__step {
width: 50%;
}
.zan-steps--steps .zan-steps__step {
position: relative;
float: left;
padding-bottom: 25px;
color: #b1b1b1;
}
.zan-steps--steps .zan-steps__title {
transform: translateX(-50%);
font-size: 10px;
text-align: center;
}
.zan-steps--steps .zan-steps__icons {
position: absolute;
top: 30px;
left: -10px;
padding: 0 8px;
background-color: #fff;
z-index: 10;
}
.zan-steps--steps .zan-steps__circle {
display: block;
position: relative;
width: 5px;
height: 5px;
background-color: #e5e5e5;
border-radius: 50%;
}
.zan-steps--steps .zan-steps__line {
position: absolute;
left: 0px;
top: 32px;
width: 100%;
height: 1px;
background-color: #e5e5e5;
}
/* 已完成的steps */
.zan-steps--steps .zan-steps__step--done {
color: #333;
}
.zan-steps--steps .zan-steps__step--done .zan-steps__line {
background-color: #06bf04;
}
.zan-steps--steps .zan-steps__step--done .zan-steps__circle {
width: 5px;
height: 5px;
background-color: #09bb07;
}
/* 正在进行中的steps */
.zan-steps--steps .zan-steps__step--cur .zan-steps__icons {
top: 25px;
left: -14px;
}
.zan-steps--steps .zan-steps__step--cur .zan-steps__circle {
width: 13px;
height: 13px;
background-image: url("https://b.yzcdn.cn/v2/image/wap/success_small@2x.png");
background-size: 13px 13px;
}
.zan-steps--steps .zan-steps__step--cur .zan-steps__line {
background-color: #e5e5e5;
}
/* 各种不同位置的 */
.zan-steps--steps .zan-steps__step--first-child .zan-steps__title {
margin-left: 0;
transform: none;
text-align: left;
}
.zan-steps--steps .zan-steps__step--first-child .zan-steps__icons {
left: -7px;
}
.zan-steps--steps .zan-steps__step--last-child {
position: absolute;
right: 0;
top: 0;
text-align: right;
}
.zan-steps--steps .zan-steps__step--last-child .zan-steps__title {
transform: none;
text-align: right;
}
.zan-steps--steps .zan-steps__step--last-child .zan-steps__icons {
left: auto;
right: -6px;
}
.zan-steps--steps .zan-steps__step--last-child .zan-steps__line {
display: none;
}
/* 有描述的step */
.zan-steps--steps .zan-steps__step--db-title {
min-height: 29px;
}
.zan-steps--steps .zan-steps__step--db-title .zan-steps__line {
top: 45px;
}
.zan-steps--steps .zan-steps__step--db-title .zan-steps__icons {
top: 43px;
}
.zan-steps--steps .zan-steps__step--db-title.zan-steps__step--cur .zan-steps__icons {
top: 39px;
}