react-period-of-stay-input
Version:
React.js component for entering a period of stay in a hotel: check-in + check-out date
1 lines • 19.2 kB
JSON
{"id":"ahFa","dependencies":[{"name":"/home/ikr/prj/stc-b2b/react-period-of-stay-input/tsconfig.json","includedInParent":true,"mtime":1534170011206},{"name":"/home/ikr/prj/stc-b2b/react-period-of-stay-input/package.json","includedInParent":true,"mtime":1534170011202}],"generated":{"js":"\"use strict\";Object.defineProperty(exports,\"__esModule\",{value:!0}),exports.default='.react-datepicker-popper[data-placement^=\"bottom\"] .react-datepicker__triangle, .react-datepicker-popper[data-placement^=\"top\"] .react-datepicker__triangle, .react-datepicker__year-read-view--down-arrow,\\n.react-datepicker__month-read-view--down-arrow,\\n.react-datepicker__month-year-read-view--down-arrow {\\n margin-left: -8px;\\n position: absolute;\\n}\\n\\n.react-datepicker-popper[data-placement^=\"bottom\"] .react-datepicker__triangle, .react-datepicker-popper[data-placement^=\"top\"] .react-datepicker__triangle, .react-datepicker__year-read-view--down-arrow,\\n.react-datepicker__month-read-view--down-arrow,\\n.react-datepicker__month-year-read-view--down-arrow, .react-datepicker-popper[data-placement^=\"bottom\"] .react-datepicker__triangle::before, .react-datepicker-popper[data-placement^=\"top\"] .react-datepicker__triangle::before, .react-datepicker__year-read-view--down-arrow::before,\\n.react-datepicker__month-read-view--down-arrow::before,\\n.react-datepicker__month-year-read-view--down-arrow::before {\\n box-sizing: content-box;\\n position: absolute;\\n border: 8px solid transparent;\\n height: 0;\\n width: 1px;\\n}\\n\\n.react-datepicker-popper[data-placement^=\"bottom\"] .react-datepicker__triangle::before, .react-datepicker-popper[data-placement^=\"top\"] .react-datepicker__triangle::before, .react-datepicker__year-read-view--down-arrow::before,\\n.react-datepicker__month-read-view--down-arrow::before,\\n.react-datepicker__month-year-read-view--down-arrow::before {\\n content: \"\";\\n z-index: -1;\\n border-width: 8px;\\n left: -8px;\\n border-bottom-color: #aeaeae;\\n}\\n\\n.react-datepicker-popper[data-placement^=\"bottom\"] .react-datepicker__triangle {\\n top: 0;\\n margin-top: -8px;\\n}\\n\\n.react-datepicker-popper[data-placement^=\"bottom\"] .react-datepicker__triangle, .react-datepicker-popper[data-placement^=\"bottom\"] .react-datepicker__triangle::before {\\n border-top: none;\\n border-bottom-color: #f0f0f0;\\n}\\n\\n.react-datepicker-popper[data-placement^=\"bottom\"] .react-datepicker__triangle::before {\\n top: -1px;\\n border-bottom-color: #aeaeae;\\n}\\n\\n.react-datepicker-popper[data-placement^=\"top\"] .react-datepicker__triangle, .react-datepicker__year-read-view--down-arrow,\\n.react-datepicker__month-read-view--down-arrow,\\n.react-datepicker__month-year-read-view--down-arrow {\\n bottom: 0;\\n margin-bottom: -8px;\\n}\\n\\n.react-datepicker-popper[data-placement^=\"top\"] .react-datepicker__triangle, .react-datepicker__year-read-view--down-arrow,\\n.react-datepicker__month-read-view--down-arrow,\\n.react-datepicker__month-year-read-view--down-arrow, .react-datepicker-popper[data-placement^=\"top\"] .react-datepicker__triangle::before, .react-datepicker__year-read-view--down-arrow::before,\\n.react-datepicker__month-read-view--down-arrow::before,\\n.react-datepicker__month-year-read-view--down-arrow::before {\\n border-bottom: none;\\n border-top-color: #fff;\\n}\\n\\n.react-datepicker-popper[data-placement^=\"top\"] .react-datepicker__triangle::before, .react-datepicker__year-read-view--down-arrow::before,\\n.react-datepicker__month-read-view--down-arrow::before,\\n.react-datepicker__month-year-read-view--down-arrow::before {\\n bottom: -1px;\\n border-top-color: #aeaeae;\\n}\\n\\n.react-datepicker-wrapper {\\n display: inline-block;\\n}\\n\\n.react-datepicker {\\n font-family: \"Helvetica Neue\", Helvetica, Arial, sans-serif;\\n font-size: 0.8rem;\\n background-color: #fff;\\n color: #000;\\n border: 1px solid #aeaeae;\\n border-radius: 0.3rem;\\n display: inline-block;\\n position: relative;\\n}\\n\\n.react-datepicker--time-only .react-datepicker__triangle {\\n left: 35px;\\n}\\n\\n.react-datepicker--time-only .react-datepicker__time-container {\\n border-left: 0;\\n}\\n\\n.react-datepicker--time-only .react-datepicker__time {\\n border-radius: 0.3rem;\\n}\\n\\n.react-datepicker--time-only .react-datepicker__time-box {\\n border-radius: 0.3rem;\\n}\\n\\n.react-datepicker__triangle {\\n position: absolute;\\n left: 50px;\\n}\\n\\n.react-datepicker-popper {\\n z-index: 1;\\n}\\n\\n.react-datepicker-popper[data-placement^=\"bottom\"] {\\n margin-top: 10px;\\n}\\n\\n.react-datepicker-popper[data-placement^=\"top\"] {\\n margin-bottom: 10px;\\n}\\n\\n.react-datepicker-popper[data-placement^=\"right\"] {\\n margin-left: 8px;\\n}\\n\\n.react-datepicker-popper[data-placement^=\"right\"] .react-datepicker__triangle {\\n left: auto;\\n right: 42px;\\n}\\n\\n.react-datepicker-popper[data-placement^=\"left\"] {\\n margin-right: 8px;\\n}\\n\\n.react-datepicker-popper[data-placement^=\"left\"] .react-datepicker__triangle {\\n left: 42px;\\n right: auto;\\n}\\n\\n.react-datepicker__header {\\n text-align: center;\\n background-color: #f0f0f0;\\n border-bottom: 1px solid #aeaeae;\\n border-top-left-radius: 0.3rem;\\n border-top-right-radius: 0.3rem;\\n padding-top: 8px;\\n position: relative;\\n}\\n\\n.react-datepicker__header--time {\\n padding-bottom: 8px;\\n padding-left: 5px;\\n padding-right: 5px;\\n}\\n\\n.react-datepicker__year-dropdown-container--select,\\n.react-datepicker__month-dropdown-container--select,\\n.react-datepicker__month-year-dropdown-container--select,\\n.react-datepicker__year-dropdown-container--scroll,\\n.react-datepicker__month-dropdown-container--scroll,\\n.react-datepicker__month-year-dropdown-container--scroll {\\n display: inline-block;\\n margin: 0 2px;\\n}\\n\\n.react-datepicker__current-month,\\n.react-datepicker-time__header {\\n margin-top: 0;\\n color: #000;\\n font-weight: bold;\\n font-size: 0.944rem;\\n}\\n\\n.react-datepicker-time__header {\\n text-overflow: ellipsis;\\n white-space: nowrap;\\n overflow: hidden;\\n}\\n\\n.react-datepicker__navigation {\\n background: none;\\n line-height: 1.7rem;\\n text-align: center;\\n cursor: pointer;\\n position: absolute;\\n top: 10px;\\n width: 0;\\n padding: 0;\\n border: 0.45rem solid transparent;\\n z-index: 1;\\n height: 10px;\\n width: 10px;\\n text-indent: -999em;\\n overflow: hidden;\\n}\\n\\n.react-datepicker__navigation--previous {\\n left: 10px;\\n border-right-color: #ccc;\\n}\\n\\n.react-datepicker__navigation--previous:hover {\\n border-right-color: #b3b3b3;\\n}\\n\\n.react-datepicker__navigation--previous--disabled, .react-datepicker__navigation--previous--disabled:hover {\\n border-right-color: #e6e6e6;\\n cursor: default;\\n}\\n\\n.react-datepicker__navigation--next {\\n right: 10px;\\n border-left-color: #ccc;\\n}\\n\\n.react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button) {\\n right: 80px;\\n}\\n\\n.react-datepicker__navigation--next:hover {\\n border-left-color: #b3b3b3;\\n}\\n\\n.react-datepicker__navigation--next--disabled, .react-datepicker__navigation--next--disabled:hover {\\n border-left-color: #e6e6e6;\\n cursor: default;\\n}\\n\\n.react-datepicker__navigation--years {\\n position: relative;\\n top: 0;\\n display: block;\\n margin-left: auto;\\n margin-right: auto;\\n}\\n\\n.react-datepicker__navigation--years-previous {\\n top: 4px;\\n border-top-color: #ccc;\\n}\\n\\n.react-datepicker__navigation--years-previous:hover {\\n border-top-color: #b3b3b3;\\n}\\n\\n.react-datepicker__navigation--years-upcoming {\\n top: -4px;\\n border-bottom-color: #ccc;\\n}\\n\\n.react-datepicker__navigation--years-upcoming:hover {\\n border-bottom-color: #b3b3b3;\\n}\\n\\n.react-datepicker__month-container {\\n float: left;\\n}\\n\\n.react-datepicker__month {\\n margin: 0.4rem;\\n text-align: center;\\n}\\n\\n.react-datepicker__time-container {\\n float: right;\\n border-left: 1px solid #aeaeae;\\n width: 70px;\\n}\\n\\n.react-datepicker__time-container--with-today-button {\\n display: inline;\\n border: 1px solid #aeaeae;\\n border-radius: 0.3rem;\\n position: absolute;\\n right: -72px;\\n top: 0;\\n}\\n\\n.react-datepicker__time-container .react-datepicker__time {\\n position: relative;\\n background: white;\\n}\\n\\n.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box {\\n width: 70px;\\n overflow-x: hidden;\\n margin: 0 auto;\\n text-align: center;\\n}\\n\\n.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list {\\n list-style: none;\\n margin: 0;\\n height: calc(195px + (1.7rem / 2));\\n overflow-y: scroll;\\n padding-right: 30px;\\n width: 100%;\\n box-sizing: content-box;\\n}\\n\\n.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item {\\n padding: 5px 10px;\\n}\\n\\n.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover {\\n cursor: pointer;\\n background-color: #f0f0f0;\\n}\\n\\n.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected {\\n background-color: #216ba5;\\n color: white;\\n font-weight: bold;\\n}\\n\\n.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover {\\n background-color: #216ba5;\\n}\\n\\n.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled {\\n color: #ccc;\\n}\\n\\n.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover {\\n cursor: default;\\n background-color: transparent;\\n}\\n\\n.react-datepicker__week-number {\\n color: #ccc;\\n display: inline-block;\\n width: 1.7rem;\\n line-height: 1.7rem;\\n text-align: center;\\n margin: 0.166rem;\\n}\\n\\n.react-datepicker__week-number.react-datepicker__week-number--clickable {\\n cursor: pointer;\\n}\\n\\n.react-datepicker__week-number.react-datepicker__week-number--clickable:hover {\\n border-radius: 0.3rem;\\n background-color: #f0f0f0;\\n}\\n\\n.react-datepicker__day-names,\\n.react-datepicker__week {\\n white-space: nowrap;\\n}\\n\\n.react-datepicker__day-name,\\n.react-datepicker__day,\\n.react-datepicker__time-name {\\n color: #000;\\n display: inline-block;\\n width: 1.7rem;\\n line-height: 1.7rem;\\n text-align: center;\\n margin: 0.166rem;\\n}\\n\\n.react-datepicker__day {\\n cursor: pointer;\\n}\\n\\n.react-datepicker__day:hover {\\n border-radius: 0.3rem;\\n background-color: #f0f0f0;\\n}\\n\\n.react-datepicker__day--today {\\n font-weight: bold;\\n}\\n\\n.react-datepicker__day--highlighted {\\n border-radius: 0.3rem;\\n background-color: #3dcc4a;\\n color: #fff;\\n}\\n\\n.react-datepicker__day--highlighted:hover {\\n background-color: #32be3f;\\n}\\n\\n.react-datepicker__day--highlighted-custom-1 {\\n color: magenta;\\n}\\n\\n.react-datepicker__day--highlighted-custom-2 {\\n color: green;\\n}\\n\\n.react-datepicker__day--selected, .react-datepicker__day--in-selecting-range, .react-datepicker__day--in-range {\\n border-radius: 0.3rem;\\n background-color: #216ba5;\\n color: #fff;\\n}\\n\\n.react-datepicker__day--selected:hover, .react-datepicker__day--in-selecting-range:hover, .react-datepicker__day--in-range:hover {\\n background-color: #1d5d90;\\n}\\n\\n.react-datepicker__day--keyboard-selected {\\n border-radius: 0.3rem;\\n background-color: #2a87d0;\\n color: #fff;\\n}\\n\\n.react-datepicker__day--keyboard-selected:hover {\\n background-color: #1d5d90;\\n}\\n\\n.react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range) {\\n background-color: rgba(33, 107, 165, 0.5);\\n}\\n\\n.react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range) {\\n background-color: #f0f0f0;\\n color: #000;\\n}\\n\\n.react-datepicker__day--disabled {\\n cursor: default;\\n color: #ccc;\\n}\\n\\n.react-datepicker__day--disabled:hover {\\n background-color: transparent;\\n}\\n\\n.react-datepicker__input-container {\\n position: relative;\\n display: inline-block;\\n}\\n\\n.react-datepicker__year-read-view,\\n.react-datepicker__month-read-view,\\n.react-datepicker__month-year-read-view {\\n border: 1px solid transparent;\\n border-radius: 0.3rem;\\n}\\n\\n.react-datepicker__year-read-view:hover,\\n.react-datepicker__month-read-view:hover,\\n.react-datepicker__month-year-read-view:hover {\\n cursor: pointer;\\n}\\n\\n.react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow,\\n.react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow,\\n.react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow,\\n.react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow,\\n.react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow,\\n.react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow {\\n border-top-color: #b3b3b3;\\n}\\n\\n.react-datepicker__year-read-view--down-arrow,\\n.react-datepicker__month-read-view--down-arrow,\\n.react-datepicker__month-year-read-view--down-arrow {\\n border-top-color: #ccc;\\n float: right;\\n margin-left: 20px;\\n top: 8px;\\n position: relative;\\n border-width: 0.45rem;\\n}\\n\\n.react-datepicker__year-dropdown,\\n.react-datepicker__month-dropdown,\\n.react-datepicker__month-year-dropdown {\\n background-color: #f0f0f0;\\n position: absolute;\\n width: 50%;\\n left: 25%;\\n top: 30px;\\n z-index: 1;\\n text-align: center;\\n border-radius: 0.3rem;\\n border: 1px solid #aeaeae;\\n}\\n\\n.react-datepicker__year-dropdown:hover,\\n.react-datepicker__month-dropdown:hover,\\n.react-datepicker__month-year-dropdown:hover {\\n cursor: pointer;\\n}\\n\\n.react-datepicker__year-dropdown--scrollable,\\n.react-datepicker__month-dropdown--scrollable,\\n.react-datepicker__month-year-dropdown--scrollable {\\n height: 150px;\\n overflow-y: scroll;\\n}\\n\\n.react-datepicker__year-option,\\n.react-datepicker__month-option,\\n.react-datepicker__month-year-option {\\n line-height: 20px;\\n width: 100%;\\n display: block;\\n margin-left: auto;\\n margin-right: auto;\\n}\\n\\n.react-datepicker__year-option:first-of-type,\\n.react-datepicker__month-option:first-of-type,\\n.react-datepicker__month-year-option:first-of-type {\\n border-top-left-radius: 0.3rem;\\n border-top-right-radius: 0.3rem;\\n}\\n\\n.react-datepicker__year-option:last-of-type,\\n.react-datepicker__month-option:last-of-type,\\n.react-datepicker__month-year-option:last-of-type {\\n -webkit-user-select: none;\\n -moz-user-select: none;\\n -ms-user-select: none;\\n user-select: none;\\n border-bottom-left-radius: 0.3rem;\\n border-bottom-right-radius: 0.3rem;\\n}\\n\\n.react-datepicker__year-option:hover,\\n.react-datepicker__month-option:hover,\\n.react-datepicker__month-year-option:hover {\\n background-color: #ccc;\\n}\\n\\n.react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming,\\n.react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming,\\n.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming {\\n border-bottom-color: #b3b3b3;\\n}\\n\\n.react-datepicker__year-option:hover .react-datepicker__navigation--years-previous,\\n.react-datepicker__month-option:hover .react-datepicker__navigation--years-previous,\\n.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous {\\n border-top-color: #b3b3b3;\\n}\\n\\n.react-datepicker__year-option--selected,\\n.react-datepicker__month-option--selected,\\n.react-datepicker__month-year-option--selected {\\n position: absolute;\\n left: 15px;\\n}\\n\\n.react-datepicker__close-icon {\\n background-color: transparent;\\n border: 0;\\n cursor: pointer;\\n outline: 0;\\n padding: 0;\\n vertical-align: middle;\\n position: absolute;\\n height: 16px;\\n width: 16px;\\n top: 25%;\\n right: 7px;\\n}\\n\\n.react-datepicker__close-icon::after {\\n background-color: #216ba5;\\n border-radius: 50%;\\n bottom: 0;\\n box-sizing: border-box;\\n color: #fff;\\n content: \"\\x000d7\";\\n cursor: pointer;\\n font-size: 12px;\\n height: 16px;\\n width: 16px;\\n line-height: 1;\\n margin: -8px auto 0;\\n padding: 2px;\\n position: absolute;\\n right: 0px;\\n text-align: center;\\n}\\n\\n.react-datepicker__today-button {\\n background: #f0f0f0;\\n border-top: 1px solid #aeaeae;\\n cursor: pointer;\\n text-align: center;\\n font-weight: bold;\\n padding: 5px 0;\\n clear: left;\\n}\\n\\n.react-datepicker__portal {\\n position: fixed;\\n width: 100vw;\\n height: 100vh;\\n background-color: rgba(0, 0, 0, 0.8);\\n left: 0;\\n top: 0;\\n justify-content: center;\\n align-items: center;\\n display: flex;\\n z-index: 2147483647;\\n}\\n\\n.react-datepicker__portal .react-datepicker__day-name,\\n.react-datepicker__portal .react-datepicker__day,\\n.react-datepicker__portal .react-datepicker__time-name {\\n width: 3rem;\\n line-height: 3rem;\\n}\\n\\n@media (max-width: 400px), (max-height: 550px) {\\n .react-datepicker__portal .react-datepicker__day-name,\\n .react-datepicker__portal .react-datepicker__day,\\n .react-datepicker__portal .react-datepicker__time-name {\\n width: 2rem;\\n line-height: 2rem;\\n }\\n}\\n\\n.react-datepicker__portal .react-datepicker__current-month,\\n.react-datepicker__portal .react-datepicker-time__header {\\n font-size: 1.44rem;\\n}\\n\\n.react-datepicker__portal .react-datepicker__navigation {\\n border: 0.81rem solid transparent;\\n}\\n\\n.react-datepicker__portal .react-datepicker__navigation--previous {\\n border-right-color: #ccc;\\n}\\n\\n.react-datepicker__portal .react-datepicker__navigation--previous:hover {\\n border-right-color: #b3b3b3;\\n}\\n\\n.react-datepicker__portal .react-datepicker__navigation--previous--disabled, .react-datepicker__portal .react-datepicker__navigation--previous--disabled:hover {\\n border-right-color: #e6e6e6;\\n cursor: default;\\n}\\n\\n.react-datepicker__portal .react-datepicker__navigation--next {\\n border-left-color: #ccc;\\n}\\n\\n.react-datepicker__portal .react-datepicker__navigation--next:hover {\\n border-left-color: #b3b3b3;\\n}\\n\\n.react-datepicker__portal .react-datepicker__navigation--next--disabled, .react-datepicker__portal .react-datepicker__navigation--next--disabled:hover {\\n border-left-color: #e6e6e6;\\n cursor: default;\\n}\\n';"},"hash":"ecde061ba8f91a15bd9dabd6de67885e","cacheData":{"env":{}}}