@telus-uds/components-web 3.1.0 → 3.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (122) hide show
  1. package/CHANGELOG.md +28 -2
  2. package/lib/Badge/Badge.js +19 -11
  3. package/lib/BlockQuote/BlockQuote.js +31 -17
  4. package/lib/Breadcrumbs/Breadcrumbs.js +23 -17
  5. package/lib/Breadcrumbs/Item/Item.js +6 -10
  6. package/lib/Callout/Callout.js +5 -6
  7. package/lib/Card/Card.js +5 -5
  8. package/lib/Card/CardContent.js +5 -6
  9. package/lib/Card/CardFooter.js +5 -6
  10. package/lib/Countdown/Countdown.js +5 -6
  11. package/lib/Countdown/Segment.js +6 -6
  12. package/lib/DatePicker/CalendarContainer.js +5 -5
  13. package/lib/DatePicker/DatePicker.js +12 -18
  14. package/lib/DatePicker/reactDatesCss.js +829 -2
  15. package/lib/Disclaimer/Disclaimer.js +5 -6
  16. package/lib/Footnote/Footnote.js +15 -39
  17. package/lib/Footnote/FootnoteLink.js +5 -6
  18. package/lib/NavigationBar/NavigationBar.js +73 -20
  19. package/lib/NavigationBar/NavigationItem.js +5 -6
  20. package/lib/OrderedList/Item.js +7 -11
  21. package/lib/OrderedList/ItemBase.js +5 -5
  22. package/lib/OrderedList/OrderedList.js +5 -6
  23. package/lib/OrderedList/OrderedListBase.js +5 -5
  24. package/lib/Paragraph/Paragraph.js +16 -8
  25. package/lib/PreviewCard/PreviewCard.js +7 -10
  26. package/lib/PriceLockup/PriceLockup.js +64 -54
  27. package/lib/Progress/ProgressBar.js +6 -6
  28. package/lib/QuantitySelector/QuantitySelector.js +1 -1
  29. package/lib/QuantitySelector/styles.js +18 -9
  30. package/lib/ResponsiveImage/ResponsiveImage.js +7 -1
  31. package/lib/Ribbon/Ribbon.js +57 -31
  32. package/lib/Span/Span.js +6 -7
  33. package/lib/Spinner/Spinner.js +8 -18
  34. package/lib/Spinner/SpinnerContent.js +5 -6
  35. package/lib/StoryCard/StoryCard.js +7 -10
  36. package/lib/Table/Cell.js +43 -12
  37. package/lib/Table/Table.js +15 -11
  38. package/lib/TermsAndConditions/ExpandCollapse.js +7 -13
  39. package/lib/TermsAndConditions/TermsAndConditions.js +9 -22
  40. package/lib/Testimonial/Testimonial.js +10 -26
  41. package/lib/Toast/Toast.js +64 -13
  42. package/lib/Video/ControlBar/ControlBar.js +8 -18
  43. package/lib/Video/ControlBar/Controls/VideoButton/VideoButton.js +5 -6
  44. package/lib/Video/ControlBar/Controls/VideoMenu/VideoMenu.js +7 -14
  45. package/lib/Video/ControlBar/Controls/VideoProgressBar/VideoProgressBar.js +7 -14
  46. package/lib/Video/ControlBar/Controls/VolumeSlider/VolumeSlider.js +6 -10
  47. package/lib/Video/MiddleControlButton/MiddleControlButton.js +5 -6
  48. package/lib/Video/Video.js +10 -26
  49. package/lib/VideoPicker/VideoPicker.js +44 -20
  50. package/lib/VideoPicker/VideoPickerThumbnail.js +52 -18
  51. package/lib/WaffleGrid/WaffleGrid.js +7 -14
  52. package/lib/WebVideo/WebVideo.js +9 -14
  53. package/lib/index.js +1 -1
  54. package/lib/shared/FullBleedContent/FullBleedContent.js +5 -5
  55. package/lib/shared/VideoSplash/SplashButton/SplashButton.js +6 -9
  56. package/lib/shared/VideoSplash/SplashButtonWithDetails/SplashButtonWithDetails.js +8 -17
  57. package/lib/shared/VideoSplash/VideoSplash.js +5 -6
  58. package/lib/utils/index.js +3 -1
  59. package/lib/utils/scrollToAnchor.js +19 -0
  60. package/lib/utils/ssr.js +4 -1
  61. package/lib/utils/theming/styled-components.js +26 -0
  62. package/package.json +3 -3
  63. package/src/Badge/Badge.jsx +3 -2
  64. package/src/BlockQuote/BlockQuote.jsx +3 -2
  65. package/src/Breadcrumbs/Breadcrumbs.jsx +23 -13
  66. package/src/Breadcrumbs/Item/Item.jsx +3 -2
  67. package/src/Callout/Callout.jsx +3 -2
  68. package/src/Card/Card.jsx +3 -1
  69. package/src/Card/CardContent.jsx +3 -2
  70. package/src/Card/CardFooter.jsx +3 -2
  71. package/src/Countdown/Countdown.jsx +3 -2
  72. package/src/Countdown/Segment.jsx +3 -1
  73. package/src/DatePicker/CalendarContainer.jsx +3 -1
  74. package/src/DatePicker/DatePicker.jsx +3 -2
  75. package/src/DatePicker/reactDatesCss.js +3 -1
  76. package/src/Disclaimer/Disclaimer.jsx +3 -2
  77. package/src/Footnote/Footnote.jsx +9 -2
  78. package/src/Footnote/FootnoteLink.jsx +3 -2
  79. package/src/NavigationBar/NavigationBar.jsx +55 -13
  80. package/src/NavigationBar/NavigationItem.jsx +3 -2
  81. package/src/OrderedList/Item.jsx +4 -3
  82. package/src/OrderedList/ItemBase.jsx +3 -1
  83. package/src/OrderedList/OrderedList.jsx +3 -2
  84. package/src/OrderedList/OrderedListBase.jsx +3 -1
  85. package/src/Paragraph/Paragraph.jsx +3 -2
  86. package/src/PreviewCard/PreviewCard.jsx +3 -1
  87. package/src/PriceLockup/PriceLockup.jsx +3 -2
  88. package/src/Progress/ProgressBar.jsx +3 -1
  89. package/src/QuantitySelector/QuantitySelector.jsx +1 -1
  90. package/src/QuantitySelector/styles.js +3 -1
  91. package/src/ResponsiveImage/ResponsiveImage.jsx +10 -3
  92. package/src/Ribbon/Ribbon.jsx +3 -2
  93. package/src/Span/Span.jsx +3 -2
  94. package/src/Spinner/Spinner.jsx +3 -2
  95. package/src/Spinner/SpinnerContent.jsx +3 -2
  96. package/src/StoryCard/StoryCard.jsx +3 -1
  97. package/src/Table/Cell.jsx +3 -1
  98. package/src/Table/Table.jsx +3 -2
  99. package/src/TermsAndConditions/ExpandCollapse.jsx +3 -1
  100. package/src/TermsAndConditions/TermsAndConditions.jsx +3 -2
  101. package/src/Testimonial/Testimonial.jsx +3 -2
  102. package/src/Toast/Toast.jsx +3 -2
  103. package/src/Video/ControlBar/ControlBar.jsx +3 -3
  104. package/src/Video/ControlBar/Controls/VideoButton/VideoButton.jsx +4 -3
  105. package/src/Video/ControlBar/Controls/VideoMenu/VideoMenu.jsx +3 -3
  106. package/src/Video/ControlBar/Controls/VideoProgressBar/VideoProgressBar.jsx +3 -3
  107. package/src/Video/ControlBar/Controls/VolumeSlider/VolumeSlider.jsx +3 -3
  108. package/src/Video/MiddleControlButton/MiddleControlButton.jsx +4 -3
  109. package/src/Video/Video.jsx +3 -2
  110. package/src/VideoPicker/VideoPicker.jsx +3 -2
  111. package/src/VideoPicker/VideoPickerThumbnail.jsx +3 -1
  112. package/src/WaffleGrid/WaffleGrid.jsx +3 -2
  113. package/src/WebVideo/WebVideo.jsx +4 -3
  114. package/src/index.js +1 -1
  115. package/src/shared/FullBleedContent/FullBleedContent.jsx +3 -2
  116. package/src/shared/VideoSplash/SplashButton/SplashButton.jsx +3 -1
  117. package/src/shared/VideoSplash/SplashButtonWithDetails/SplashButtonWithDetails.jsx +4 -2
  118. package/src/shared/VideoSplash/VideoSplash.jsx +3 -2
  119. package/src/utils/index.js +5 -1
  120. package/src/utils/scrollToAnchor.js +18 -0
  121. package/src/utils/ssr.js +2 -1
  122. package/src/utils/theming/styled-components.js +23 -0
@@ -1,3 +1,830 @@
1
- import { css } from 'styled-components';
2
- const defaultReactDatesCss = /*#__PURE__*/css([".PresetDateRangePicker_panel{padding:0 22px 11px;}.PresetDateRangePicker_button{position:relative;height:100%;text-align:center;background:0 0;border:2px solid #00a699;color:#00a699;padding:4px 12px;margin-right:8px;font:inherit;font-weight:700;line-height:normal;overflow:visible;-moz-box-sizing:border-box;box-sizing:border-box;cursor:pointer;}.PresetDateRangePicker_button:active{outline:0;}.PresetDateRangePicker_button__selected{color:#fff;background:#00a699;}.SingleDatePickerInput{display:inline-block;background-color:#fff;position:absolute;top:-55px;}.SingleDatePickerInput__disabled{background-color:#f2f2f2;}.SingleDatePickerInput__block{display:block;}.SingleDatePickerInput__showClearDate{padding-right:30px;}.SingleDatePickerInput_clearDate{background:0 0;border:0;color:inherit;font:inherit;line-height:normal;overflow:visible;cursor:pointer;padding:10px;margin:0 10px 0 5px;position:absolute;right:0;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);}.SingleDatePickerInput_clearDate__default:focus,.SingleDatePickerInput_clearDate__default:hover{background:#dbdbdb;border-radius:50%;}.SingleDatePickerInput_clearDate__small{padding:6px;}.SingleDatePickerInput_clearDate__hide{visibility:hidden;}.SingleDatePickerInput_clearDate_svg{fill:#82888a;height:12px;width:15px;vertical-align:middle;}.SingleDatePickerInput_clearDate_svg__small{height:9px;}.SingleDatePickerInput_calendarIcon{background:0 0;border:0;color:inherit;font:inherit;line-height:normal;overflow:visible;cursor:pointer;display:inline-block;vertical-align:middle;padding:10px;margin:0 5px 0 10px;}.SingleDatePickerInput_calendarIcon_svg{fill:#82888a;height:15px;width:14px;vertical-align:middle;}.SingleDatePicker{position:relative;display:inline-block;}.SingleDatePicker__block{display:block;}.SingleDatePicker_picker{z-index:1;background-color:#fff;position:absolute;}.SingleDatePicker_picker__rtl{direction:rtl;}.SingleDatePicker_picker__directionLeft{left:0;}.SingleDatePicker_picker__directionRight{right:0;}.SingleDatePicker_picker__portal{background-color:rgba(0,0,0,0.3);position:fixed;top:0;left:0;height:100%;width:100%;}.SingleDatePicker_picker__fullScreenPortal{background-color:#fff;}.SingleDatePicker_closeButton{background:0 0;border:0;color:inherit;font:inherit;line-height:normal;overflow:visible;cursor:pointer;position:absolute;top:0;right:0;padding:15px;z-index:2;}.SingleDatePicker_closeButton:focus,.SingleDatePicker_closeButton:hover{color:darken(#cacccd,10%);text-decoration:none;}.SingleDatePicker_closeButton_svg{height:15px;width:15px;fill:#cacccd;}.DayPickerKeyboardShortcuts_buttonReset{background:0 0;border:0;border-radius:0;color:inherit;font:inherit;line-height:normal;overflow:visible;padding:0;cursor:pointer;font-size:14px;}.DayPickerKeyboardShortcuts_buttonReset:active{outline:0;}.DayPickerKeyboardShortcuts_show{width:33px;height:26px;position:absolute;z-index:2;}.DayPickerKeyboardShortcuts_show::before{content:'';display:block;position:absolute;}.DayPickerKeyboardShortcuts_show__bottomRight{bottom:0;right:0;}.DayPickerKeyboardShortcuts_show__bottomRight::before{border-top:26px solid transparent;border-right:33px solid #00a699;bottom:0;right:0;}.DayPickerKeyboardShortcuts_show__bottomRight:hover::before{border-right:33px solid #008489;}.DayPickerKeyboardShortcuts_show__topRight{top:0;right:0;}.DayPickerKeyboardShortcuts_show__topRight::before{border-bottom:26px solid transparent;border-right:33px solid #00a699;top:0;right:0;}.DayPickerKeyboardShortcuts_show__topRight:hover::before{border-right:33px solid #008489;}.DayPickerKeyboardShortcuts_show__topLeft{top:0;left:0;}.DayPickerKeyboardShortcuts_show__topLeft::before{border-bottom:26px solid transparent;border-left:33px solid #00a699;top:0;left:0;}.DayPickerKeyboardShortcuts_show__topLeft:hover::before{border-left:33px solid #008489;}.DayPickerKeyboardShortcuts_showSpan{color:#fff;position:absolute;}.DayPickerKeyboardShortcuts_showSpan__bottomRight{bottom:0;right:5px;}.DayPickerKeyboardShortcuts_showSpan__topRight{top:1px;right:5px;}.DayPickerKeyboardShortcuts_showSpan__topLeft{top:1px;left:5px;}.DayPickerKeyboardShortcuts_panel{overflow:auto;background:#fff;border:1px solid #dbdbdb;border-radius:2px;position:absolute;top:0;bottom:0;right:0;left:0;z-index:2;padding:22px;margin:33px;text-align:left;}.DayPickerKeyboardShortcuts_title{font-size:16px;font-weight:700;margin:0;}.DayPickerKeyboardShortcuts_list{list-style:none;padding:0;font-size:14px;}.DayPickerKeyboardShortcuts_close{position:absolute;right:22px;top:22px;z-index:2;}.DayPickerKeyboardShortcuts_close:active{outline:0;}.DayPickerKeyboardShortcuts_closeSvg{height:15px;width:15px;fill:#cacccd;}.DayPickerKeyboardShortcuts_closeSvg:focus,.DayPickerKeyboardShortcuts_closeSvg:hover{fill:#82888a;}.CalendarDay{-moz-box-sizing:border-box;box-sizing:border-box;cursor:pointer;font-size:14px;text-align:center;}.CalendarDay:active{outline:0;}.CalendarDay__defaultCursor{cursor:default;}.CalendarDay__default{border:1px solid #e4e7e7;color:#484848;background:#fff;}.CalendarDay__default:hover{background:#e4e7e7;border:1px solid #e4e7e7;color:inherit;}.CalendarDay__hovered_offset{background:#f4f5f5;border:1px double #e4e7e7;color:inherit;}.CalendarDay__outside{border:0;background:#fff;color:#484848;}.CalendarDay__outside:hover{border:0;}.CalendarDay__blocked_minimum_nights{background:#fff;border:1px solid #eceeee;color:#cacccd;}.CalendarDay__blocked_minimum_nights:active,.CalendarDay__blocked_minimum_nights:hover{background:#fff;color:#cacccd;}.CalendarDay__highlighted_calendar{background:#ffe8bc;color:#484848;}.CalendarDay__highlighted_calendar:active,.CalendarDay__highlighted_calendar:hover{background:#ffce71;color:#484848;}.CalendarDay__selected_span{background:#66e2da;border:1px double #33dacd;color:#fff;}.CalendarDay__selected_span:active,.CalendarDay__selected_span:hover{background:#33dacd;border:1px double #33dacd;color:#fff;}.CalendarDay__selected,.CalendarDay__selected:active,.CalendarDay__selected:hover{background:#00a699;border:1px double #00a699;color:#fff;}.CalendarDay__hovered_span,.CalendarDay__hovered_span:hover{background:#b2f1ec;border:1px double #80e8e0;color:#007a87;}.CalendarDay__hovered_span:active{background:#80e8e0;border:1px double #80e8e0;color:#007a87;}.CalendarDay__blocked_calendar,.CalendarDay__blocked_calendar:active,.CalendarDay__blocked_calendar:hover{background:#cacccd;border:1px solid #cacccd;color:#82888a;}.CalendarDay__blocked_out_of_range,.CalendarDay__blocked_out_of_range:active,.CalendarDay__blocked_out_of_range:hover{background:#fff;border:1px solid #e4e7e7;color:#cacccd;}.CalendarDay__hovered_start_first_possible_end{background:#eceeee;border:1px double #eceeee;}.CalendarDay__hovered_start_blocked_min_nights{background:#eceeee;border:1px double #e4e7e7;}.CalendarMonth{background:#fff;text-align:center;vertical-align:top;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}.CalendarMonth_table{border-collapse:collapse;border-spacing:0;}.CalendarMonth_verticalSpacing{border-collapse:separate;}.CalendarMonth_caption{color:#484848;font-size:18px;text-align:center;padding-top:22px;padding-bottom:37px;caption-side:initial;}.CalendarMonth_caption__verticalScrollable{padding-top:12px;padding-bottom:7px;}.CalendarMonthGrid{background:#fff;text-align:left;z-index:0;}.CalendarMonthGrid__animating{z-index:1;}.CalendarMonthGrid__horizontal{position:absolute;left:9px;}.CalendarMonthGrid__vertical,.CalendarMonthGrid__vertical_scrollable{margin:0 auto;}.CalendarMonthGrid_month__horizontal{display:inline-block;vertical-align:top;min-height:100%;}.CalendarMonthGrid_month__hideForAnimation{position:absolute;z-index:-1;opacity:0;pointer-events:none;}.CalendarMonthGrid_month__hidden{visibility:hidden;}.DayPickerNavigation{position:relative;z-index:2;}.DayPickerNavigation__horizontal{height:0;}.DayPickerNavigation__verticalScrollable_prevNav{z-index:1;}.DayPickerNavigation__verticalDefault{position:absolute;width:100%;height:52px;bottom:0;left:0;}.DayPickerNavigation__verticalScrollableDefault{position:relative;}.DayPickerNavigation__bottom{height:auto;}.DayPickerNavigation__bottomDefault{-webkit-box-pack:justify;-ms-flex-pack:justify;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-justify-content:space-between;justify-content:space-between;}.DayPickerNavigation_button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border:0;padding:0;margin:0;}.DayPickerNavigation_button__default{border:1px solid #e4e7e7;background-color:#fff;color:#757575;}.DayPickerNavigation_button__default:focus,.DayPickerNavigation_button__default:hover{border:1px solid #c4c4c4;}.DayPickerNavigation_button__default:active{background:#f2f2f2;}.DayPickerNavigation_button__disabled{cursor:default;border:1px solid #f2f2f2;}.DayPickerNavigation_button__disabled:focus,.DayPickerNavigation_button__disabled:hover{border:1px solid #f2f2f2;}.DayPickerNavigation_button__disabled:active{background:0 0;}.DayPickerNavigation_button__horizontalDefault{position:absolute;top:18px;line-height:0.78;border-radius:3px;padding:6px 9px;}.DayPickerNavigation_bottomButton__horizontalDefault{position:static;margin:-10px 22px 30px;}.DayPickerNavigation_leftButton__horizontalDefault{left:22px;}.DayPickerNavigation_rightButton__horizontalDefault{right:22px;}.DayPickerNavigation_button__verticalDefault{padding:5px;background:#fff;box-shadow:0 0 5px 2px rgba(0,0,0,0.1);position:relative;display:inline-block;text-align:center;height:100%;width:50%;}.DayPickerNavigation_nextButton__verticalDefault{border-left:0;}.DayPickerNavigation_nextButton__verticalScrollableDefault,.DayPickerNavigation_prevButton__verticalScrollableDefault{width:100%;}.DayPickerNavigation_svg__horizontal{height:19px;width:19px;fill:#82888a;display:block;}.DayPickerNavigation_svg__vertical{height:42px;width:42px;fill:#484848;}.DayPickerNavigation_svg__disabled{fill:#f2f2f2;}.DayPicker{background:#fff;position:relative;text-align:left;}.DayPicker__horizontal{background:#fff;}.DayPicker__verticalScrollable{height:100%;}.DayPicker__hidden{visibility:hidden;}.DayPicker__withBorder{box-shadow:0 2px 6px rgba(0,0,0,0.05),0 0 0 1px rgba(0,0,0,0.07);border-radius:3px;}.DayPicker_portal__horizontal{box-shadow:none;position:absolute;left:50%;top:50%;}.DayPicker_portal__vertical{position:initial;}.DayPicker_focusRegion{outline:0;}.DayPicker_calendarInfo__horizontal,.DayPicker_wrapper__horizontal{display:inline-block;vertical-align:top;}.DayPicker_weekHeaders{position:relative;}.DayPicker_weekHeaders__horizontal{margin-left:9px;}.DayPicker_weekHeader{color:#757575;position:absolute;top:62px;z-index:2;text-align:left;}.DayPicker_weekHeader__vertical{left:50%;}.DayPicker_weekHeader__verticalScrollable{top:0;display:table-row;border-bottom:1px solid #dbdbdb;background:#fff;margin-left:0;left:0;width:100%;text-align:center;}.DayPicker_weekHeader_ul{list-style:none;margin:1px 0;padding-left:0;padding-right:0;font-size:14px;}.DayPicker_weekHeader_li{display:inline-block;text-align:center;}.DayPicker_transitionContainer{position:relative;overflow:hidden;border-radius:3px;}.DayPicker_transitionContainer__horizontal{-webkit-transition:height 0.2s ease-in-out;-moz-transition:height 0.2s ease-in-out;transition:height 0.2s ease-in-out;}.DayPicker_transitionContainer__vertical{width:100%;}.DayPicker_transitionContainer__verticalScrollable{padding-top:20px;height:100%;position:absolute;top:0;bottom:0;right:0;left:0;overflow-y:scroll;}.DateInput_input{display:none;}.DateInput_screenReaderMessage{border:0;clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;}.DateInput_fang{position:absolute;top:55px;width:20px;height:10px;left:22px;z-index:2;}.DateInput_fangShape{fill:#fff;}.DateInput_fangStroke{stroke:#dbdbdb;fill:transparent;}.DateRangePickerInput{background-color:#fff;display:inline-block;}.DateRangePickerInput__disabled{background:#f2f2f2;}.DateRangePickerInput__withBorder{border-radius:2px;border:1px solid #dbdbdb;}.DateRangePickerInput__rtl{direction:rtl;}.DateRangePickerInput__block{display:block;}.DateRangePickerInput__showClearDates{padding-right:30px;}.DateRangePickerInput_arrow{display:inline-block;vertical-align:middle;color:#484848;}.DateRangePickerInput_arrow_svg{vertical-align:middle;fill:#484848;height:24px;width:24px;}.DateRangePickerInput_clearDates{background:0 0;border:0;color:inherit;font:inherit;line-height:normal;overflow:visible;cursor:pointer;padding:10px;margin:0 10px 0 5px;position:absolute;right:0;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);}.DateRangePickerInput_clearDates__small{padding:6px;}.DateRangePickerInput_clearDates_default:focus,.DateRangePickerInput_clearDates_default:hover{background:#dbdbdb;border-radius:50%;}.DateRangePickerInput_clearDates__hide{visibility:hidden;}.DateRangePickerInput_clearDates_svg{fill:#82888a;height:12px;width:15px;vertical-align:middle;}.DateRangePickerInput_clearDates_svg__small{height:9px;}.DateRangePickerInput_calendarIcon{background:0 0;border:0;color:inherit;font:inherit;line-height:normal;overflow:visible;cursor:pointer;display:inline-block;vertical-align:middle;padding:10px;margin:0 5px 0 10px;}.DateRangePickerInput_calendarIcon_svg{fill:#82888a;height:15px;width:14px;vertical-align:middle;}.DateRangePicker{position:relative;display:inline-block;}.DateRangePicker__block{display:block;}.DateRangePicker_picker{z-index:1;background-color:#fff;position:absolute;}.DateRangePicker_picker__rtl{direction:rtl;}.DateRangePicker_picker__directionLeft{left:0;}.DateRangePicker_picker__directionRight{right:0;}.DateRangePicker_picker__portal{background-color:rgba(0,0,0,0.3);position:fixed;top:0;left:0;height:100%;width:100%;}.DateRangePicker_picker__fullScreenPortal{background-color:#fff;}.DateRangePicker_closeButton{background:0 0;border:0;color:inherit;font:inherit;line-height:normal;overflow:visible;cursor:pointer;position:absolute;top:0;right:0;padding:15px;z-index:2;}.DateRangePicker_closeButton:focus,.DateRangePicker_closeButton:hover{color:darken(#cacccd,10%);text-decoration:none;}.DateRangePicker_closeButton_svg{height:15px;width:15px;fill:#cacccd;}"]);
1
+ import { styledComponents } from '../utils';
2
+ const {
3
+ css
4
+ } = styledComponents;
5
+ const defaultReactDatesCss = css`
6
+ .PresetDateRangePicker_panel {
7
+ padding: 0 22px 11px;
8
+ }
9
+ .PresetDateRangePicker_button {
10
+ position: relative;
11
+ height: 100%;
12
+ text-align: center;
13
+ background: 0 0;
14
+ border: 2px solid #00a699;
15
+ color: #00a699;
16
+ padding: 4px 12px;
17
+ margin-right: 8px;
18
+ font: inherit;
19
+ font-weight: 700;
20
+ line-height: normal;
21
+ overflow: visible;
22
+ -moz-box-sizing: border-box;
23
+ box-sizing: border-box;
24
+ cursor: pointer;
25
+ }
26
+ .PresetDateRangePicker_button:active {
27
+ outline: 0;
28
+ }
29
+ .PresetDateRangePicker_button__selected {
30
+ color: #fff;
31
+ background: #00a699;
32
+ }
33
+ .SingleDatePickerInput {
34
+ display: inline-block;
35
+ background-color: #fff;
36
+ position: absolute;
37
+ top: -55px;
38
+ }
39
+ .SingleDatePickerInput__disabled {
40
+ background-color: #f2f2f2;
41
+ }
42
+ .SingleDatePickerInput__block {
43
+ display: block;
44
+ }
45
+ .SingleDatePickerInput__showClearDate {
46
+ padding-right: 30px;
47
+ }
48
+ .SingleDatePickerInput_clearDate {
49
+ background: 0 0;
50
+ border: 0;
51
+ color: inherit;
52
+ font: inherit;
53
+ line-height: normal;
54
+ overflow: visible;
55
+ cursor: pointer;
56
+ padding: 10px;
57
+ margin: 0 10px 0 5px;
58
+ position: absolute;
59
+ right: 0;
60
+ top: 50%;
61
+ -webkit-transform: translateY(-50%);
62
+ -ms-transform: translateY(-50%);
63
+ transform: translateY(-50%);
64
+ }
65
+ .SingleDatePickerInput_clearDate__default:focus,
66
+ .SingleDatePickerInput_clearDate__default:hover {
67
+ background: #dbdbdb;
68
+ border-radius: 50%;
69
+ }
70
+ .SingleDatePickerInput_clearDate__small {
71
+ padding: 6px;
72
+ }
73
+ .SingleDatePickerInput_clearDate__hide {
74
+ visibility: hidden;
75
+ }
76
+ .SingleDatePickerInput_clearDate_svg {
77
+ fill: #82888a;
78
+ height: 12px;
79
+ width: 15px;
80
+ vertical-align: middle;
81
+ }
82
+ .SingleDatePickerInput_clearDate_svg__small {
83
+ height: 9px;
84
+ }
85
+ .SingleDatePickerInput_calendarIcon {
86
+ background: 0 0;
87
+ border: 0;
88
+ color: inherit;
89
+ font: inherit;
90
+ line-height: normal;
91
+ overflow: visible;
92
+ cursor: pointer;
93
+ display: inline-block;
94
+ vertical-align: middle;
95
+ padding: 10px;
96
+ margin: 0 5px 0 10px;
97
+ }
98
+ .SingleDatePickerInput_calendarIcon_svg {
99
+ fill: #82888a;
100
+ height: 15px;
101
+ width: 14px;
102
+ vertical-align: middle;
103
+ }
104
+ .SingleDatePicker {
105
+ position: relative;
106
+ display: inline-block;
107
+ }
108
+ .SingleDatePicker__block {
109
+ display: block;
110
+ }
111
+ .SingleDatePicker_picker {
112
+ z-index: 1;
113
+ background-color: #fff;
114
+ position: absolute;
115
+ }
116
+ .SingleDatePicker_picker__rtl {
117
+ direction: rtl;
118
+ }
119
+ .SingleDatePicker_picker__directionLeft {
120
+ left: 0;
121
+ }
122
+ .SingleDatePicker_picker__directionRight {
123
+ right: 0;
124
+ }
125
+ .SingleDatePicker_picker__portal {
126
+ background-color: rgba(0, 0, 0, 0.3);
127
+ position: fixed;
128
+ top: 0;
129
+ left: 0;
130
+ height: 100%;
131
+ width: 100%;
132
+ }
133
+ .SingleDatePicker_picker__fullScreenPortal {
134
+ background-color: #fff;
135
+ }
136
+ .SingleDatePicker_closeButton {
137
+ background: 0 0;
138
+ border: 0;
139
+ color: inherit;
140
+ font: inherit;
141
+ line-height: normal;
142
+ overflow: visible;
143
+ cursor: pointer;
144
+ position: absolute;
145
+ top: 0;
146
+ right: 0;
147
+ padding: 15px;
148
+ z-index: 2;
149
+ }
150
+ .SingleDatePicker_closeButton:focus,
151
+ .SingleDatePicker_closeButton:hover {
152
+ color: darken(#cacccd, 10%);
153
+ text-decoration: none;
154
+ }
155
+ .SingleDatePicker_closeButton_svg {
156
+ height: 15px;
157
+ width: 15px;
158
+ fill: #cacccd;
159
+ }
160
+ .DayPickerKeyboardShortcuts_buttonReset {
161
+ background: 0 0;
162
+ border: 0;
163
+ border-radius: 0;
164
+ color: inherit;
165
+ font: inherit;
166
+ line-height: normal;
167
+ overflow: visible;
168
+ padding: 0;
169
+ cursor: pointer;
170
+ font-size: 14px;
171
+ }
172
+ .DayPickerKeyboardShortcuts_buttonReset:active {
173
+ outline: 0;
174
+ }
175
+ .DayPickerKeyboardShortcuts_show {
176
+ width: 33px;
177
+ height: 26px;
178
+ position: absolute;
179
+ z-index: 2;
180
+ }
181
+ .DayPickerKeyboardShortcuts_show::before {
182
+ content: '';
183
+ display: block;
184
+ position: absolute;
185
+ }
186
+ .DayPickerKeyboardShortcuts_show__bottomRight {
187
+ bottom: 0;
188
+ right: 0;
189
+ }
190
+ .DayPickerKeyboardShortcuts_show__bottomRight::before {
191
+ border-top: 26px solid transparent;
192
+ border-right: 33px solid #00a699;
193
+ bottom: 0;
194
+ right: 0;
195
+ }
196
+ .DayPickerKeyboardShortcuts_show__bottomRight:hover::before {
197
+ border-right: 33px solid #008489;
198
+ }
199
+ .DayPickerKeyboardShortcuts_show__topRight {
200
+ top: 0;
201
+ right: 0;
202
+ }
203
+ .DayPickerKeyboardShortcuts_show__topRight::before {
204
+ border-bottom: 26px solid transparent;
205
+ border-right: 33px solid #00a699;
206
+ top: 0;
207
+ right: 0;
208
+ }
209
+ .DayPickerKeyboardShortcuts_show__topRight:hover::before {
210
+ border-right: 33px solid #008489;
211
+ }
212
+ .DayPickerKeyboardShortcuts_show__topLeft {
213
+ top: 0;
214
+ left: 0;
215
+ }
216
+ .DayPickerKeyboardShortcuts_show__topLeft::before {
217
+ border-bottom: 26px solid transparent;
218
+ border-left: 33px solid #00a699;
219
+ top: 0;
220
+ left: 0;
221
+ }
222
+ .DayPickerKeyboardShortcuts_show__topLeft:hover::before {
223
+ border-left: 33px solid #008489;
224
+ }
225
+ .DayPickerKeyboardShortcuts_showSpan {
226
+ color: #fff;
227
+ position: absolute;
228
+ }
229
+ .DayPickerKeyboardShortcuts_showSpan__bottomRight {
230
+ bottom: 0;
231
+ right: 5px;
232
+ }
233
+ .DayPickerKeyboardShortcuts_showSpan__topRight {
234
+ top: 1px;
235
+ right: 5px;
236
+ }
237
+ .DayPickerKeyboardShortcuts_showSpan__topLeft {
238
+ top: 1px;
239
+ left: 5px;
240
+ }
241
+ .DayPickerKeyboardShortcuts_panel {
242
+ overflow: auto;
243
+ background: #fff;
244
+ border: 1px solid #dbdbdb;
245
+ border-radius: 2px;
246
+ position: absolute;
247
+ top: 0;
248
+ bottom: 0;
249
+ right: 0;
250
+ left: 0;
251
+ z-index: 2;
252
+ padding: 22px;
253
+ margin: 33px;
254
+ text-align: left;
255
+ }
256
+ .DayPickerKeyboardShortcuts_title {
257
+ font-size: 16px;
258
+ font-weight: 700;
259
+ margin: 0;
260
+ }
261
+ .DayPickerKeyboardShortcuts_list {
262
+ list-style: none;
263
+ padding: 0;
264
+ font-size: 14px;
265
+ }
266
+ .DayPickerKeyboardShortcuts_close {
267
+ position: absolute;
268
+ right: 22px;
269
+ top: 22px;
270
+ z-index: 2;
271
+ }
272
+ .DayPickerKeyboardShortcuts_close:active {
273
+ outline: 0;
274
+ }
275
+ .DayPickerKeyboardShortcuts_closeSvg {
276
+ height: 15px;
277
+ width: 15px;
278
+ fill: #cacccd;
279
+ }
280
+ .DayPickerKeyboardShortcuts_closeSvg:focus,
281
+ .DayPickerKeyboardShortcuts_closeSvg:hover {
282
+ fill: #82888a;
283
+ }
284
+ .CalendarDay {
285
+ -moz-box-sizing: border-box;
286
+ box-sizing: border-box;
287
+ cursor: pointer;
288
+ font-size: 14px;
289
+ text-align: center;
290
+ }
291
+ .CalendarDay:active {
292
+ outline: 0;
293
+ }
294
+ .CalendarDay__defaultCursor {
295
+ cursor: default;
296
+ }
297
+ .CalendarDay__default {
298
+ border: 1px solid #e4e7e7;
299
+ color: #484848;
300
+ background: #fff;
301
+ }
302
+ .CalendarDay__default:hover {
303
+ background: #e4e7e7;
304
+ border: 1px solid #e4e7e7;
305
+ color: inherit;
306
+ }
307
+ .CalendarDay__hovered_offset {
308
+ background: #f4f5f5;
309
+ border: 1px double #e4e7e7;
310
+ color: inherit;
311
+ }
312
+ .CalendarDay__outside {
313
+ border: 0;
314
+ background: #fff;
315
+ color: #484848;
316
+ }
317
+ .CalendarDay__outside:hover {
318
+ border: 0;
319
+ }
320
+ .CalendarDay__blocked_minimum_nights {
321
+ background: #fff;
322
+ border: 1px solid #eceeee;
323
+ color: #cacccd;
324
+ }
325
+ .CalendarDay__blocked_minimum_nights:active,
326
+ .CalendarDay__blocked_minimum_nights:hover {
327
+ background: #fff;
328
+ color: #cacccd;
329
+ }
330
+ .CalendarDay__highlighted_calendar {
331
+ background: #ffe8bc;
332
+ color: #484848;
333
+ }
334
+ .CalendarDay__highlighted_calendar:active,
335
+ .CalendarDay__highlighted_calendar:hover {
336
+ background: #ffce71;
337
+ color: #484848;
338
+ }
339
+ .CalendarDay__selected_span {
340
+ background: #66e2da;
341
+ border: 1px double #33dacd;
342
+ color: #fff;
343
+ }
344
+ .CalendarDay__selected_span:active,
345
+ .CalendarDay__selected_span:hover {
346
+ background: #33dacd;
347
+ border: 1px double #33dacd;
348
+ color: #fff;
349
+ }
350
+ .CalendarDay__selected,
351
+ .CalendarDay__selected:active,
352
+ .CalendarDay__selected:hover {
353
+ background: #00a699;
354
+ border: 1px double #00a699;
355
+ color: #fff;
356
+ }
357
+ .CalendarDay__hovered_span,
358
+ .CalendarDay__hovered_span:hover {
359
+ background: #b2f1ec;
360
+ border: 1px double #80e8e0;
361
+ color: #007a87;
362
+ }
363
+ .CalendarDay__hovered_span:active {
364
+ background: #80e8e0;
365
+ border: 1px double #80e8e0;
366
+ color: #007a87;
367
+ }
368
+ .CalendarDay__blocked_calendar,
369
+ .CalendarDay__blocked_calendar:active,
370
+ .CalendarDay__blocked_calendar:hover {
371
+ background: #cacccd;
372
+ border: 1px solid #cacccd;
373
+ color: #82888a;
374
+ }
375
+ .CalendarDay__blocked_out_of_range,
376
+ .CalendarDay__blocked_out_of_range:active,
377
+ .CalendarDay__blocked_out_of_range:hover {
378
+ background: #fff;
379
+ border: 1px solid #e4e7e7;
380
+ color: #cacccd;
381
+ }
382
+ .CalendarDay__hovered_start_first_possible_end {
383
+ background: #eceeee;
384
+ border: 1px double #eceeee;
385
+ }
386
+ .CalendarDay__hovered_start_blocked_min_nights {
387
+ background: #eceeee;
388
+ border: 1px double #e4e7e7;
389
+ }
390
+ .CalendarMonth {
391
+ background: #fff;
392
+ text-align: center;
393
+ vertical-align: top;
394
+ -webkit-user-select: none;
395
+ -moz-user-select: none;
396
+ -ms-user-select: none;
397
+ user-select: none;
398
+ }
399
+ .CalendarMonth_table {
400
+ border-collapse: collapse;
401
+ border-spacing: 0;
402
+ }
403
+ .CalendarMonth_verticalSpacing {
404
+ border-collapse: separate;
405
+ }
406
+ .CalendarMonth_caption {
407
+ color: #484848;
408
+ font-size: 18px;
409
+ text-align: center;
410
+ padding-top: 22px;
411
+ padding-bottom: 37px;
412
+ caption-side: initial;
413
+ }
414
+ .CalendarMonth_caption__verticalScrollable {
415
+ padding-top: 12px;
416
+ padding-bottom: 7px;
417
+ }
418
+ .CalendarMonthGrid {
419
+ background: #fff;
420
+ text-align: left;
421
+ z-index: 0;
422
+ }
423
+ .CalendarMonthGrid__animating {
424
+ z-index: 1;
425
+ }
426
+ .CalendarMonthGrid__horizontal {
427
+ position: absolute;
428
+ left: 9px;
429
+ }
430
+ .CalendarMonthGrid__vertical,
431
+ .CalendarMonthGrid__vertical_scrollable {
432
+ margin: 0 auto;
433
+ }
434
+ .CalendarMonthGrid_month__horizontal {
435
+ display: inline-block;
436
+ vertical-align: top;
437
+ min-height: 100%;
438
+ }
439
+ .CalendarMonthGrid_month__hideForAnimation {
440
+ position: absolute;
441
+ z-index: -1;
442
+ opacity: 0;
443
+ pointer-events: none;
444
+ }
445
+ .CalendarMonthGrid_month__hidden {
446
+ visibility: hidden;
447
+ }
448
+ .DayPickerNavigation {
449
+ position: relative;
450
+ z-index: 2;
451
+ }
452
+ .DayPickerNavigation__horizontal {
453
+ height: 0;
454
+ }
455
+ .DayPickerNavigation__verticalScrollable_prevNav {
456
+ z-index: 1;
457
+ }
458
+ .DayPickerNavigation__verticalDefault {
459
+ position: absolute;
460
+ width: 100%;
461
+ height: 52px;
462
+ bottom: 0;
463
+ left: 0;
464
+ }
465
+ .DayPickerNavigation__verticalScrollableDefault {
466
+ position: relative;
467
+ }
468
+ .DayPickerNavigation__bottom {
469
+ height: auto;
470
+ }
471
+ .DayPickerNavigation__bottomDefault {
472
+ -webkit-box-pack: justify;
473
+ -ms-flex-pack: justify;
474
+ display: -webkit-box;
475
+ display: -moz-box;
476
+ display: -ms-flexbox;
477
+ display: -webkit-flex;
478
+ display: flex;
479
+ -webkit-justify-content: space-between;
480
+ justify-content: space-between;
481
+ }
482
+ .DayPickerNavigation_button {
483
+ cursor: pointer;
484
+ -webkit-user-select: none;
485
+ -moz-user-select: none;
486
+ -ms-user-select: none;
487
+ user-select: none;
488
+ border: 0;
489
+ padding: 0;
490
+ margin: 0;
491
+ }
492
+ .DayPickerNavigation_button__default {
493
+ border: 1px solid #e4e7e7;
494
+ background-color: #fff;
495
+ color: #757575;
496
+ }
497
+ .DayPickerNavigation_button__default:focus,
498
+ .DayPickerNavigation_button__default:hover {
499
+ border: 1px solid #c4c4c4;
500
+ }
501
+ .DayPickerNavigation_button__default:active {
502
+ background: #f2f2f2;
503
+ }
504
+ .DayPickerNavigation_button__disabled {
505
+ cursor: default;
506
+ border: 1px solid #f2f2f2;
507
+ }
508
+ .DayPickerNavigation_button__disabled:focus,
509
+ .DayPickerNavigation_button__disabled:hover {
510
+ border: 1px solid #f2f2f2;
511
+ }
512
+ .DayPickerNavigation_button__disabled:active {
513
+ background: 0 0;
514
+ }
515
+ .DayPickerNavigation_button__horizontalDefault {
516
+ position: absolute;
517
+ top: 18px;
518
+ line-height: 0.78;
519
+ border-radius: 3px;
520
+ padding: 6px 9px;
521
+ }
522
+ .DayPickerNavigation_bottomButton__horizontalDefault {
523
+ position: static;
524
+ margin: -10px 22px 30px;
525
+ }
526
+ .DayPickerNavigation_leftButton__horizontalDefault {
527
+ left: 22px;
528
+ }
529
+ .DayPickerNavigation_rightButton__horizontalDefault {
530
+ right: 22px;
531
+ }
532
+ .DayPickerNavigation_button__verticalDefault {
533
+ padding: 5px;
534
+ background: #fff;
535
+ box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.1);
536
+ position: relative;
537
+ display: inline-block;
538
+ text-align: center;
539
+ height: 100%;
540
+ width: 50%;
541
+ }
542
+ .DayPickerNavigation_nextButton__verticalDefault {
543
+ border-left: 0;
544
+ }
545
+ .DayPickerNavigation_nextButton__verticalScrollableDefault,
546
+ .DayPickerNavigation_prevButton__verticalScrollableDefault {
547
+ width: 100%;
548
+ }
549
+ .DayPickerNavigation_svg__horizontal {
550
+ height: 19px;
551
+ width: 19px;
552
+ fill: #82888a;
553
+ display: block;
554
+ }
555
+ .DayPickerNavigation_svg__vertical {
556
+ height: 42px;
557
+ width: 42px;
558
+ fill: #484848;
559
+ }
560
+ .DayPickerNavigation_svg__disabled {
561
+ fill: #f2f2f2;
562
+ }
563
+ .DayPicker {
564
+ background: #fff;
565
+ position: relative;
566
+ text-align: left;
567
+ }
568
+ .DayPicker__horizontal {
569
+ background: #fff;
570
+ }
571
+ .DayPicker__verticalScrollable {
572
+ height: 100%;
573
+ }
574
+ .DayPicker__hidden {
575
+ visibility: hidden;
576
+ }
577
+ .DayPicker__withBorder {
578
+ box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.07);
579
+ border-radius: 3px;
580
+ }
581
+ .DayPicker_portal__horizontal {
582
+ box-shadow: none;
583
+ position: absolute;
584
+ left: 50%;
585
+ top: 50%;
586
+ }
587
+ .DayPicker_portal__vertical {
588
+ position: initial;
589
+ }
590
+ .DayPicker_focusRegion {
591
+ outline: 0;
592
+ }
593
+ .DayPicker_calendarInfo__horizontal,
594
+ .DayPicker_wrapper__horizontal {
595
+ display: inline-block;
596
+ vertical-align: top;
597
+ }
598
+ .DayPicker_weekHeaders {
599
+ position: relative;
600
+ }
601
+ .DayPicker_weekHeaders__horizontal {
602
+ margin-left: 9px;
603
+ }
604
+ .DayPicker_weekHeader {
605
+ color: #757575;
606
+ position: absolute;
607
+ top: 62px;
608
+ z-index: 2;
609
+ text-align: left;
610
+ }
611
+ .DayPicker_weekHeader__vertical {
612
+ left: 50%;
613
+ }
614
+ .DayPicker_weekHeader__verticalScrollable {
615
+ top: 0;
616
+ display: table-row;
617
+ border-bottom: 1px solid #dbdbdb;
618
+ background: #fff;
619
+ margin-left: 0;
620
+ left: 0;
621
+ width: 100%;
622
+ text-align: center;
623
+ }
624
+ .DayPicker_weekHeader_ul {
625
+ list-style: none;
626
+ margin: 1px 0;
627
+ padding-left: 0;
628
+ padding-right: 0;
629
+ font-size: 14px;
630
+ }
631
+ .DayPicker_weekHeader_li {
632
+ display: inline-block;
633
+ text-align: center;
634
+ }
635
+ .DayPicker_transitionContainer {
636
+ position: relative;
637
+ overflow: hidden;
638
+ border-radius: 3px;
639
+ }
640
+ .DayPicker_transitionContainer__horizontal {
641
+ -webkit-transition: height 0.2s ease-in-out;
642
+ -moz-transition: height 0.2s ease-in-out;
643
+ transition: height 0.2s ease-in-out;
644
+ }
645
+ .DayPicker_transitionContainer__vertical {
646
+ width: 100%;
647
+ }
648
+ .DayPicker_transitionContainer__verticalScrollable {
649
+ padding-top: 20px;
650
+ height: 100%;
651
+ position: absolute;
652
+ top: 0;
653
+ bottom: 0;
654
+ right: 0;
655
+ left: 0;
656
+ overflow-y: scroll;
657
+ }
658
+ .DateInput_input {
659
+ display: none;
660
+ }
661
+ .DateInput_screenReaderMessage {
662
+ border: 0;
663
+ clip: rect(0, 0, 0, 0);
664
+ height: 1px;
665
+ margin: -1px;
666
+ overflow: hidden;
667
+ padding: 0;
668
+ position: absolute;
669
+ width: 1px;
670
+ }
671
+ .DateInput_fang {
672
+ position: absolute;
673
+ top: 55px;
674
+ width: 20px;
675
+ height: 10px;
676
+ left: 22px;
677
+ z-index: 2;
678
+ }
679
+ .DateInput_fangShape {
680
+ fill: #fff;
681
+ }
682
+ .DateInput_fangStroke {
683
+ stroke: #dbdbdb;
684
+ fill: transparent;
685
+ }
686
+ .DateRangePickerInput {
687
+ background-color: #fff;
688
+ display: inline-block;
689
+ }
690
+ .DateRangePickerInput__disabled {
691
+ background: #f2f2f2;
692
+ }
693
+ .DateRangePickerInput__withBorder {
694
+ border-radius: 2px;
695
+ border: 1px solid #dbdbdb;
696
+ }
697
+ .DateRangePickerInput__rtl {
698
+ direction: rtl;
699
+ }
700
+ .DateRangePickerInput__block {
701
+ display: block;
702
+ }
703
+ .DateRangePickerInput__showClearDates {
704
+ padding-right: 30px;
705
+ }
706
+ .DateRangePickerInput_arrow {
707
+ display: inline-block;
708
+ vertical-align: middle;
709
+ color: #484848;
710
+ }
711
+ .DateRangePickerInput_arrow_svg {
712
+ vertical-align: middle;
713
+ fill: #484848;
714
+ height: 24px;
715
+ width: 24px;
716
+ }
717
+ .DateRangePickerInput_clearDates {
718
+ background: 0 0;
719
+ border: 0;
720
+ color: inherit;
721
+ font: inherit;
722
+ line-height: normal;
723
+ overflow: visible;
724
+ cursor: pointer;
725
+ padding: 10px;
726
+ margin: 0 10px 0 5px;
727
+ position: absolute;
728
+ right: 0;
729
+ top: 50%;
730
+ -webkit-transform: translateY(-50%);
731
+ -ms-transform: translateY(-50%);
732
+ transform: translateY(-50%);
733
+ }
734
+ .DateRangePickerInput_clearDates__small {
735
+ padding: 6px;
736
+ }
737
+ .DateRangePickerInput_clearDates_default:focus,
738
+ .DateRangePickerInput_clearDates_default:hover {
739
+ background: #dbdbdb;
740
+ border-radius: 50%;
741
+ }
742
+ .DateRangePickerInput_clearDates__hide {
743
+ visibility: hidden;
744
+ }
745
+ .DateRangePickerInput_clearDates_svg {
746
+ fill: #82888a;
747
+ height: 12px;
748
+ width: 15px;
749
+ vertical-align: middle;
750
+ }
751
+ .DateRangePickerInput_clearDates_svg__small {
752
+ height: 9px;
753
+ }
754
+ .DateRangePickerInput_calendarIcon {
755
+ background: 0 0;
756
+ border: 0;
757
+ color: inherit;
758
+ font: inherit;
759
+ line-height: normal;
760
+ overflow: visible;
761
+ cursor: pointer;
762
+ display: inline-block;
763
+ vertical-align: middle;
764
+ padding: 10px;
765
+ margin: 0 5px 0 10px;
766
+ }
767
+ .DateRangePickerInput_calendarIcon_svg {
768
+ fill: #82888a;
769
+ height: 15px;
770
+ width: 14px;
771
+ vertical-align: middle;
772
+ }
773
+ .DateRangePicker {
774
+ position: relative;
775
+ display: inline-block;
776
+ }
777
+ .DateRangePicker__block {
778
+ display: block;
779
+ }
780
+ .DateRangePicker_picker {
781
+ z-index: 1;
782
+ background-color: #fff;
783
+ position: absolute;
784
+ }
785
+ .DateRangePicker_picker__rtl {
786
+ direction: rtl;
787
+ }
788
+ .DateRangePicker_picker__directionLeft {
789
+ left: 0;
790
+ }
791
+ .DateRangePicker_picker__directionRight {
792
+ right: 0;
793
+ }
794
+ .DateRangePicker_picker__portal {
795
+ background-color: rgba(0, 0, 0, 0.3);
796
+ position: fixed;
797
+ top: 0;
798
+ left: 0;
799
+ height: 100%;
800
+ width: 100%;
801
+ }
802
+ .DateRangePicker_picker__fullScreenPortal {
803
+ background-color: #fff;
804
+ }
805
+ .DateRangePicker_closeButton {
806
+ background: 0 0;
807
+ border: 0;
808
+ color: inherit;
809
+ font: inherit;
810
+ line-height: normal;
811
+ overflow: visible;
812
+ cursor: pointer;
813
+ position: absolute;
814
+ top: 0;
815
+ right: 0;
816
+ padding: 15px;
817
+ z-index: 2;
818
+ }
819
+ .DateRangePicker_closeButton:focus,
820
+ .DateRangePicker_closeButton:hover {
821
+ color: darken(#cacccd, 10%);
822
+ text-decoration: none;
823
+ }
824
+ .DateRangePicker_closeButton_svg {
825
+ height: 15px;
826
+ width: 15px;
827
+ fill: #cacccd;
828
+ }
829
+ `;
3
830
  export default defaultReactDatesCss;