@antmjs/vantui
Version:
一套适用于Taro3及React的vantui组件库
1 lines • 6.51 kB
CSS
:root,page{--primary-color:#07c160}.van-calendar{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;position:relative;width:100%;height:100%;height:var(--calendar-height,100%);background-color:#fff;background-color:var(--calendar-background-color,#fff)}.van-calendar__close-icon{top:22px}.van-calendar__popup--bottom,.van-calendar__popup--top{height:80%;height:var(--calendar-popup-height,80%)}.van-calendar__popup--left,.van-calendar__popup--right{height:100%}.van-calendar__body{-webkit-box-flex:1;-webkit-flex:1;flex:1;overflow:auto;-webkit-overflow-scrolling:touch}.van-calendar__footer{-webkit-flex-shrink:0;flex-shrink:0;padding:0 32px;padding:0 var(--padding-md,32px)}.van-calendar__footer--safe-area-inset-bottom{padding-bottom:constant(safe-area-inset-bottom);padding-bottom:env(safe-area-inset-bottom)}.van-calendar__footer+.van-calendar__footer,.van-calendar__footer:empty{display:none}.van-calendar__footer:empty+.van-calendar__footer{display:block }.van-calendar__confirm{height:72px ;height:var(--calendar-confirm-button-height,72px) ;margin:14px 0 ;margin:var(--calendar-confirm-button-margin,14px 0) ;line-height:68px ;line-height:var(--calendar-confirm-button-line-height, 68px) }.van-calendar__header{-webkit-flex-shrink:0;flex-shrink:0;box-shadow:0 4px 20px rgba(125,126,128,.16);box-shadow:var(--calendar-header-box-shadow,0 4px 20px rgba(125,126,128,.16))}.van-calendar__header-subtitle,.van-calendar__header-title{text-align:center;height:88px;height:var(--calendar-header-title-height,88px);font-weight:500;font-weight:var(--font-weight-bold,500);line-height:88px;line-height:var(--calendar-header-title-height, 88px)}.van-calendar__header-title:empty+.van-calendar__header-title{display:block }.van-calendar__weekdays{display:-webkit-box;display:-webkit-flex;display:flex}.van-calendar__weekday{-webkit-box-flex:1;-webkit-flex:1;flex:1;text-align:center;font-size:24px;font-size:var(--calendar-weekdays-font-size, 24px);line-height:60px;line-height:var(--calendar-weekdays-height, 60px)}.van-calendar{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;height:100%;background-color:#fff;background-color:var(--calendar-background-color,#fff)}.van-calendar__month-title{text-align:center;height:88px;height:var(--calendar-header-title-height,88px);font-weight:500;font-weight:var(--font-weight-bold,500);font-size:28px;font-size:var(--calendar-month-title-font-size, 28px);line-height:88px;line-height:var(--calendar-header-title-height, 88px)}.van-calendar__days{position:relative;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-user-select:none;user-select:none}.van-calendar__month-mark{position:absolute;top:50%;left:50%;z-index:0;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);pointer-events:none;color:rgba(242,243,245,.8);color:var(--calendar-month-mark-color,rgba(242,243,245,.8));font-size:320px;font-size:var(--calendar-month-mark-font-size, 320px)}.van-calendar__day,.van-calendar__selected-day{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;text-align:center}.van-calendar__day{position:relative;width:14.285%;height:128px;height:var(--calendar-day-height,128px);font-size:32px;font-size:var(--calendar-day-font-size, 32px)}.van-calendar__day--end,.van-calendar__day--multiple-middle,.van-calendar__day--multiple-selected,.van-calendar__day--start,.van-calendar__day--start-end{color:#fff;color:var(--calendar-range-edge-color,#fff);background-color:var(--primary-color);background-color:var(--calendar-range-edge-background-color,var(--primary-color))}.van-calendar__day--start{border-radius:8px 0 0 8px;border-radius:var(--border-radius-md,8px) 0 0 var(--border-radius-md,8px)}.van-calendar__day--end{border-radius:0 8px 8px 0;border-radius:0 var(--border-radius-md,8px) var(--border-radius-md,8px) 0}.van-calendar__day--multiple-selected,.van-calendar__day--start-end{border-radius:8px;border-radius:var(--border-radius-md,8px)}.van-calendar__day--middle{color:var(--primary-color);color:var(--calendar-range-middle-color,var(--primary-color))}.van-calendar__day--middle::after{position:absolute;top:0;right:0;bottom:0;left:0;background-color:currentcolor;content:'';opacity:.1;opacity:var(--calendar-range-middle-background-opacity, .1)}.van-calendar__day--disabled{cursor:default;color:#c8c9cc;color:var(--calendar-day-disabled-color,#c8c9cc)}.van-calendar__bottom-info,.van-calendar__top-info{position:absolute;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;right:0;left:0;font-size:20px;font-size:var(--calendar-info-font-size, 20px);line-height:28px;line-height:var(--calendar-info-line-height, 28px)}.van-calendar__top-info{top:6px}.van-calendar__bottom-info{bottom:6px}.van-calendar__selected-day{width:108px;width:var(--calendar-selected-day-size,108px);height:108px;height:var(--calendar-selected-day-size,108px);color:#fff;color:var(--calendar-selected-day-color,#fff);background-color:var(--primary-color);background-color:var(--calendar-selected-day-background-color,var(--primary-color));border-radius:8px;border-radius:var(--border-radius-md,8px)}.van-calendar-longspan{padding:30px;background:#fff;height:100%;position:absolute;z-index:999;box-sizing:border-box;width:100%}.van-calendar-longspan .van-calendar-longspan-title{margin-bottom:30px;font-weight:700}.van-calendar-longspan .van-calendar-longspan-content{height:calc(100% - 200px);overflow:auto}.van-calendar-longspan .van-calendar-longspan-box{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;flex-direction:row;-webkit-box-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-flex-wrap:wrap;flex-wrap:wrap}.van-calendar-longspan .van-calendar-longspan-item{margin:0 20px 20px 0}.van-calendar-longspan .van-calendar__switch{position:absolute;z-index:999;bottom:30px;left:30px;width:calc(100% - 60px)}