UNPKG

datepickerdate

Version:

A lightweight datepicker component for Preact

github.com/kilgarenone/datepicker

kilgarenone/datepicker

1 lines • 3.04 kB
1
{"version":3,"sources":["Calendar.css"],"names":[],"mappings":"AAAA,eACE,iBAAkB,CAClB,QAAS,CACT,eAAgB,CAChB,MAAO,CACP,qBAAsB,CACtB,iBAAkB,CAClB,WAAY,CACZ,uBAA8B,CAC9B,8DACqC,CACrC,8CACF,CAEA,mBACE,GACE,SAAU,CACV,2BACF,CACA,GACE,SAAU,CACV,uBACF,CACF,CAEA,kBACE,YAAa,CACb,kBAAmB,CACnB,mBACF,CAEA,gCAEE,YAAa,CACb,kBAAmB,CACnB,UACF,CACA,gBACE,0BACF,CACA,gBACE,wBACF,CAEA,iBACE,cAAe,CACf,aACF,CAEA,qBACE,kBAAmB,CACnB,eACF,CAEA,gBACE,YAAa,CACb,aAAc,CACd,mBAAqB,CACrB,eACF,CACA,eACE,mBAAoB,CACpB,kBAAmB,CACnB,iBAAkB,CAClB,gBAAkB,CAClB,eAAgB,CAChB,qBACF,CAEA,iBACE,YAAa,CACb,cAAe,CACf,6BAA8B,CAC9B,4BACF,CAEA,gBACE,mBAAoB,CACpB,kBAAmB,CACnB,+BAAgC,CAChC,8BAA+B,CAC/B,YAAa,CACb,kBAAmB,CACnB,sBAAuB,CACvB,aAAe,CACf,cAAe,CACf,cACF,CAEA,uCACE,wBACF,CAEA,YACE,iBACF,CAEA,kBACE,UAAW,CACX,iBAAkB,CAClB,OAAQ,CACR,QAAS,CACT,iCAAyC,CACzC,mCAAqC,CACrC,kCAAoC,CACpC,4BACF,CAEA,iBACE,aACF,CAEA,iBACE,qBAAsB,CACtB,UACF","file":"index.css","sourcesContent":[".dpd .calendar {\n position: absolute;\n top: 110%;\n min-width: 15rem;\n left: 0;\n background-color: #fff;\n border-radius: 4px;\n z-index: 999;\n padding: 0.5rem 1rem 1rem 1rem;\n box-shadow: rgba(0, 0, 0, 0.05) 0px 2px 6px,\n rgba(0, 0, 0, 0.07) 0px 0px 0px 1px;\n animation: fade-in 0.2s cubic-bezier(0, 0, 0.4, 1.5);\n}\n\n@keyframes fade-in {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.dpd .monthPicker {\n display: flex;\n align-items: center;\n margin-bottom: 0.5rem;\n}\n\n.dpd .prevMonth,\n.dpd .nextMonth {\n display: flex;\n align-items: center;\n width: 100%;\n}\n.dpd .prevMonth {\n justify-content: flex-start;\n}\n.dpd .nextMonth {\n justify-content: flex-end;\n}\n\n.dpd .monthArrow {\n font-size: 2rem;\n line-height: 0;\n}\n\n.dpd .monthYearLabel {\n white-space: nowrap;\n font-weight: 600;\n}\n\n.dpd .dayLabels {\n display: flex;\n color: #848f99;\n margin-bottom: 0.5rem;\n font-size: 0.8rem;\n}\n.dpd .dayLabel {\n flex-basis: 14.2857%;\n min-width: 14.2857%;\n text-align: center;\n font-size: 0.65rem;\n font-weight: 600;\n letter-spacing: 0.04rem;\n}\n\n.dpd .dateLabels {\n display: flex;\n flex-wrap: wrap;\n border-left: 1px solid #f1f1f1;\n border-top: 1px solid #f1f1f1;\n}\n\n.dpd .dateLabel {\n flex-basis: 14.2857%;\n min-width: 14.2857%;\n border-bottom: 1px solid #f1f1f1;\n border-right: 1px solid #f1f1f1;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0.5rem;\n font-size: 1rem;\n cursor: pointer;\n}\n\n.dpd .dateLabel:not(.currentDay):hover {\n background-color: #f1f1f1;\n}\n\n.dpd .today {\n position: relative;\n}\n\n.dpd .today::after {\n content: \"\";\n position: absolute;\n right: 0;\n bottom: 0;\n border-bottom: 0.75em solid lightseagreen;\n border-left: 0.75em solid transparent;\n border-top: 0.75em solid transparent;\n background-color: transparent;\n}\n\n.dpd .notInMonth {\n color: #9e9e9e;\n}\n\n.dpd .currentDay {\n background-color: #000;\n color: #fff;\n}\n"]}