Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/josemarluedke/tailwindcss-ember-power-select
Tailwind CSS plugin for Ember Power Select
https://github.com/josemarluedke/tailwindcss-ember-power-select
ember ember-power-select emberjs hacktoberfest tailwindcss
Last synced: 18 days ago
JSON representation
Tailwind CSS plugin for Ember Power Select
- Host: GitHub
- URL: https://github.com/josemarluedke/tailwindcss-ember-power-select
- Owner: josemarluedke
- License: mit
- Created: 2019-12-30T03:41:25.000Z (almost 5 years ago)
- Default Branch: master
- Last Pushed: 2022-12-11T18:47:32.000Z (almost 2 years ago)
- Last Synced: 2024-10-08T07:27:03.552Z (29 days ago)
- Topics: ember, ember-power-select, emberjs, hacktoberfest, tailwindcss
- Language: JavaScript
- Homepage: https://josemarluedke.github.io/tailwindcss-ember-power-select/
- Size: 2.44 MB
- Stars: 11
- Watchers: 3
- Forks: 3
- Open Issues: 22
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# Tailwind CSS for Ember Power Select 
[Ember Power Select](https://github.com/cibernox/ember-power-select) is a
powerful Ember addon for working with selects. This is a Tailwind CSS plugin
for styling both ``, `` and all the
options related to these.
## Documentation
The basic documentation can be found here:
[Read the documentation](https://josemarluedke.github.io/tailwindcss-ember-power-select/)
## Compatibility
* TailwindCSS v1.2 or above
* Node.js v10 or above
## Installation
1. Install the plugin:
```
yarn add -D tailwindcss-ember-power-select
```
2. Add it to your tailwind.config.js file:
```js
// tailwind.config.js
module.exports = {
// ...
plugins: [
require('tailwindcss-ember-power-select').plugin({
// Config options go here eg.
// borderColor: 'red'
})
]
}
```
3. Disable default Ember Power Select theme. Add to your `ember-cli-build.js` file:
```js
// ember-cli-build.js
// ...
module.exports = function(defaults) {
let app = new EmberApp(defaults, {
'ember-power-select': {
theme: false
},
// ...
});
return app.toTree();
};
```
4. Add autoprefixer to your PostCSS setup.
Some styles require [autoprefixer](https://github.com/postcss/autoprefixer) to be included in your application. You can
follow [this example](https://github.com/jeffjewiss/ember-cli-postcss#example) to setup
in an Ember app using `ember-cli-postcss`.
## Development
* `git clone https://github.com/josemarluedke/tailwindcss-ember-power-select.git` this repository
* `yarn install`
* `yarn link`
* `cd docs`
* `yarn install`
* `yarn link "tailwindcss-ember-power-select"`
* `ember serve`
Due to the nature of the setup of the docs app, changing the default options of the plugin will
not trigger a rebuild. However, if you open `tailwind.config.js` and just save
it, it will. Resulting in the styles to be updated.
### Linting
* `yarn lint:js`
#### Docs app
* `yarn lint:hbs`
* `yarn lint:js`
## License
This project is licensed under the [MIT License](LICENSE.md).