el-tour.css 3.5 KB

1
  1. .el-tour{--el-tour-width:520px;--el-tour-padding-primary:12px;--el-tour-font-line-height:var(--el-font-line-height-primary);--el-tour-title-font-size:16px;--el-tour-title-text-color:var(--el-text-color-primary);--el-tour-title-font-weight:400;--el-tour-close-color:var(--el-color-info);--el-tour-font-size:14px;--el-tour-color:var(--el-text-color-primary);--el-tour-bg-color:var(--el-bg-color);--el-tour-border-radius:4px}.el-tour__hollow{transition:all var(--el-transition-duration) ease}.el-tour__content{border-radius:var(--el-tour-border-radius);box-shadow:var(--el-box-shadow-light);outline:none;overflow-wrap:break-word;padding:var(--el-tour-padding-primary);width:var(--el-tour-width)}.el-tour__arrow,.el-tour__content{background:var(--el-tour-bg-color);box-sizing:border-box}.el-tour__arrow{height:10px;pointer-events:none;position:absolute;transform:rotate(45deg);width:10px}.el-tour__content[data-side^=top] .el-tour__arrow{border-left-color:transparent;border-top-color:transparent}.el-tour__content[data-side^=bottom] .el-tour__arrow{border-bottom-color:transparent;border-right-color:transparent}.el-tour__content[data-side^=left] .el-tour__arrow{border-bottom-color:transparent;border-left-color:transparent}.el-tour__content[data-side^=right] .el-tour__arrow{border-right-color:transparent;border-top-color:transparent}.el-tour__content[data-side^=top] .el-tour__arrow{bottom:-5px}.el-tour__content[data-side^=bottom] .el-tour__arrow{top:-5px}.el-tour__content[data-side^=left] .el-tour__arrow{right:-5px}.el-tour__content[data-side^=right] .el-tour__arrow{left:-5px}.el-tour__closebtn{background:transparent;border:none;cursor:pointer;font-size:var(--el-message-close-size,16px);height:40px;outline:none;padding:0;position:absolute;right:0;top:0;width:40px}.el-tour__closebtn .el-tour__close{color:var(--el-tour-close-color);font-size:inherit}.el-tour__closebtn:focus .el-tour__close,.el-tour__closebtn:hover .el-tour__close{color:var(--el-color-primary)}.el-tour__header{padding-bottom:var(--el-tour-padding-primary)}.el-tour__header.show-close{padding-right:calc(var(--el-tour-padding-primary) + var(--el-message-close-size, 16px))}.el-tour__title{color:var(--el-tour-title-text-color);font-size:var(--el-tour-title-font-size);font-weight:var(--el-tour-title-font-weight);line-height:var(--el-tour-font-line-height)}.el-tour__body{color:var(--el-tour-text-color);font-size:var(--el-tour-font-size)}.el-tour__body img,.el-tour__body video{max-width:100%}.el-tour__footer{box-sizing:border-box;display:flex;justify-content:space-between;padding-top:var(--el-tour-padding-primary)}.el-tour__content .el-tour-indicators{display:inline-block;flex:1}.el-tour__content .el-tour-indicator{background:var(--el-color-info-light-9);border-radius:50%;display:inline-block;height:6px;margin-right:6px;width:6px}.el-tour__content .el-tour-indicator.is-active{background:var(--el-color-primary)}.el-tour.el-tour--primary{--el-tour-title-text-color:#fff;--el-tour-text-color:#fff;--el-tour-bg-color:var(--el-color-primary);--el-tour-close-color:#fff}.el-tour.el-tour--primary .el-tour__closebtn:focus .el-tour__close,.el-tour.el-tour--primary .el-tour__closebtn:hover .el-tour__close{color:var(--el-tour-title-text-color)}.el-tour.el-tour--primary .el-button--default{background:#fff;border-color:var(--el-color-primary);color:var(--el-color-primary)}.el-tour.el-tour--primary .el-button--primary{border-color:#fff}.el-tour.el-tour--primary .el-tour-indicator{background:rgba(255,255,255,.15)}.el-tour.el-tour--primary .el-tour-indicator.is-active{background:#fff}.el-tour-parent--hidden{overflow:hidden}