bootstrap-daterangepicker-rails 0.1.3 → 0.1.4

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 059447fff851eed85759905810971d1607b496ee
4
- data.tar.gz: 920a8fc2a0e5840151267b848437b1ad2688c2ed
3
+ metadata.gz: d73865e97a0f62d4683d629a37f72aff3ad39074
4
+ data.tar.gz: 30cd9cdf61cc2df9639d9b9b7ee708dc6ecdd5fb
5
5
  SHA512:
6
- metadata.gz: b4d43f429ef43c9c3a132e42e978587677c6b7592ec48cdb4f448232ca643e4488c93736ad5a55abcc8484c7c3359b5d9550c3dae356e13a514d4e79515b2bb4
7
- data.tar.gz: 2888774e20022cd74de920ccd57929daa21a21b63435e1cebccd4f051ffdfac8e919c3e1b5f8ab1fa71ac55dd84719a010beb489c2f8febddc04de5c7931c348
6
+ metadata.gz: 1f70220091b84fb88cb884e817fcf1b4d785d77e0fc91cd25975e86be8ff6f5eefe37ccf1ae09f2690d812b01fbe50ab758a05999d60800552d03b27715ded21
7
+ data.tar.gz: 9bf42304b22cc8b9ed95b6e47e44c774ad85810d3ebd38779a8d3f5359234b94c6c3e51132893c6a045ad103b4a3eb22a43a385bca0cb69f10b373447e54b107
@@ -1,7 +1,7 @@
1
1
  module Bootstrap
2
2
  module Daterangepicker
3
3
  module Rails
4
- VERSION = '0.1.3'
4
+ VERSION = '0.1.4'
5
5
  end
6
6
  end
7
7
  end
@@ -1,36 +1,36 @@
1
1
  /**
2
- * @version: 2.1.17
3
- * @author: Dan Grossman http://www.dangrossman.info/
4
- * @copyright: Copyright (c) 2012-2015 Dan Grossman. All rights reserved.
5
- * @license: Licensed under the MIT license. See http://www.opensource.org/licenses/mit-license.php
6
- * @website: https://www.improvely.com/
7
- */
2
+ * @version: 2.1.19
3
+ * @author: Dan Grossman http://www.dangrossman.info/
4
+ * @copyright: Copyright (c) 2012-2015 Dan Grossman. All rights reserved.
5
+ * @license: Licensed under the MIT license. See http://www.opensource.org/licenses/mit-license.php
6
+ * @website: https://www.improvely.com/
7
+ */
8
8
 
9
9
  (function(root, factory) {
10
10
 
11
- if (typeof define === 'function' && define.amd) {
12
- define(['moment', 'jquery', 'exports'], function(momentjs, $, exports) {
13
- root.daterangepicker = factory(root, exports, momentjs, $);
14
- });
15
-
16
- } else if (typeof exports !== 'undefined') {
17
- var momentjs = require('moment');
18
- var jQuery = (typeof window != 'undefined') ? window.jQuery : undefined; //isomorphic issue
19
- if (!jQuery) {
20
- try {
21
- jQuery = require('jquery');
22
- if (!jQuery.fn) jQuery.fn = {}; //isomorphic issue
23
- } catch (err) {
24
- if (!jQuery) throw new Error('jQuery dependency not found');
25
- }
26
- }
27
-
28
- factory(root, exports, momentjs, jQuery);
29
-
30
- // Finally, as a browser global.
31
- } else {
32
- root.daterangepicker = factory(root, {}, root.moment || moment, (root.jQuery || root.Zepto || root.ender || root.$));
33
- }
11
+ if (typeof define === 'function' && define.amd) {
12
+ define(['moment', 'jquery', 'exports'], function(momentjs, $, exports) {
13
+ root.daterangepicker = factory(root, exports, momentjs, $);
14
+ });
15
+
16
+ } else if (typeof exports !== 'undefined') {
17
+ var momentjs = require('moment');
18
+ var jQuery = (typeof window != 'undefined') ? window.jQuery : undefined; //isomorphic issue
19
+ if (!jQuery) {
20
+ try {
21
+ jQuery = require('jquery');
22
+ if (!jQuery.fn) jQuery.fn = {}; //isomorphic issue
23
+ } catch (err) {
24
+ if (!jQuery) throw new Error('jQuery dependency not found');
25
+ }
26
+ }
27
+
28
+ factory(root, exports, momentjs, jQuery);
29
+
30
+ // Finally, as a browser global.
31
+ } else {
32
+ root.daterangepicker = factory(root, {}, root.moment || moment, (root.jQuery || root.Zepto || root.ender || root.$));
33
+ }
34
34
 
35
35
  }(this || {}, function(root, daterangepicker, moment, $) { // 'this' doesn't exist on a server
36
36
 
@@ -48,12 +48,14 @@
48
48
  this.singleDatePicker = false;
49
49
  this.showDropdowns = false;
50
50
  this.showWeekNumbers = false;
51
+ this.showISOWeekNumbers = false;
51
52
  this.timePicker = false;
52
53
  this.timePicker24Hour = false;
53
54
  this.timePickerIncrement = 1;
54
55
  this.timePickerSeconds = false;
55
56
  this.linkedCalendars = true;
56
57
  this.autoUpdateInput = true;
58
+ this.alwaysShowCalendars = false;
57
59
  this.ranges = {};
58
60
 
59
61
  this.opens = 'right';
@@ -96,37 +98,37 @@
96
98
  options = $.extend(this.element.data(), options);
97
99
 
98
100
  //html template for the picker UI
99
- if (typeof options.template !== 'string')
101
+ if (typeof options.template !== 'string' && !(options.template instanceof $))
100
102
  options.template = '<div class="daterangepicker dropdown-menu">' +
101
103
  '<div class="calendar left">' +
102
- '<div class="daterangepicker_input">' +
103
- '<input class="input-mini" type="text" name="daterangepicker_start" value="" />' +
104
- '<i class="fa fa-calendar glyphicon glyphicon-calendar"></i>' +
105
- '<div class="calendar-time">' +
106
- '<div></div>' +
107
- '<i class="fa fa-clock-o glyphicon glyphicon-time"></i>' +
108
- '</div>' +
109
- '</div>' +
110
- '<div class="calendar-table"></div>' +
104
+ '<div class="daterangepicker_input">' +
105
+ '<input class="input-mini" type="text" name="daterangepicker_start" value="" />' +
106
+ '<i class="fa fa-calendar glyphicon glyphicon-calendar"></i>' +
107
+ '<div class="calendar-time">' +
108
+ '<div></div>' +
109
+ '<i class="fa fa-clock-o glyphicon glyphicon-time"></i>' +
110
+ '</div>' +
111
+ '</div>' +
112
+ '<div class="calendar-table"></div>' +
111
113
  '</div>' +
112
114
  '<div class="calendar right">' +
113
- '<div class="daterangepicker_input">' +
114
- '<input class="input-mini" type="text" name="daterangepicker_end" value="" />' +
115
- '<i class="fa fa-calendar glyphicon glyphicon-calendar"></i>' +
116
- '<div class="calendar-time">' +
117
- '<div></div>' +
118
- '<i class="fa fa-clock-o glyphicon glyphicon-time"></i>' +
119
- '</div>' +
120
- '</div>' +
121
- '<div class="calendar-table"></div>' +
115
+ '<div class="daterangepicker_input">' +
116
+ '<input class="input-mini" type="text" name="daterangepicker_end" value="" />' +
117
+ '<i class="fa fa-calendar glyphicon glyphicon-calendar"></i>' +
118
+ '<div class="calendar-time">' +
119
+ '<div></div>' +
120
+ '<i class="fa fa-clock-o glyphicon glyphicon-time"></i>' +
121
+ '</div>' +
122
+ '</div>' +
123
+ '<div class="calendar-table"></div>' +
122
124
  '</div>' +
123
125
  '<div class="ranges">' +
124
- '<div class="range_inputs">' +
125
- '<button class="applyBtn" disabled="disabled" type="button"></button> ' +
126
- '<button class="cancelBtn" type="button"></button>' +
127
- '</div>' +
126
+ '<div class="range_inputs">' +
127
+ '<button class="applyBtn" disabled="disabled" type="button"></button> ' +
128
+ '<button class="cancelBtn" type="button"></button>' +
129
+ '</div>' +
128
130
  '</div>' +
129
- '</div>';
131
+ '</div>';
130
132
 
131
133
  this.parentEl = (options.parentEl && $(options.parentEl).length) ? $(options.parentEl) : $(this.parentEl);
132
134
  this.container = $(options.template).appendTo(this.parentEl);
@@ -147,22 +149,22 @@
147
149
  this.locale.daysOfWeek = options.locale.daysOfWeek.slice();
148
150
 
149
151
  if (typeof options.locale.monthNames === 'object')
150
- this.locale.monthNames = options.locale.monthNames.slice();
152
+ this.locale.monthNames = options.locale.monthNames.slice();
151
153
 
152
154
  if (typeof options.locale.firstDay === 'number')
153
- this.locale.firstDay = options.locale.firstDay;
155
+ this.locale.firstDay = options.locale.firstDay;
154
156
 
155
157
  if (typeof options.locale.applyLabel === 'string')
156
- this.locale.applyLabel = options.locale.applyLabel;
158
+ this.locale.applyLabel = options.locale.applyLabel;
157
159
 
158
160
  if (typeof options.locale.cancelLabel === 'string')
159
- this.locale.cancelLabel = options.locale.cancelLabel;
161
+ this.locale.cancelLabel = options.locale.cancelLabel;
160
162
 
161
163
  if (typeof options.locale.weekLabel === 'string')
162
- this.locale.weekLabel = options.locale.weekLabel;
164
+ this.locale.weekLabel = options.locale.weekLabel;
163
165
 
164
166
  if (typeof options.locale.customRangeLabel === 'string')
165
- this.locale.customRangeLabel = options.locale.customRangeLabel;
167
+ this.locale.customRangeLabel = options.locale.customRangeLabel;
166
168
 
167
169
  }
168
170
 
@@ -216,6 +218,9 @@
216
218
  if (typeof options.showWeekNumbers === 'boolean')
217
219
  this.showWeekNumbers = options.showWeekNumbers;
218
220
 
221
+ if (typeof options.showISOWeekNumbers === 'boolean')
222
+ this.showISOWeekNumbers = options.showISOWeekNumbers;
223
+
219
224
  if (typeof options.buttonClasses === 'string')
220
225
  this.buttonClasses = options.buttonClasses;
221
226
 
@@ -255,6 +260,9 @@
255
260
  if (typeof options.isInvalidDate === 'function')
256
261
  this.isInvalidDate = options.isInvalidDate;
257
262
 
263
+ if (typeof options.alwaysShowCalendars === 'boolean')
264
+ this.alwaysShowCalendars = options.alwaysShowCalendars;
265
+
258
266
  // update day names order to firstDay
259
267
  if (this.locale.firstDay != 0) {
260
268
  var iterator = this.locale.firstDay;
@@ -365,7 +373,7 @@
365
373
  }
366
374
  }
367
375
 
368
- if (typeof options.ranges === 'undefined' && !this.singleDatePicker) {
376
+ if ((typeof options.ranges === 'undefined' && !this.singleDatePicker) || this.alwaysShowCalendars) {
369
377
  this.container.addClass('show-calendar');
370
378
  }
371
379
 
@@ -530,7 +538,7 @@
530
538
  (this.startDate.format('YYYY-MM') == this.leftCalendar.month.format('YYYY-MM') || this.startDate.format('YYYY-MM') == this.rightCalendar.month.format('YYYY-MM'))
531
539
  &&
532
540
  (this.endDate.format('YYYY-MM') == this.leftCalendar.month.format('YYYY-MM') || this.endDate.format('YYYY-MM') == this.rightCalendar.month.format('YYYY-MM'))
533
- ) {
541
+ ) {
534
542
  return;
535
543
  }
536
544
 
@@ -587,30 +595,7 @@
587
595
  this.container.find('.ranges li').removeClass('active');
588
596
  if (this.endDate == null) return;
589
597
 
590
- var customRange = true;
591
- var i = 0;
592
- for (var range in this.ranges) {
593
- if (this.timePicker) {
594
- if (this.startDate.isSame(this.ranges[range][0]) && this.endDate.isSame(this.ranges[range][1])) {
595
- customRange = false;
596
- this.chosenLabel = this.container.find('.ranges li:eq(' + i + ')').addClass('active').html();
597
- break;
598
- }
599
- } else {
600
- //ignore times when comparing dates if time picker is not enabled
601
- if (this.startDate.format('YYYY-MM-DD') == this.ranges[range][0].format('YYYY-MM-DD') && this.endDate.format('YYYY-MM-DD') == this.ranges[range][1].format('YYYY-MM-DD')) {
602
- customRange = false;
603
- this.chosenLabel = this.container.find('.ranges li:eq(' + i + ')').addClass('active').html();
604
- break;
605
- }
606
- }
607
- i++;
608
- }
609
- if (customRange) {
610
- this.chosenLabel = this.container.find('.ranges li:last').addClass('active').html();
611
- this.showCalendars();
612
- }
613
-
598
+ this.calculateChosenLabel();
614
599
  },
615
600
 
616
601
  renderCalendar: function(side) {
@@ -691,7 +676,7 @@
691
676
  html += '<tr>';
692
677
 
693
678
  // add empty cell for week number
694
- if (this.showWeekNumbers)
679
+ if (this.showWeekNumbers || this.showISOWeekNumbers)
695
680
  html += '<th></th>';
696
681
 
697
682
  if ((!minDate || minDate.isBefore(calendar.firstDay)) && (!this.linkedCalendars || side == 'left')) {
@@ -746,7 +731,7 @@
746
731
  html += '<tr>';
747
732
 
748
733
  // add week number label
749
- if (this.showWeekNumbers)
734
+ if (this.showWeekNumbers || this.showISOWeekNumbers)
750
735
  html += '<th class="week">' + this.locale.weekLabel + '</th>';
751
736
 
752
737
  $.each(this.locale.daysOfWeek, function(index, dayOfWeek) {
@@ -772,6 +757,8 @@
772
757
  // add week number
773
758
  if (this.showWeekNumbers)
774
759
  html += '<td class="week">' + calendar[row][0].week() + '</td>';
760
+ else if (this.showISOWeekNumbers)
761
+ html += '<td class="week">' + calendar[row][0].isoWeek() + '</td>';
775
762
 
776
763
  for (var col = 0; col < 7; col++) {
777
764
 
@@ -1043,7 +1030,7 @@
1043
1030
  this.container.css({
1044
1031
  top: containerTop,
1045
1032
  left: this.element.offset().left - parentOffset.left + this.element.outerWidth() / 2
1046
- - this.container.outerWidth() / 2,
1033
+ - this.container.outerWidth() / 2,
1047
1034
  right: 'auto'
1048
1035
  });
1049
1036
  if (this.container.offset().left < 0) {
@@ -1075,13 +1062,13 @@
1075
1062
 
1076
1063
  // Bind global datepicker mousedown for hiding and
1077
1064
  $(document)
1078
- .on('mousedown.daterangepicker', this._outsideClickProxy)
1079
- // also support mobile devices
1080
- .on('touchend.daterangepicker', this._outsideClickProxy)
1081
- // also explicitly play nice with Bootstrap dropdowns, which stopPropagation when clicking them
1082
- .on('click.daterangepicker', '[data-toggle=dropdown]', this._outsideClickProxy)
1083
- // and also close when focus changes to outside the picker (eg. tabbing between controls)
1084
- .on('focusin.daterangepicker', this._outsideClickProxy);
1065
+ .on('mousedown.daterangepicker', this._outsideClickProxy)
1066
+ // also support mobile devices
1067
+ .on('touchend.daterangepicker', this._outsideClickProxy)
1068
+ // also explicitly play nice with Bootstrap dropdowns, which stopPropagation when clicking them
1069
+ .on('click.daterangepicker', '[data-toggle=dropdown]', this._outsideClickProxy)
1070
+ // and also close when focus changes to outside the picker (eg. tabbing between controls)
1071
+ .on('focusin.daterangepicker', this._outsideClickProxy);
1085
1072
 
1086
1073
  // Reposition the picker if the window is resized while it's open
1087
1074
  $(window).on('resize.daterangepicker', $.proxy(function(e) { this.move(e); }, this));
@@ -1134,11 +1121,11 @@
1134
1121
  // itself then call this.hide()
1135
1122
  if (
1136
1123
  // ie modal dialog fix
1137
- e.type == "focusin" ||
1138
- target.closest(this.element).length ||
1139
- target.closest(this.container).length ||
1140
- target.closest('.calendar-table').length
1141
- ) return;
1124
+ e.type == "focusin" ||
1125
+ target.closest(this.element).length ||
1126
+ target.closest(this.container).length ||
1127
+ target.closest('.calendar-table').length
1128
+ ) return;
1142
1129
  this.hide();
1143
1130
  },
1144
1131
 
@@ -1185,7 +1172,8 @@
1185
1172
  this.endDate.endOf('day');
1186
1173
  }
1187
1174
 
1188
- this.hideCalendars();
1175
+ if (!this.alwaysShowCalendars)
1176
+ this.hideCalendars();
1189
1177
  this.clickApply();
1190
1178
  }
1191
1179
  },
@@ -1285,7 +1273,7 @@
1285
1273
  if (this.timePicker) {
1286
1274
  var hour = parseInt(this.container.find('.left .hourselect').val(), 10);
1287
1275
  if (!this.timePicker24Hour) {
1288
- var ampm = cal.find('.ampmselect').val();
1276
+ var ampm = this.container.find('.left .ampmselect').val();
1289
1277
  if (ampm === 'PM' && hour < 12)
1290
1278
  hour += 12;
1291
1279
  if (ampm === 'AM' && hour === 12)
@@ -1316,8 +1304,10 @@
1316
1304
  date = date.clone().hour(hour).minute(minute).second(second);
1317
1305
  }
1318
1306
  this.setEndDate(date.clone());
1319
- if (this.autoApply)
1320
- this.clickApply();
1307
+ if (this.autoApply) {
1308
+ this.calculateChosenLabel();
1309
+ this.clickApply();
1310
+ }
1321
1311
  }
1322
1312
 
1323
1313
  if (this.singleDatePicker) {
@@ -1330,6 +1320,32 @@
1330
1320
 
1331
1321
  },
1332
1322
 
1323
+ calculateChosenLabel: function() {
1324
+ var customRange = true;
1325
+ var i = 0;
1326
+ for (var range in this.ranges) {
1327
+ if (this.timePicker) {
1328
+ if (this.startDate.isSame(this.ranges[range][0]) && this.endDate.isSame(this.ranges[range][1])) {
1329
+ customRange = false;
1330
+ this.chosenLabel = this.container.find('.ranges li:eq(' + i + ')').addClass('active').html();
1331
+ break;
1332
+ }
1333
+ } else {
1334
+ //ignore times when comparing dates if time picker is not enabled
1335
+ if (this.startDate.format('YYYY-MM-DD') == this.ranges[range][0].format('YYYY-MM-DD') && this.endDate.format('YYYY-MM-DD') == this.ranges[range][1].format('YYYY-MM-DD')) {
1336
+ customRange = false;
1337
+ this.chosenLabel = this.container.find('.ranges li:eq(' + i + ')').addClass('active').html();
1338
+ break;
1339
+ }
1340
+ }
1341
+ i++;
1342
+ }
1343
+ if (customRange) {
1344
+ this.chosenLabel = this.container.find('.ranges li:last').addClass('active').html();
1345
+ this.showCalendars();
1346
+ }
1347
+ },
1348
+
1333
1349
  clickApply: function(e) {
1334
1350
  this.hide();
1335
1351
  this.element.trigger('apply.daterangepicker', this);
@@ -1,288 +1,231 @@
1
- /*!
2
- * Stylesheet for the Date Range Picker, for use with Bootstrap 2.x
3
- *
4
- * Copyright 2013 Dan Grossman ( http://www.dangrossman.info )
5
- * Licensed under the Apache License v2.0
6
- * http://www.apache.org/licenses/LICENSE-2.0
7
- *
8
- * Built for http://www.improvely.com
9
- */
10
-
11
- .daterangepicker.dropdown-menu {
12
- max-width: none;
13
- z-index: 3000;
14
- }
15
-
16
- .daterangepicker.opensleft .ranges, .daterangepicker.opensleft .calendar {
17
- float: left;
18
- margin: 4px;
19
- }
20
-
21
- .daterangepicker.opensright .ranges, .daterangepicker.opensright .calendar,
22
- .daterangepicker.openscenter .ranges, .daterangepicker.openscenter .calendar {
23
- float: right;
24
- margin: 4px;
25
- }
26
-
27
- .daterangepicker .ranges {
28
- width: 160px;
29
- text-align: left;
30
- }
31
-
32
- .daterangepicker .ranges .range_inputs>div {
33
- float: left;
34
- }
35
-
36
- .daterangepicker .ranges .range_inputs>div:nth-child(2) {
37
- padding-left: 11px;
38
- }
39
-
40
- .daterangepicker .calendar {
41
- display: none;
42
- max-width: 250px;
43
- }
44
- .daterangepicker.show-calendar .calendar {
45
- display: block;
46
- }
47
-
48
- .daterangepicker .calendar.single .calendar-date {
49
- border: none;
50
- }
51
-
52
- .daterangepicker .calendar th, .daterangepicker .calendar td {
53
- font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
54
- white-space: nowrap;
55
- text-align: center;
56
- }
57
-
58
- .daterangepicker .daterangepicker_start_input label,
59
- .daterangepicker .daterangepicker_end_input label {
60
- color: #333;
61
- font-size: 11px;
62
- margin-bottom: 2px;
63
- text-transform: uppercase;
64
- text-shadow: 1px 1px 0 #fff;
65
- }
66
-
67
- .daterangepicker .ranges input {
68
- font-size: 11px;
69
- }
70
-
71
- .daterangepicker .ranges ul {
72
- list-style: none;
73
- margin: 0;
74
- padding: 0;
75
- }
76
-
77
- .daterangepicker .ranges li {
78
- font-size: 13px;
79
- background: #f5f5f5;
80
- border: 1px solid #f5f5f5;
81
- color: #08c;
82
- padding: 3px 12px;
83
- margin-bottom: 8px;
84
- -webkit-border-radius: 5px;
85
- -moz-border-radius: 5px;
86
- border-radius: 5px;
87
- cursor: pointer;
88
- }
89
-
90
- .daterangepicker .ranges li.active, .daterangepicker .ranges li:hover {
91
- background: #08c;
92
- border: 1px solid #08c;
93
- color: #fff;
94
- }
95
-
96
- .daterangepicker .calendar-date {
97
- border: 1px solid #ddd;
98
- padding: 4px;
99
- border-radius: 4px;
100
- background: #fff;
101
- }
102
-
103
- .daterangepicker .calendar-time {
104
- text-align: center;
105
- margin: 8px auto 0 auto;
106
- line-height: 30px;
107
- }
108
-
109
1
  .daterangepicker {
110
2
  position: absolute;
3
+ color: inherit;
111
4
  background: #fff;
112
- top: 100px;
113
- left: 20px;
5
+ border-radius: 4px;
6
+ width: 278px;
114
7
  padding: 4px;
115
8
  margin-top: 1px;
116
- -webkit-border-radius: 4px;
117
- -moz-border-radius: 4px;
118
- border-radius: 4px;
119
- }
120
-
121
- .daterangepicker.opensleft:before {
122
- position: absolute;
123
- top: -7px;
124
- right: 9px;
125
- display: inline-block;
126
- border-right: 7px solid transparent;
127
- border-bottom: 7px solid #ccc;
128
- border-left: 7px solid transparent;
129
- border-bottom-color: rgba(0, 0, 0, 0.2);
130
- content: '';
131
- }
132
-
133
- .daterangepicker.opensleft:after {
134
- position: absolute;
135
- top: -6px;
136
- right: 10px;
137
- display: inline-block;
138
- border-right: 6px solid transparent;
139
- border-bottom: 6px solid #fff;
140
- border-left: 6px solid transparent;
141
- content: '';
142
- }
143
-
144
- .daterangepicker.openscenter:before {
145
- position: absolute;
146
- top: -7px;
147
- left: 0;
148
- right: 0;
149
- width: 0;
150
- margin-left: auto;
151
- margin-right: auto;
152
- display: inline-block;
153
- border-right: 7px solid transparent;
154
- border-bottom: 7px solid #ccc;
155
- border-left: 7px solid transparent;
156
- border-bottom-color: rgba(0, 0, 0, 0.2);
157
- content: '';
158
- }
159
-
160
- .daterangepicker.openscenter:after {
161
- position: absolute;
162
- top: -6px;
163
- left: 0;
164
- right: 0;
165
- width: 0;
166
- margin-left: auto;
167
- margin-right: auto;
168
- display: inline-block;
169
- border-right: 6px solid transparent;
170
- border-bottom: 6px solid #fff;
171
- border-left: 6px solid transparent;
172
- content: '';
173
- }
174
-
175
- .daterangepicker.opensright:before {
176
- position: absolute;
177
- top: -7px;
178
- left: 9px;
179
- display: inline-block;
180
- border-right: 7px solid transparent;
181
- border-bottom: 7px solid #ccc;
182
- border-left: 7px solid transparent;
183
- border-bottom-color: rgba(0, 0, 0, 0.2);
184
- content: '';
185
- }
186
-
187
- .daterangepicker.opensright:after {
188
- position: absolute;
189
- top: -6px;
190
- left: 10px;
191
- display: inline-block;
192
- border-right: 6px solid transparent;
193
- border-bottom: 6px solid #fff;
194
- border-left: 6px solid transparent;
195
- content: '';
196
- }
197
-
198
- .daterangepicker table {
199
- width: 100%;
200
- margin: 0;
201
- }
202
-
203
- .daterangepicker td, .daterangepicker th {
204
- text-align: center;
205
- width: 20px;
206
- height: 20px;
207
- -webkit-border-radius: 4px;
208
- -moz-border-radius: 4px;
209
- border-radius: 4px;
210
- cursor: pointer;
211
- white-space: nowrap;
212
- }
213
-
214
- .daterangepicker td.off {
215
- color: #999;
216
- }
217
-
218
- .daterangepicker td.disabled, .daterangepicker option.disabled {
219
- color: #999;
220
- }
221
-
222
- .daterangepicker td.available:hover, .daterangepicker th.available:hover {
223
- background: #eee;
224
- }
225
-
226
- .daterangepicker td.in-range {
227
- background: #ebf4f8;
228
- -webkit-border-radius: 0;
229
- -moz-border-radius: 0;
230
- border-radius: 0;
231
- }
232
-
233
- .daterangepicker td.active, .daterangepicker td.active:hover {
234
- background-color: #006dcc;
235
- background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
236
- background-image: -ms-linear-gradient(top, #0088cc, #0044cc);
237
- background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
238
- background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
239
- background-image: -o-linear-gradient(top, #0088cc, #0044cc);
240
- background-image: linear-gradient(top, #0088cc, #0044cc);
241
- background-repeat: repeat-x;
242
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
243
- border-color: #0044cc #0044cc #002a80;
244
- border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
245
- filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
246
- color: #fff;
247
- text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
248
- }
249
-
250
- .daterangepicker td.week, .daterangepicker th.week {
251
- font-size: 80%;
252
- color: #ccc;
253
- }
254
-
255
- .daterangepicker select.monthselect, .daterangepicker select.yearselect {
256
- font-size: 12px;
257
- padding: 1px;
258
- height: auto;
259
- margin: 0;
260
- cursor: default;
261
- }
262
-
263
- .daterangepicker select.monthselect {
264
- margin-right: 2%;
265
- width: 56%;
266
- }
267
-
268
- .daterangepicker select.yearselect {
269
- width: 40%;
270
- }
271
-
272
- .daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.secondselect, .daterangepicker select.ampmselect {
273
- width: 60px;
274
- margin-bottom: 0;
275
- }
276
-
277
- .daterangepicker_start_input {
278
- float: left;
279
- }
280
-
281
- .daterangepicker_end_input {
282
- float: left;
283
- padding-left: 11px
284
- }
285
-
286
- .daterangepicker th.month {
287
- width: auto;
288
- }
9
+ top: 100px;
10
+ left: 20px;
11
+ /* Calendars */ }
12
+ .daterangepicker:before, .daterangepicker:after {
13
+ position: absolute;
14
+ display: inline-block;
15
+ border-bottom-color: rgba(0, 0, 0, 0.2);
16
+ content: ''; }
17
+ .daterangepicker:before {
18
+ top: -7px;
19
+ border-right: 7px solid transparent;
20
+ border-left: 7px solid transparent;
21
+ border-bottom: 7px solid #ccc; }
22
+ .daterangepicker:after {
23
+ top: -6px;
24
+ border-right: 6px solid transparent;
25
+ border-bottom: 6px solid #fff;
26
+ border-left: 6px solid transparent; }
27
+ .daterangepicker.opensleft:before {
28
+ right: 9px; }
29
+ .daterangepicker.opensleft:after {
30
+ right: 10px; }
31
+ .daterangepicker.openscenter:before {
32
+ left: 0;
33
+ right: 0;
34
+ width: 0;
35
+ margin-left: auto;
36
+ margin-right: auto; }
37
+ .daterangepicker.openscenter:after {
38
+ left: 0;
39
+ right: 0;
40
+ width: 0;
41
+ margin-left: auto;
42
+ margin-right: auto; }
43
+ .daterangepicker.opensright:before {
44
+ left: 9px; }
45
+ .daterangepicker.opensright:after {
46
+ left: 10px; }
47
+ .daterangepicker.dropup {
48
+ margin-top: -5px; }
49
+ .daterangepicker.dropup:before {
50
+ top: initial;
51
+ bottom: -7px;
52
+ border-bottom: initial;
53
+ border-top: 7px solid #ccc; }
54
+ .daterangepicker.dropup:after {
55
+ top: initial;
56
+ bottom: -6px;
57
+ border-bottom: initial;
58
+ border-top: 6px solid #fff; }
59
+ .daterangepicker.dropdown-menu {
60
+ max-width: none;
61
+ z-index: 3001; }
62
+ .daterangepicker.single .ranges, .daterangepicker.single .calendar {
63
+ float: none; }
64
+ .daterangepicker.show-calendar .calendar {
65
+ display: block; }
66
+ .daterangepicker .calendar {
67
+ display: none;
68
+ max-width: 270px;
69
+ margin: 4px; }
70
+ .daterangepicker .calendar.single .calendar-table {
71
+ border: none; }
72
+ .daterangepicker .calendar th, .daterangepicker .calendar td {
73
+ white-space: nowrap;
74
+ text-align: center;
75
+ min-width: 32px; }
76
+ .daterangepicker .calendar-table {
77
+ border: 1px solid #fff;
78
+ padding: 4px;
79
+ border-radius: 4px;
80
+ background: #fff; }
81
+ .daterangepicker table {
82
+ width: 100%;
83
+ margin: 0; }
84
+ .daterangepicker td, .daterangepicker th {
85
+ text-align: center;
86
+ width: 20px;
87
+ height: 20px;
88
+ border-radius: 4px;
89
+ border: 1px solid transparent;
90
+ white-space: nowrap;
91
+ cursor: pointer; }
92
+ .daterangepicker td.available:hover, .daterangepicker th.available:hover {
93
+ background: #eee; }
94
+ .daterangepicker td.week, .daterangepicker th.week {
95
+ font-size: 80%;
96
+ color: #ccc; }
97
+ .daterangepicker td.off, .daterangepicker td.off.in-range, .daterangepicker td.off.start-date, .daterangepicker td.off.end-date {
98
+ background-color: #fff;
99
+ border-color: transparent;
100
+ color: #999; }
101
+ .daterangepicker td.in-range {
102
+ background-color: #ebf4f8;
103
+ border-color: transparent;
104
+ color: #000;
105
+ border-radius: 0; }
106
+ .daterangepicker td.start-date {
107
+ border-radius: 4px 0 0 4px; }
108
+ .daterangepicker td.end-date {
109
+ border-radius: 0 4px 4px 0; }
110
+ .daterangepicker td.start-date.end-date {
111
+ border-radius: 4px; }
112
+ .daterangepicker td.active, .daterangepicker td.active:hover {
113
+ background-color: #357ebd;
114
+ border-color: transparent;
115
+ color: #fff; }
116
+ .daterangepicker th.month {
117
+ width: auto; }
118
+ .daterangepicker td.disabled, .daterangepicker option.disabled {
119
+ color: #999;
120
+ cursor: not-allowed;
121
+ text-decoration: line-through; }
122
+ .daterangepicker select.monthselect, .daterangepicker select.yearselect {
123
+ font-size: 12px;
124
+ padding: 1px;
125
+ height: auto;
126
+ margin: 0;
127
+ cursor: default; }
128
+ .daterangepicker select.monthselect {
129
+ margin-right: 2%;
130
+ width: 56%; }
131
+ .daterangepicker select.yearselect {
132
+ width: 40%; }
133
+ .daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.secondselect, .daterangepicker select.ampmselect {
134
+ width: 50px;
135
+ margin-bottom: 0; }
136
+ .daterangepicker .input-mini {
137
+ border: 1px solid #ccc;
138
+ border-radius: 4px;
139
+ color: #555;
140
+ height: 30px;
141
+ line-height: 30px;
142
+ display: block;
143
+ vertical-align: middle;
144
+ margin: 0 0 5px 0;
145
+ padding: 0 6px 0 28px;
146
+ width: 100%; }
147
+ .daterangepicker .input-mini.active {
148
+ border: 1px solid #08c;
149
+ border-radius: 4px; }
150
+ .daterangepicker .daterangepicker_input {
151
+ position: relative; }
152
+ .daterangepicker .daterangepicker_input i {
153
+ position: absolute;
154
+ left: 8px;
155
+ top: 8px; }
156
+ .daterangepicker .calendar-time {
157
+ text-align: center;
158
+ margin: 5px auto;
159
+ line-height: 30px;
160
+ position: relative;
161
+ padding-left: 28px; }
162
+ .daterangepicker .calendar-time select.disabled {
163
+ color: #ccc;
164
+ cursor: not-allowed; }
165
+
166
+ .ranges {
167
+ font-size: 11px;
168
+ float: none;
169
+ margin: 4px;
170
+ text-align: left; }
171
+ .ranges ul {
172
+ list-style: none;
173
+ margin: 0 auto;
174
+ padding: 0;
175
+ width: 100%; }
176
+ .ranges li {
177
+ font-size: 13px;
178
+ background: #f5f5f5;
179
+ border: 1px solid #f5f5f5;
180
+ border-radius: 4px;
181
+ color: #08c;
182
+ padding: 3px 12px;
183
+ margin-bottom: 8px;
184
+ cursor: pointer; }
185
+ .ranges li:hover {
186
+ background: #08c;
187
+ border: 1px solid #08c;
188
+ color: #fff; }
189
+ .ranges li.active {
190
+ background: #08c;
191
+ border: 1px solid #08c;
192
+ color: #fff; }
193
+
194
+ /* Larger Screen Styling */
195
+ @media (min-width: 564px) {
196
+ .daterangepicker {
197
+ width: auto; }
198
+ .daterangepicker .ranges ul {
199
+ width: 160px; }
200
+ .daterangepicker.single .ranges ul {
201
+ width: 100%; }
202
+ .daterangepicker.single .calendar.left {
203
+ clear: none; }
204
+ .daterangepicker.single .ranges, .daterangepicker.single .calendar {
205
+ float: left; }
206
+ .daterangepicker .calendar.left {
207
+ clear: left;
208
+ margin-right: 0; }
209
+ .daterangepicker .calendar.left .calendar-table {
210
+ border-right: none;
211
+ border-top-right-radius: 0;
212
+ border-bottom-right-radius: 0; }
213
+ .daterangepicker .calendar.right {
214
+ margin-left: 0; }
215
+ .daterangepicker .calendar.right .calendar-table {
216
+ border-left: none;
217
+ border-top-left-radius: 0;
218
+ border-bottom-left-radius: 0; }
219
+ .daterangepicker .left .daterangepicker_input {
220
+ padding-right: 12px; }
221
+ .daterangepicker .calendar.left .calendar-table {
222
+ padding-right: 12px; }
223
+ .daterangepicker .ranges, .daterangepicker .calendar {
224
+ float: left; } }
225
+
226
+ @media (min-width: 730px) {
227
+ .daterangepicker .ranges {
228
+ width: auto;
229
+ float: left; }
230
+ .daterangepicker .calendar.left {
231
+ clear: none; } }