4 |
`);
7 |
8 | export default daysTemplate;
9 |
--------------------------------------------------------------------------------
/dist/js/locales/bg.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Bulgarian translation for bootstrap-datepicker
3 | * Apostol Apostolov ${createTagRepeat('span', 7, {class: 'dow block flex-1 leading-9 border-0 rounded-base cursor-default text-center text-body font-medium text-sm'})}
5 | ${createTagRepeat('span', 42 , {class: 'block flex-1 leading-9 border-0 rounded-base cursor-default text-center text-body font-medium text-sm h-6 leading-6 text-sm font-medium text-fg-disabled'})}
6 | 
9 |
10 |
11 | ## Getting started
12 |
13 | If you want to use the **Tailwind Datepicker** plugin using JavaScript you will need to include it into your project via NPM:
14 |
15 | ```bash
16 | npm i flowbite-datepicker --save
17 | ```
18 |
19 | After you've installed the NPM library, you will need to import the `Datepicker` module:
20 |
21 | ```javascript
22 | import Datepicker from 'flowbite-datepicker/Datepicker';
23 | ```
24 |
25 | Initialize a new element using the `Datepicker` constructor and optionally add custom options based on your needs:
26 |
27 | ```javascript
28 | const datepickerEl = document.getElementById('datepickerId');
29 | new Datepicker(datepickerEl, {
30 | // options
31 | });
32 | ```
33 |
34 | If you want to use the **Tailwind Date Range Picker** you have to import the `DateRangePicker` module:
35 |
36 | ```javascript
37 | import DateRangePicker from 'flowbite-datepicker/DateRangePicker';
38 | ```
39 |
40 | Then in the same fashion you can initalize a date range picker component by using the `DateRangePicker` constructor:
41 |
42 | ```javascript
43 | const dateRangePickerEl = document.getElementById('dateRangePickerId');
44 | new DateRangePicker(datepickerEl, {
45 | // options
46 | });
47 | ```
48 |
49 | ## Documentation
50 |
51 | Check out the official [Tailwind CSS Datepicker Documentation](https://flowbite.com/docs/plugins/datepicker/) page to learn how to get started by installing and then using this library in your project.
52 |
53 | ## Upgrade to pro
54 |
55 | There is also a pro version of FlowBite available featuring more components, an application UI layout, marketing UI pages, e-commerce pages and also Figma design files.
56 |
57 | Check it out here: [flowbite.com](https://flowbite.com)
58 |
59 | ## License
60 |
61 | The Tailwind CSS Datepicker is open-source under the MIT License. Find out more by [clicking here](https://flowbite.com/docs/getting-started/license/).
62 |
63 |
64 | ### Donations
65 |
66 | If you want to help support this project you can send us Bitcoin or Ethereum to the following addresses:
67 |
68 | - Bitcoin address: **bc1qmxvck7jnvwmv0z9xv4lcjsf05dja973v2pn7f5**
69 | - Ethereum address: **0xcb97e23EBc2262B2ba93bfC5d1e423e08420cAF6**
70 |
71 | The money will be used to pay for the hosting plan and other costs that are included to maintain this project.
72 |
--------------------------------------------------------------------------------
/sass/datepicker-bs4.scss:
--------------------------------------------------------------------------------
1 | $dp-background-color: $white !default;
2 | $dp-border-color: $border-color !default;
3 | $dp-border-radius: $border-radius !default;
4 | $dp-border-radius-small: $border-radius-sm !default;
5 | $dp-line-height-base: 1.5 !default;
6 | $dp-font-size-normal: $font-size-base !default;
7 | $dp-font-size-small: $font-size-sm !default;
8 | $dp-font-weight-semibold: 600 !default;
9 | $dp-font-weight-bold: $font-weight-bold !default;
10 | $dp-dropdown-offset: 4px !default;
11 | $dp-dropdown-shadow: $dropdown-box-shadow !default;
12 | $dp-dropdown-z: $zindex-dropdown !default;
13 |
14 | $dp-title-background-color: $light !default;
15 |
16 | $dp-cell-size-base: 2.25rem !default;
17 | $dp-cell-focus-background-color: darken($dropdown-link-hover-bg, 2.5) !default;
18 | $dp-cell-prevnext-color: color('gray') !default;
19 | $dp-cell-disabled-color: $dropdown-link-disabled-color !default;
20 | $dp-cell-selected-background-color: $dropdown-link-active-bg !default;
21 | $dp-cell-selected-color: $dropdown-link-active-color !default;
22 | $dp-cell-selected-font-weight: 600 !default;
23 | $dp-cell-today-background-color: $teal !default;
24 | $dp-cell-today-color: $white !default;
25 | $dp-cell-highlighted-background-color: $gray-100 !default;
26 | $dp-range-start-end-background-color: $secondary !default;
27 | $dp-range-start-end-color: $dp-cell-selected-color !default;
28 | $dp-range-background-color: $gray-200 !default;
29 | $dp-range-today-background-color: $dp-cell-today-background-color !default;
30 | $dp-week-color: $gray-300 !default;
31 |
32 | $dp-footer-background-color: $light !default;
33 |
34 | $dp-input-in-edit-border-color: darken($input-focus-border-color, 5%) !default;
35 | $dp-input-in-edit-focus-box-shadow-size: 0 0 0.25em 0.25em !default;
36 |
37 | @import 'mixins';
38 |
39 | @mixin dp-button {
40 | .btn {
41 | // use custom version of .btn-light
42 | $background: $light;
43 | $border: $light;
44 | $hover-background: darken($background, 7.5%);
45 | $hover-border: darken($border, 10%);
46 | $active-background: darken($background, 10%);
47 | $active-border: darken($border, 12.5%);
48 |
49 | border-color: $border;
50 | background-color: $dp-background-color;
51 |
52 | &:hover {
53 | border-color: $hover-border;
54 | background-color: $hover-background;
55 | color: color-yiq($hover-background);
56 | }
57 |
58 | &:focus {
59 | border-color: $hover-border;
60 | box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), 0.5);
61 | background-color: $hover-background;
62 | color: color-yiq($hover-background);
63 | }
64 |
65 | &:disabled {
66 | border-color: $border;
67 | background-color: $background;
68 | color: color-yiq($background);
69 | }
70 |
71 | &:not(:disabled):active {
72 | border-color: $active-border;
73 | background-color: $active-background;
74 | color: color-yiq($active-background);
75 |
76 | &:focus {
77 | box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), 0.5);
78 | }
79 | }
80 |
81 | .datepicker-header & {
82 | @include dp-header-button-common;
83 | }
84 |
85 | .datepicker-footer & {
86 | @include dp-footer-button-common;
87 | }
88 | }
89 | }
90 |
91 | @import 'datepicker';
92 |
--------------------------------------------------------------------------------
/sass/datepicker-bs5.scss:
--------------------------------------------------------------------------------
1 | $dp-background-color: $white !default;
2 | $dp-border-color: $border-color !default;
3 | $dp-border-radius: $border-radius !default;
4 | $dp-border-radius-small: $border-radius-sm !default;
5 | $dp-line-height-base: 1.5 !default;
6 | $dp-font-size-normal: $font-size-base !default;
7 | $dp-font-size-small: $font-size-sm !default;
8 | $dp-font-weight-semibold: 600 !default;
9 | $dp-font-weight-bold: $font-weight-bold !default;
10 | $dp-dropdown-offset: 4px !default;
11 | $dp-dropdown-shadow: $dropdown-box-shadow !default;
12 | $dp-dropdown-z: $zindex-dropdown !default;
13 |
14 | $dp-title-background-color: $light !default;
15 |
16 | $dp-cell-size-base: 2.25rem !default;
17 | $dp-cell-focus-background-color: darken($dropdown-link-hover-bg, 2.5) !default;
18 | $dp-cell-prevnext-color: color('gray') !default;
19 | $dp-cell-disabled-color: $dropdown-link-disabled-color !default;
20 | $dp-cell-selected-background-color: $dropdown-link-active-bg !default;
21 | $dp-cell-selected-color: $dropdown-link-active-color !default;
22 | $dp-cell-selected-font-weight: 600 !default;
23 | $dp-cell-today-background-color: $teal !default;
24 | $dp-cell-today-color: $white !default;
25 | $dp-cell-highlighted-background-color: $gray-100 !default;
26 | $dp-range-start-end-background-color: $secondary !default;
27 | $dp-range-start-end-color: $dp-cell-selected-color !default;
28 | $dp-range-background-color: $gray-200 !default;
29 | $dp-range-today-background-color: $dp-cell-today-background-color !default;
30 | $dp-week-color: $gray-300 !default;
31 |
32 | $dp-footer-background-color: $light !default;
33 |
34 | $dp-input-in-edit-border-color: darken($input-focus-border-color, 5%) !default;
35 | $dp-input-in-edit-focus-box-shadow-size: 0 0 0.25em 0.25em !default;
36 |
37 | @import 'mixins';
38 |
39 | @mixin dp-button {
40 | .btn {
41 | // use custom version of .btn-light
42 | $background: $light;
43 | $border: $light;
44 | $hover-background: darken($background, 7.5%);
45 | $hover-border: darken($border, 10%);
46 | $active-background: darken($background, 10%);
47 | $active-border: darken($border, 12.5%);
48 |
49 | border-color: $border;
50 | background-color: $dp-background-color;
51 |
52 | &:hover {
53 | border-color: $hover-border;
54 | background-color: $hover-background;
55 | color: color-contrast($hover-background);
56 | }
57 |
58 | &:focus {
59 | border-color: $hover-border;
60 | box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-contrast($background), $border, 15%), 0.5);
61 | background-color: $hover-background;
62 | color: color-contrast($hover-background);
63 | }
64 |
65 | &:disabled {
66 | border-color: $border;
67 | background-color: $background;
68 | color: color-contrast($background);
69 | }
70 |
71 | &:not(:disabled):active {
72 | border-color: $active-border;
73 | background-color: $active-background;
74 | color: color-contrast($active-background);
75 |
76 | &:focus {
77 | box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-contrast($background), $border, 15%), 0.5);
78 | }
79 | }
80 |
81 | .datepicker-header & {
82 | @include dp-header-button-common;
83 | }
84 |
85 | .datepicker-footer & {
86 | @include dp-footer-button-common;
87 | }
88 | }
89 | }
90 |
91 | @import 'datepicker';
92 |
--------------------------------------------------------------------------------
/test/_utils/date.js:
--------------------------------------------------------------------------------
1 | var dateUtils = (function (exports) {
2 | 'use strict';
3 |
4 | function stripTime(timeValue) {
5 | return new Date(timeValue).setHours(0, 0, 0, 0);
6 | }
7 |
8 | function today() {
9 | return new Date().setHours(0, 0, 0, 0);
10 | }
11 |
12 | // Get the time value of the start of given date or year, month and day
13 | function dateValue(...args) {
14 | switch (args.length) {
15 | case 0:
16 | return today();
17 | case 1:
18 | return stripTime(args[0]);
19 | }
20 |
21 | // use setFullYear() to keep 2-digit year from being mapped to 1900-1999
22 | const newDate = new Date(0);
23 | newDate.setFullYear(...args);
24 | return newDate.setHours(0, 0, 0, 0);
25 | }
26 |
27 | function addDays(date, amount) {
28 | const newDate = new Date(date);
29 | return newDate.setDate(newDate.getDate() + amount);
30 | }
31 |
32 | function addWeeks(date, amount) {
33 | return addDays(date, amount * 7);
34 | }
35 |
36 | function addMonths(date, amount) {
37 | // If the day of the date is not in the new month, the last day of the new
38 | // month will be returned. e.g. Jan 31 + 1 month → Feb 28 (not Mar 03)
39 | const newDate = new Date(date);
40 | const monthsToSet = newDate.getMonth() + amount;
41 | let expectedMonth = monthsToSet % 12;
42 | if (expectedMonth < 0) {
43 | expectedMonth += 12;
44 | }
45 |
46 | const time = newDate.setMonth(monthsToSet);
47 | return newDate.getMonth() !== expectedMonth ? newDate.setDate(0) : time;
48 | }
49 |
50 | function addYears(date, amount) {
51 | // If the date is Feb 29 and the new year is not a leap year, Feb 28 of the
52 | // new year will be returned.
53 | const newDate = new Date(date);
54 | const expectedMonth = newDate.getMonth();
55 | const time = newDate.setFullYear(newDate.getFullYear() + amount);
56 | return expectedMonth === 1 && newDate.getMonth() === 2 ? newDate.setDate(0) : time;
57 | }
58 |
59 | // Calculate the distance bettwen 2 days of the week
60 | function dayDiff(day, from) {
61 | return (day - from + 7) % 7;
62 | }
63 |
64 | // Get the date of the specified day of the week of given base date
65 | function dayOfTheWeekOf(baseDate, dayOfWeek, weekStart = 0) {
66 | const baseDay = new Date(baseDate).getDay();
67 | return addDays(baseDate, dayDiff(dayOfWeek, weekStart) - dayDiff(baseDay, weekStart));
68 | }
69 |
70 | // Get the ISO week of a date
71 | function getWeek(date) {
72 | // start of ISO week is Monday
73 | const thuOfTheWeek = dayOfTheWeekOf(date, 4, 1);
74 | // 1st week == the week where the 4th of January is in
75 | const firstThu = dayOfTheWeekOf(new Date(thuOfTheWeek).setMonth(0, 4), 4, 1);
76 | return Math.round((thuOfTheWeek - firstThu) / 604800000) + 1;
77 | }
78 |
79 | // Get the start year of the period of years that includes given date
80 | // years: length of the year period
81 | function startOfYearPeriod(date, years) {
82 | /* @see https://en.wikipedia.org/wiki/Year_zero#ISO_8601 */
83 | const year = new Date(date).getFullYear();
84 | return Math.floor(year / years) * years;
85 | }
86 |
87 | exports.addDays = addDays;
88 | exports.addMonths = addMonths;
89 | exports.addWeeks = addWeeks;
90 | exports.addYears = addYears;
91 | exports.dateValue = dateValue;
92 | exports.dayOfTheWeekOf = dayOfTheWeekOf;
93 | exports.getWeek = getWeek;
94 | exports.startOfYearPeriod = startOfYearPeriod;
95 | exports.stripTime = stripTime;
96 | exports.today = today;
97 |
98 | Object.defineProperty(exports, '__esModule', { value: true });
99 |
100 | return exports;
101 |
102 | })({});
103 |
--------------------------------------------------------------------------------
/dist/css/datepicker-foundation.min.css:
--------------------------------------------------------------------------------
1 | .datepicker{display:none}.datepicker.active{display:block}.datepicker-dropdown{position:absolute;top:0;left:0;z-index:10;padding-top:4px}.datepicker-dropdown.datepicker-orient-top{padding-top:0;padding-bottom:4px}.datepicker-picker{display:inline-block;border-radius:0;background-color:#fefefe}.datepicker-dropdown .datepicker-picker{box-shadow:0 0 0 1px #cacaca}.datepicker-picker span{display:block;flex:1;border:0;border-radius:0;cursor:default;text-align:center;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.datepicker-main{padding:2px}.datepicker-footer{box-shadow:inset 0 1px 1px rgba(10,10,10,.1);background-color:#e6e6e6}.datepicker-controls,.datepicker-grid,.datepicker-view,.datepicker-view .days-of-week{display:flex}.datepicker-grid{flex-wrap:wrap}.datepicker-view .days .datepicker-cell,.datepicker-view .dow{flex-basis:14.28571%}.datepicker-view.datepicker-grid .datepicker-cell{flex-basis:25%}.datepicker-cell,.datepicker-view .week{height:2.25rem;line-height:2.25rem}.datepicker-title{box-shadow:inset 0 -1px 1px rgba(10,10,10,.1);background-color:#e6e6e6;padding:.375rem .75rem;text-align:center;font-weight:700}.datepicker-header .datepicker-controls{padding:2px 2px 0}.datepicker-controls .button{margin:0;background-color:#fefefe;color:#0a0a0a}.datepicker-controls .button:focus,.datepicker-controls .button:hover{background-color:#d8d8d8}.datepicker-controls .button:focus[disabled],.datepicker-controls .button:hover[disabled]{opacity:.25;background-color:#fefefe;color:#0a0a0a}.datepicker-header .datepicker-controls .button{border-color:transparent;font-weight:700}.datepicker-footer .datepicker-controls .button{margin:calc(.375rem - 1px) .375rem;border-radius:0;width:100%;font-size:.75rem}.datepicker-controls .view-switch{flex:auto}.datepicker-controls .next-btn,.datepicker-controls .prev-btn{padding-right:.375rem;padding-left:.375rem;width:2.25rem}.datepicker-controls .next-btn.disabled,.datepicker-controls .prev-btn.disabled{visibility:hidden}.datepicker-view .dow{height:1.5rem;line-height:1.5rem;font-size:.875rem;font-weight:700}.datepicker-view .week{width:2.25rem;color:#8a8a8a;font-size:.75rem}@media (max-width:22.5rem){.datepicker-view .week{width:1.96875rem}}.datepicker-grid{width:15.75rem}@media (max-width:22.5rem){.calendar-weeks+.days .datepicker-grid{width:13.78125rem}}.datepicker-cell:not(.disabled):hover{background-color:#f8f8f8;cursor:pointer}.datepicker-cell.focused:not(.selected){background-color:#f1f1f1}.datepicker-cell.selected,.datepicker-cell.selected:hover{background-color:#1779ba;color:#fefefe;font-weight:semibold}.datepicker-cell.disabled{color:#e6e6e6}.datepicker-cell.next:not(.disabled),.datepicker-cell.prev:not(.disabled){color:#cacaca}.datepicker-cell.next.selected,.datepicker-cell.prev.selected{color:#e5e5e5}.datepicker-cell.highlighted:not(.selected):not(.range):not(.today){border-radius:0;background-color:#f7f7f7}.datepicker-cell.highlighted:not(.selected):not(.range):not(.today).focused,.datepicker-cell.highlighted:not(.selected):not(.range):not(.today):not(.disabled):hover{background-color:#f1f1f1}.datepicker-cell.today:not(.selected){background-color:#d7ecfa}.datepicker-cell.today:not(.selected):not(.disabled){color:#8a8a8a}.datepicker-cell.today.focused:not(.selected){background-color:#cbe7f9}.datepicker-cell.range-end:not(.selected),.datepicker-cell.range-start:not(.selected){background-color:#767676;color:#fefefe}.datepicker-cell.range-end.focused:not(.selected),.datepicker-cell.range-start.focused:not(.selected){background-color:#707070}.datepicker-cell.range-end,.datepicker-cell.range-start{border-radius:0 0 0 0}.datepicker-cell.range{border-radius:0;background-color:#e6e6e6}.datepicker-cell.range:not(.disabled):not(.focused):not(.today):hover{background-color:#e0e0e0}.datepicker-cell.range.disabled{color:#cdcdcd}.datepicker-cell.range.focused{background-color:#d9d9d9}.datepicker-cell.range.today{background-color:#b3dbf6}.datepicker-view.datepicker-grid .datepicker-cell{height:4.5rem;line-height:4.5rem}.datepicker-input.in-edit{border-color:#a4a4a4}.datepicker-input.in-edit:active,.datepicker-input.in-edit:focus{box-shadow:0 0 .25em .25em hsla(0,0%,64.3%,.2)}
--------------------------------------------------------------------------------
/dist/css/datepicker-bulma.min.css:
--------------------------------------------------------------------------------
1 | .datepicker{display:none}.datepicker.active{display:block}.datepicker-dropdown{position:absolute;top:0;left:0;z-index:20;padding-top:4px}.datepicker-dropdown.datepicker-orient-top{padding-top:0;padding-bottom:4px}.datepicker-picker{display:inline-block;border-radius:4px;background-color:#fff}.datepicker-dropdown .datepicker-picker{box-shadow:0 2px 3px rgba(10,10,10,.1),0 0 0 1px rgba(10,10,10,.1)}.datepicker-picker span{display:block;flex:1;border:0;border-radius:4px;cursor:default;text-align:center;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.datepicker-main{padding:2px}.datepicker-footer{box-shadow:inset 0 1px 1px rgba(10,10,10,.1);background-color:#f5f5f5}.datepicker-controls,.datepicker-grid,.datepicker-view,.datepicker-view .days-of-week{display:flex}.datepicker-grid{flex-wrap:wrap}.datepicker-view .days .datepicker-cell,.datepicker-view .dow{flex-basis:14.28571%}.datepicker-view.datepicker-grid .datepicker-cell{flex-basis:25%}.datepicker-cell,.datepicker-view .week{height:2.25rem;line-height:2.25rem}.datepicker-title{box-shadow:inset 0 -1px 1px rgba(10,10,10,.1);background-color:#f5f5f5;padding:.375rem .75rem;text-align:center;font-weight:700}.datepicker-header .datepicker-controls{padding:2px 2px 0}.datepicker-header .datepicker-controls .button{border-color:transparent;font-weight:700}.datepicker-header .datepicker-controls .button:hover{background-color:#f9f9f9}.datepicker-header .datepicker-controls .button:focus:not(:active){box-shadow:0 0 0 .125em hsla(0,0%,100%,.25)}.datepicker-header .datepicker-controls .button:active{background-color:#f2f2f2}.datepicker-header .datepicker-controls .button[disabled]{box-shadow:none}.datepicker-footer .datepicker-controls .button{margin:calc(.375rem - 1px) .375rem;border-radius:2px;width:100%;font-size:.75rem}.datepicker-controls .view-switch{flex:auto}.datepicker-controls .next-btn,.datepicker-controls .prev-btn{padding-right:.375rem;padding-left:.375rem;width:2.25rem}.datepicker-controls .next-btn.disabled,.datepicker-controls .prev-btn.disabled{visibility:hidden}.datepicker-view .dow{height:1.5rem;line-height:1.5rem;font-size:.875rem;font-weight:700}.datepicker-view .week{width:2.25rem;color:#b5b5b5;font-size:.75rem}@media (max-width:22.5rem){.datepicker-view .week{width:1.96875rem}}.datepicker-grid{width:15.75rem}@media (max-width:22.5rem){.calendar-weeks+.days .datepicker-grid{width:13.78125rem}}.datepicker-cell:not(.disabled):hover{background-color:#f9f9f9;cursor:pointer}.datepicker-cell.focused:not(.selected){background-color:#e8e8e8}.datepicker-cell.selected,.datepicker-cell.selected:hover{background-color:#3273dc;color:#fff;font-weight:600}.datepicker-cell.disabled{color:#dbdbdb}.datepicker-cell.next:not(.disabled),.datepicker-cell.prev:not(.disabled){color:#7a7a7a}.datepicker-cell.next.selected,.datepicker-cell.prev.selected{color:#e6e6e6}.datepicker-cell.highlighted:not(.selected):not(.range):not(.today){border-radius:0;background-color:#f5f5f5}.datepicker-cell.highlighted:not(.selected):not(.range):not(.today):not(.disabled):hover{background-color:#eee}.datepicker-cell.highlighted:not(.selected):not(.range):not(.today).focused{background-color:#e8e8e8}.datepicker-cell.today:not(.selected){background-color:#00d1b2}.datepicker-cell.today:not(.selected):not(.disabled){color:#fff}.datepicker-cell.today.focused:not(.selected){background-color:#00c4a7}.datepicker-cell.range-end:not(.selected),.datepicker-cell.range-start:not(.selected){background-color:#b5b5b5;color:#fff}.datepicker-cell.range-end.focused:not(.selected),.datepicker-cell.range-start.focused:not(.selected){background-color:#afafaf}.datepicker-cell.range-start{border-radius:4px 0 0 4px}.datepicker-cell.range-end{border-radius:0 4px 4px 0}.datepicker-cell.range{border-radius:0;background-color:#dbdbdb}.datepicker-cell.range:not(.disabled):not(.focused):not(.today):hover{background-color:#d5d5d5}.datepicker-cell.range.disabled{color:#c2c2c2}.datepicker-cell.range.focused{background-color:#cfcfcf}.datepicker-view.datepicker-grid .datepicker-cell{height:4.5rem;line-height:4.5rem}.datepicker-input.in-edit{border-color:#2366d1}.datepicker-input.in-edit:active,.datepicker-input.in-edit:focus{box-shadow:0 0 .25em .25em rgba(35,102,209,.2)}
--------------------------------------------------------------------------------
/test/test.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |