wm-date-picker-ui-ts
Version:
vue3,日历面板组件,支持单选、多选、连续选中等功能
1 lines • 3.62 kB
CSS
.w-date-title[data-v-3645b01f]{height:50px;display:flex;justify-content:space-between;padding:0 10px 0 20px;border-bottom:1px solid #ddd;overflow:hidden}.w-date-title .w-date-year-month[data-v-3645b01f]{display:flex;justify-content:center;align-items:center;flex-direction:column}.w-date-title .w-date-year-month p[data-v-3645b01f]{font-size:16px;color:#5e7a88;text-align:center;line-height:22px}.w-date-title .w-date-year-month span[data-v-3645b01f]{font-size:12px;color:#999}.w-date-title .w-date-year-month .w-date-month[data-v-3645b01f]{height:22px;overflow:hidden;position:relative;width:55px}.w-date-title .w-date-year-month .w-date-month-box[data-v-3645b01f]{position:absolute;width:100%;transition:all .3s}.w-date-title .w-date-handle-btn[data-v-3645b01f]{display:flex;justify-content:space-between;align-items:center;width:100px;margin-top:-5px}.w-date-title .w-date-handle-btn p[data-v-3645b01f]{font-size:16px;color:#777;cursor:pointer}.w-date-title .w-date-handle-btn span[data-v-3645b01f]{display:flex;align-items:center;cursor:pointer;padding:8px 0;border-radius:5px;transition:all .2s}.w-date-title .w-date-handle-btn span[data-v-3645b01f]:hover{box-shadow:0 0 3px #b9eaff}.w-date-week[data-v-c565e8f6]{display:flex;justify-content:space-around;align-items:center;color:#555;height:45px}.w-date-week .w-date-item-red[data-v-c565e8f6]{color:#f73131}.w-date-item[data-v-ac53a3ee]{display:flex;justify-content:space-around;flex-direction:column;align-items:center;padding:15px 0 6px;width:14.2857142857%;border-radius:5px;position:relative;font-size:18px;transition:all .15s}.w-date-item .w-date-tip-content[data-v-ac53a3ee]{position:absolute;top:0;font-size:12px;display:flex;justify-content:space-between;width:100%;padding:0 2px}.w-date-item .left-top[data-v-ac53a3ee]{margin-left:1px}.w-date-item .right-top[data-v-ac53a3ee]{margin-right:2px}.w-date-item .w-date-day[data-v-ac53a3ee]{color:#000;margin:-2px 0}.w-date-item-isToday[data-v-ac53a3ee]{box-shadow:0 0 2px #4cadd9}.close-btn[data-v-ac53a3ee]{position:absolute;right:-8px;top:-8px;background-color:#f73131;display:flex;justify-content:center;align-items:center;color:#fff;height:17px;width:17px;border-radius:50%;z-index:9;transform:rotate(45deg);cursor:pointer}.w-date-item-disabled[data-v-ac53a3ee],.w-date-no-current-month[data-v-ac53a3ee]{opacity:.5}.w-date-china-red[data-v-ac53a3ee],.w-date-item-red .w-date-day[data-v-ac53a3ee]{color:#f73131}.w-date-single-select[data-v-ac53a3ee]{background-color:#4cd964}.w-date-start-select[data-v-ac53a3ee]{background-color:#f8a920}.w-date-single-select .left-top[data-v-ac53a3ee],.w-date-single-select .right-top[data-v-ac53a3ee],.w-date-single-select .w-date-china[data-v-ac53a3ee],.w-date-single-select .w-date-day[data-v-ac53a3ee],.w-date-start-select .left-top[data-v-ac53a3ee],.w-date-start-select .right-top[data-v-ac53a3ee],.w-date-start-select .w-date-china[data-v-ac53a3ee],.w-date-start-select .w-date-day[data-v-ac53a3ee]{color:#fff}.w-date-item+.w-date-item[data-v-ac53a3ee]{margin-left:2px}.w-date-china[data-v-ac53a3ee]{font-size:12px}body,html{height:100%;width:100%}article,aside,body,caption,details,div,dl,fieldset,h1,h2,h3,h4,h5,h6,header,hgroup,html,label,li,main,nav,ol,p,section,ul{margin:0;padding:0;box-sizing:border-box;font-family:arial}.w-date-container[data-v-69cbdbd5]{min-width:325px;width:100%;border-radius:5px;padding:10px 13px}.w-date-container .w-date-item-list[data-v-69cbdbd5]{display:flex;justify-content:space-around;align-items:center;color:#555}.w-date-container .w-date-item-list+.w-date-item-list[data-v-69cbdbd5]{margin-top:2px}