yylib-quick-mobile/source/yylib/locate-steps/YYLocateSteps.css

yylib-quick-mobile

.yy-locate-steps .yy-locate-steps-body{
    display: flex;
    flex-direction: column;
    background: #fff;
    padding: .6rem;
    position: fixed;
    top: 30%;
    right: 0px;
    text-align: center;
    color: #0091FA;
    z-index: 100;
    border: 1px solid #ece0e0e3;
}

.yy-locate-steps .yy-locate-steps-body .yy-locate-step.active {
    color: #fe6d3b;
}

.yy-locate-steps .yy-locate-steps-body .yy-locate-step .yy-locate-step-icon {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1px solid #0091FA;
    display: flex;
    align-items: center;
    justify-content: center;
}

.yy-locate-steps .yy-locate-steps-body .yy-locate-step.active .yy-locate-step-icon {
    width: 40px;
    height: 40px;
    border:none;
    background-color: #fe6d3b;
    color: #ffffff;
}

.yy-locate-steps .yy-locate-steps-body .yy-locate-step .yy-locate-step-tail {
    height: 30px;
    padding-bottom: 5px;
}

.yy-locate-steps .yy-locate-steps-body .yy-locate-step:last-child .yy-locate-step-tail:last-child {
    height: 0px;
}

.yy-locate-step-tail::after {
    content: '';
    display: inline-block;
    background: #ddd;
    height: 100%;
    border-radius: 1px;
    width: 1px;
    -webkit-transition: background .3s;
    transition: background .3s;
    position: relative;
    left: -1px;
}
.yy-locate-steps .yy-locate-steps-mask{
    position: fixed;
    height: 100vh;
    width: 100vw;
    top: 0;
    left: 0;
    z-index: 1;
}