select2-bootstrap4-theme

Select2 v4 theme for Bootstrap4 (Compatible to boostrap 4.0.0+)

Live demo

👉 https://ttskch.github.io/select2-bootstrap4-theme/

Installation

CDN

<link rel="stylesheet" href="https://github.com/ttskch/select2-bootstrap4-theme/blob/master/path/to/select2.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ttskch/[email protected]/dist/select2-bootstrap4.min.css">

Manually

# npm
$ npm install @ttskch/select2-bootstrap4-theme

# yarn
$ yarn add @ttskch/select2-bootstrap4-theme

# composer
$ composer require ttskch/select2-bootstrap4-theme

<link rel="stylesheet" href="https://github.com/ttskch/select2-bootstrap4-theme/blob/master/path/to/select2.css">
<link rel="stylesheet" href="https://github.com/ttskch/select2-bootstrap4-theme/blob/master/path/to/select2-bootstrap4.min.css">

Usage

$('select').select2({
    theme: 'bootstrap4',
});

Getting involved

1. Fix src/_layout.scss, src/_single.scss or src/_multiple.scss
2. Do npm run build:both
3. Send me a Pull Request

You can use docs dir for your development.

1. Do npm run prepare (this creates symlink to dist/select2-bootstrap4.css onto docs)
2. Serve docs with your local web server (e.g. php -S localhost:8888 -t docs)
3. Do npm run watch
4. Tweak scss and browse demo page on your browser