65 lines
3.7 KiB
CSS
65 lines
3.7 KiB
CSS
.t-guide__reference {
|
|
position: absolute;
|
|
box-shadow: 0 0 0 0 var(--td-guide-reference-mask-color, var(--td-font-gray-2, rgba(0, 0, 0, 0.6))), var(--td-guide-reference-mask-color, var(--td-font-gray-2, rgba(0, 0, 0, 0.6))) 0 0 0 5000px;
|
|
border-radius: var(--td-guide-reference-border-radius, var(--td-radius-default, 12rpx));
|
|
transition: all var(--td-anim-duration-base, 0.2s) var(--td-anim-time-fn-ease-out, cubic-bezier(0, 0, 0.15, 1));
|
|
}
|
|
.t-guide__reference--nonoverlay {
|
|
box-shadow: none;
|
|
border: var(--td-guide-reference-border, 4rpx solid var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
|
|
}
|
|
.t-guide__container {
|
|
display: inline-block;
|
|
}
|
|
.t-guide__container--popover {
|
|
background-color: var(--td-guide-popover-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
|
|
border: var(--td-guide-popover-border, 2rpx solid var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
|
|
border-radius: var(--td-guide-popover-border-radius, var(--td-radius-large, 18rpx));
|
|
box-shadow: var(--td-guide-popover-shadow, var(--td-shadow-3, 0 6px 30px 5px rgba(0, 0, 0, 0.05), 0 16px 24px 2px rgba(0, 0, 0, 0.04), 0 8px 10px -5px rgba(0, 0, 0, 0.08)));
|
|
padding: var(--td-guide-popover-padding, var(--td-spacer-2, 32rpx));
|
|
min-width: var(--td-guide-popover-min-width, 480rpx);
|
|
max-width: var(--td-guide-popover-max-width, 540rpx);
|
|
}
|
|
.t-guide__container--dialog {
|
|
background-color: var(--td-guide-popover-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
|
|
border-radius: var(--td-guide-dialog-border-radius, var(--td-radius-extraLarge, 24rpx));
|
|
padding: var(--td-guide-dialog-padding, var(--td-spacer-3, 48rpx) 0);
|
|
width: var(--td-guide-dialog-width, 622rpx);
|
|
}
|
|
.t-guide__title--popover {
|
|
text-align: var(--td-guide-popover-title-text-align, left);
|
|
color: var(--td-guide-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
|
|
font: var(--td-guide-popover-title-font, var(--td-font-title-medium, 600 32rpx / 48rpx var(--td-font-family, PingFang SC, Microsoft YaHei, Arial Regular)));
|
|
}
|
|
.t-guide__title--dialog {
|
|
text-align: var(--td-guide-dialog-title-text-align, center);
|
|
color: var(--td-guide-title-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
|
|
font: var(--td-guide-dialog-title-font, var(--td-font-title-large, 600 36rpx / 52rpx var(--td-font-family, PingFang SC, Microsoft YaHei, Arial Regular)));
|
|
}
|
|
.t-guide__body--popover {
|
|
margin-top: var(--td-guide-popover-body-margin-top, 8rpx);
|
|
text-align: var(--td-guide-popover-body-text-align, left);
|
|
color: var(--td-guide-body-color, var(--td-text-color-secondary, var(--td-font-gray-2, rgba(0, 0, 0, 0.6))));
|
|
font: var(--td-guide-popover-body-font, var(--td-font-body-medium, 28rpx / 44rpx var(--td-font-family, PingFang SC, Microsoft YaHei, Arial Regular)));
|
|
}
|
|
.t-guide__body--dialog {
|
|
margin-top: var(--td-guide-dialog-body-margin-top, 16rpx);
|
|
text-align: var(--td-guide-dialog-body-text-align, center);
|
|
color: var(--td-guide-body-color, var(--td-text-color-secondary, var(--td-font-gray-2, rgba(0, 0, 0, 0.6))));
|
|
font: var(--td-guide-dialog-body-font, var(--td-font-body-large, 32rpx / 48rpx var(--td-font-family, PingFang SC, Microsoft YaHei, Arial Regular)));
|
|
}
|
|
.t-guide__footer {
|
|
text-align: var(--td-guide-footer-text-align, right);
|
|
margin-top: var(--td-guide-footer-margin-top, var(--td-spacer-3, 48rpx));
|
|
}
|
|
.t-guide__footer :deep(.t-guide__button + .t-guide__button) {
|
|
margin-left: var(--td-guide-footer-button-space, var(--td-spacer-1, 24rpx));
|
|
}
|
|
.t-guide__footer--dialog {
|
|
display: flex;
|
|
padding: var(--td-guide-dialog-footer-button-padding, 0 var(--td-spacer-3, 48rpx));
|
|
}
|
|
.t-guide__footer--dialog :deep(.t-guide__button:last-child) {
|
|
flex-grow: 1;
|
|
}
|