kingdot/lib/theme-default/Calendar.css

A UI Components Library For Vue

.kd-calendar-wrapper{width:300px;min-height:317px}.kd-calendar-header{text-align:center;line-height:20px;margin:5px 15px 20px}.kd-calendar-header .kd-calendar-text-btn{cursor:pointer}.kd-calendar-header .kd-calendar-text-btn:hover{color:#557dfc}.kd-calendar-header .page-left-icon{float:left}.kd-calendar-header .page-right-icon{float:right}.kd-calendar-header .kd-icon-date-forward,.kd-calendar-header .kd-icon-skip-forward{margin:0 5px;cursor:pointer;color:#b2b2b2}.kd-calendar-header .kd-icon-date-forward:first-child,.kd-calendar-header .kd-icon-date-forward:nth-child(2),.kd-calendar-header .kd-icon-skip-forward:first-child,.kd-calendar-header .kd-icon-skip-forward:nth-child(2){-webkit-transform:rotate(-180deg);-ms-transform:rotate(-180deg);transform:rotate(-180deg)}.kd-calendar-header .kd-icon-date-forward:hover,.kd-calendar-header .kd-icon-skip-forward:hover{color:#557dfc}.kd-calendar-header span{text-align:center;font-size:14px;color:#262626}.kd-calendar-default{margin:0 10px;width:280px}.kd-calendar-default .kd-week{display:-ms-flexbox;display:flex;border-bottom:1px solid #ccc}.kd-calendar-default .kd-week span{-ms-flex:1;flex:1;text-align:center;margin-bottom:10px;font-size:12px}.kd-calendar-table.month,.kd-calendar-table.year{margin-top:40px}.kd-calendar-table .kd-calendar-row{display:-ms-flexbox;display:flex}.kd-calendar-table .kd-calendar-row.wide{margin:20px 0}.kd-calendar-table span.kd-month,.kd-calendar-table span.kd-year{-ms-flex:0 0 25%;flex:0 0 25%;text-align:center;line-height:40px;font-size:12px;cursor:pointer}.kd-calendar-table span.kd-month.kd-blue,.kd-calendar-table span.kd-year.kd-blue{color:#557dfc;font-weight:700}.kd-calendar-table span.kd-month.kd-in-range,.kd-calendar-table span.kd-year.kd-in-range{background-color:#e5ecff}.kd-calendar-table span.kd-month.kd-selected,.kd-calendar-table span.kd-month:hover,.kd-calendar-table span.kd-year.kd-selected,.kd-calendar-table span.kd-year:hover{background:#557dfc;color:#fff}.kd-calendar-table span.kd-month.kd-disabled,.kd-calendar-table span.kd-year.kd-disabled{background:#f7f8fa;color:#ccc;cursor:no-drop}.kd-calendar-table div.kd-day-container{margin:8px 0;padding:0 8px}.kd-calendar-table div.kd-day-container.kd-in-range{background-color:#e5ecff}.kd-calendar-table div.kd-day-container.kd-disabled{background:#f7f8fa;color:#ccc}.kd-calendar-table div.kd-day-container.kd-disMonth{background-color:#fff;color:#ccc}.kd-calendar-table div.kd-day{position:relative;text-align:center;line-height:24px;width:24px;font-size:12px;cursor:pointer;color:#404040}.kd-calendar-table div.kd-day.kd-today{color:#557dfc;font-weight:700}.kd-calendar-table div.kd-day.kd-in-range{background-color:#e5ecff}.kd-calendar-table div.kd-day.kd-selected,.kd-calendar-table div.kd-day:hover{border-radius:50%;background:#557dfc;color:#fff}.kd-calendar-table div.kd-day.kd-disabled{background:#f7f8fa;color:#ccc;cursor:no-drop}.kd-calendar-table div.kd-day.kd-disMonth{background:#fff;color:#ccc;cursor:no-drop}.kd-calendar-table div.kd-day.kd-disMonth:hover{color:#ccc}