123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192 |
- .wux-popover {
- font-family: Monospaced Number,Chinese Quote,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif;
- font-size: 28rpx;
- line-height: 1.5;
- color: rgba(0,0,0,.65);
- box-sizing: border-box;
- margin: 0;
- padding: 0;
- list-style: none;
- position: absolute;
- top: 0;
- left: 0;
- z-index: 1030;
- cursor: auto;
- -webkit-user-select: text;
- -moz-user-select: text;
- user-select: text;
- white-space: normal;
- font-weight: 400;
- text-align: left
- }
- .wux-popover::after {
- content: "";
- position: absolute;
- background: rgba(255,255,255,.01)
- }
- .wux-popover__container {
- position: absolute;
- top: 0;
- left: 0;
- width: 100%
- }
- .wux-popover__element {
- display: inline-block;
- line-height: 1
- }
- .wux-popover--theme-dark .wux-popover__inner {
- background-color: #333
- }
- .wux-popover--theme-dark.wux-popover--placement-top .wux-popover__arrow,
- .wux-popover--theme-dark.wux-popover--placement-topLeft .wux-popover__arrow,
- .wux-popover--theme-dark.wux-popover--placement-topRight .wux-popover__arrow {
- border-top-color: #333
- }
- .wux-popover--theme-dark.wux-popover--placement-right .wux-popover__arrow,
- .wux-popover--theme-dark.wux-popover--placement-rightBottom .wux-popover__arrow,
- .wux-popover--theme-dark.wux-popover--placement-rightTop .wux-popover__arrow {
- border-right-color: #333
- }
- .wux-popover--theme-dark.wux-popover--placement-bottom .wux-popover__arrow,
- .wux-popover--theme-dark.wux-popover--placement-bottomLeft .wux-popover__arrow,
- .wux-popover--theme-dark.wux-popover--placement-bottomRight .wux-popover__arrow {
- border-bottom-color: #333
- }
- .wux-popover--theme-dark.wux-popover--placement-left .wux-popover__arrow,
- .wux-popover--theme-dark.wux-popover--placement-leftBottom .wux-popover__arrow,
- .wux-popover--theme-dark.wux-popover--placement-leftTop .wux-popover__arrow {
- border-left-color: #333
- }
- .wux-popover--theme-dark .wux-popover__inner,
- .wux-popover--theme-dark .wux-popover__title {
- color: #fff
- }
- .wux-popover--placement-top,
- .wux-popover--placement-topLeft,
- .wux-popover--placement-topRight {
- padding-bottom: 10px
- }
- .wux-popover--placement-right,
- .wux-popover--placement-rightBottom,
- .wux-popover--placement-rightTop {
- padding-left: 10px
- }
- .wux-popover--placement-bottom,
- .wux-popover--placement-bottomLeft,
- .wux-popover--placement-bottomRight {
- padding-top: 10px
- }
- .wux-popover--placement-left,
- .wux-popover--placement-leftBottom,
- .wux-popover--placement-leftTop {
- padding-right: 10px
- }
- .wux-popover__inner {
- background-color: #fff;
- background-clip: padding-box;
- border-radius: 4px;
- box-shadow: 0 2px 8px rgba(0,0,0,.15);
- color: rgba(0,0,0,.65)
- }
- .wux-popover__title {
- position: relative;
- min-width: 120px;
- margin: 0;
- padding: 5px 16px 4px;
- min-height: 32px;
- box-sizing: border-box;
- color: rgba(0,0,0,.85);
- font-weight: 500
- }
- .wux-popover__title::after {
- content: " ";
- position: absolute;
- left: 0;
- bottom: 0;
- right: 0;
- height: 1PX;
- border-bottom: 1PX solid #d9d9d9;
- color: #d9d9d9;
- transform-origin: 0 100%;
- transform: scaleY(.5)
- }
- .wux-popover__inner-content {
- padding: 24rpx 32rpx
- }
- .wux-popover__arrow {
- width: 0;
- height: 0;
- position: absolute;
- display: block;
- border-color: transparent;
- border-style: solid;
- border-width: 16.97056274rpx
- }
- .wux-popover--placement-top .wux-popover__arrow,
- .wux-popover--placement-topLeft .wux-popover__arrow,
- .wux-popover--placement-topRight .wux-popover__arrow {
- bottom: 8rpx;
- border-bottom-width: 0;
- border-top-color: #fff
- }
- .wux-popover--placement-top .wux-popover__arrow {
- left: 50%;
- transform: translateX(-50%)
- }
- .wux-popover--placement-topLeft .wux-popover__arrow {
- left: 32rpx
- }
- .wux-popover--placement-topRight .wux-popover__arrow {
- right: 32rpx
- }
- .wux-popover--placement-right .wux-popover__arrow,
- .wux-popover--placement-rightBottom .wux-popover__arrow,
- .wux-popover--placement-rightTop .wux-popover__arrow {
- left: 8rpx;
- border-left-width: 0;
- border-right-color: #fff
- }
- .wux-popover--placement-right .wux-popover__arrow {
- top: 50%;
- transform: translateY(-50%)
- }
- .wux-popover--placement-rightTop .wux-popover__arrow {
- top: 24rpx
- }
- .wux-popover--placement-rightBottom .wux-popover__arrow {
- bottom: 24rpx
- }
- .wux-popover--placement-bottom .wux-popover__arrow,
- .wux-popover--placement-bottomLeft .wux-popover__arrow,
- .wux-popover--placement-bottomRight .wux-popover__arrow {
- top: 8rpx;
- border-top-width: 0;
- border-bottom-color: #fff
- }
- .wux-popover--placement-bottom .wux-popover__arrow {
- left: 50%;
- transform: translateX(-50%)
- }
- .wux-popover--placement-bottomLeft .wux-popover__arrow {
- left: 32rpx
- }
- .wux-popover--placement-bottomRight .wux-popover__arrow {
- right: 32rpx
- }
- .wux-popover--placement-left .wux-popover__arrow,
- .wux-popover--placement-leftBottom .wux-popover__arrow,
- .wux-popover--placement-leftTop .wux-popover__arrow {
- right: 8rpx;
- border-right-width: 0;
- border-left-color: #fff
- }
- .wux-popover--placement-left .wux-popover__arrow {
- top: 50%;
- transform: translateY(-50%)
- }
- .wux-popover--placement-leftTop .wux-popover__arrow {
- top: 24rpx
- }
- .wux-popover--placement-leftBottom .wux-popover__arrow {
- bottom: 24rpx
- }
|