naive-ui/styles/Tooltip.scss

80 lines
2.3 KiB
SCSS
Raw Normal View History

2019-06-28 18:14:06 +08:00
@import "./mixins/mixins.scss";
@import "./themes/vars.scss";
2019-06-20 12:46:29 +08:00
2019-09-28 13:47:54 +08:00
@include themes-mixin {
2019-12-09 15:12:53 +08:00
.#{block(tooltip)} {
@include b(tooltip-content) {
&.#{block(popover-content)} {
2019-12-12 18:36:30 +08:00
@include once {
padding: 8px 14px;
white-space: nowrap;
border-radius: 6px;
}
2019-12-09 15:12:53 +08:00
box-shadow: $--tooltip-box-shadow;
background-color: $--tooltip-background-color;
color: $--tooltip-color;
&[n-placement$="top-start"] {
@include b(popover-arrow) {
border-top-color: $--tooltip-background-color;
}
2019-09-28 13:47:54 +08:00
}
2019-12-09 15:12:53 +08:00
&[n-placement$="top"] {
@include b(popover-arrow) {
border-top-color: $--tooltip-background-color;
}
2019-09-28 13:47:54 +08:00
}
2019-12-09 15:12:53 +08:00
&[n-placement$="top-end"] {
@include b(popover-arrow) {
border-top-color: $--tooltip-background-color;
}
2019-09-28 13:47:54 +08:00
}
2019-12-09 15:12:53 +08:00
&[n-placement$="bottom-start"] {
@include b(popover-arrow) {
border-bottom-color: $--tooltip-background-color;
}
2019-09-28 13:47:54 +08:00
}
2019-12-09 15:12:53 +08:00
&[n-placement$="bottom"] {
@include b(popover-arrow) {
border-bottom-color: $--tooltip-background-color;
}
2019-09-28 13:47:54 +08:00
}
2019-12-09 15:12:53 +08:00
&[n-placement$="bottom-end"] {
@include b(popover-arrow) {
border-bottom-color: $--tooltip-background-color;
}
2019-09-28 13:47:54 +08:00
}
2019-12-09 15:12:53 +08:00
&[n-placement$="left-start"] {
@include b(popover-arrow) {
border-left-color: $--tooltip-background-color;
}
2019-09-28 13:47:54 +08:00
}
2019-12-09 15:12:53 +08:00
&[n-placement$="left"] {
@include b(popover-arrow) {
border-left-color: $--tooltip-background-color;
}
2019-09-28 13:47:54 +08:00
}
2019-12-09 15:12:53 +08:00
&[n-placement$="left-end"] {
@include b(popover-arrow) {
border-left-color: $--tooltip-background-color;
}
2019-09-28 13:47:54 +08:00
}
2019-12-09 15:12:53 +08:00
&[n-placement$="right-start"] {
@include b(popover-arrow) {
border-right-color: $--tooltip-background-color;
}
2019-09-28 13:47:54 +08:00
}
2019-12-09 15:12:53 +08:00
&[n-placement$="right"] {
@include b(popover-arrow) {
border-right-color: $--tooltip-background-color;
}
2019-09-28 13:47:54 +08:00
}
2019-12-09 15:12:53 +08:00
&[n-placement$="right-end"] {
@include b(popover-arrow) {
border-right-color: $--tooltip-background-color;
}
2019-09-28 13:47:54 +08:00
}
}
}
2019-07-26 17:40:49 +08:00
}
2019-06-28 18:14:06 +08:00
}