calendar based on bem-components
JavaScript CSS HTML
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
.enb
common.blocks
desktop.blocks
desktop.bundles/index
preview
touch-pad.bundles/index
touch-phone.blocks
touch-phone.bundles/index
touch.blocks
.bowerrc
.editorconfig
.eslintignore
.eslintrc.js
.gitignore
.travis.yml
README.md
README.ru.md
bower.json
package.json

README.md

Calendar for bem-components

calendar

On iOS and Android system calendar is used.

Usage example

Together with input:

{
    block: 'input',
    mods: {
        'has-calendar': true,
        size: 'm',
        theme: 'islands'
    },
    weekdays: ['mo', 'tu', 'we', 'th', 'fr', 'sa', 'su'],
    months: ['January', 'February', 'March',
        'April', 'May', 'June', 'July',
        'August', 'September', 'October',
        'November', 'December'],
    val: '16.02.2017'
}

As a separate block:

{
    block: 'calendar',
    js: {
        weekdays: ['mo', 'tu', 'we', 'th', 'fr', 'sa', 'su'],
        months: ['January', 'February', 'March',
            'April', 'May', 'June', 'July',
            'August', 'September', 'October',
            'November', 'December'],

    },
    mods: {
        theme: 'islands'
    }
}

You can set limits for dates using earlierLimit and laterLimit parameters.

{
    block: 'input',
    mods: {
        'has-calendar': true,
        size: 'm',
        theme: 'islands'
    },
    weekdays: ['mo', 'tu', 'we', 'th', 'fr', 'sa', 'su'],
    months: ['January', 'February', 'March',
            'April', 'May', 'June', 'July',
            'August', 'September', 'October',
            'November', 'December'],
    earlierLimit: '13.02.2017',
    laterLimit: '18.02.2017',
    val: '17.02.2017'
}

calendar

North-American date and calendar format can be enabled by using format:'north-american' modifier. Date format: mm/dd/yyyy

{
    block: 'input',
    mods: {
        'has-calendar': true,
        size: 'm',
        theme: 'islands',
        'calendar-format': 'north-american'
    },
    weekdays: ['su','mo', 'tu', 'we', 'th', 'fr', 'sa'],
    months: ['January', 'February', 'March',
            'April', 'May', 'June', 'July',
            'August', 'September', 'October',
            'November', 'December'],
    earlierLimit: '02.13.2017',
    laterLimit: '02.18.2017',
    val: '02.17.2017'
}

calendar