https://github.com/alexander-alvarez/ember-toggle-it
Simplifying toggling carets and other icons
https://github.com/alexander-alvarez/ember-toggle-it
css-transforms ember ember-addon toggle
Last synced: 11 months ago
JSON representation
Simplifying toggling carets and other icons
- Host: GitHub
- URL: https://github.com/alexander-alvarez/ember-toggle-it
- Owner: alexander-alvarez
- License: mit
- Created: 2017-04-06T07:07:31.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2017-04-06T07:15:06.000Z (almost 9 years ago)
- Last Synced: 2024-10-03T12:21:14.462Z (over 1 year ago)
- Topics: css-transforms, ember, ember-addon, toggle
- Language: JavaScript
- Size: 13.7 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# ember-toggle-it
Sick of having CSS classes sprinkled everywhere just to rotate an icon?
Wish it could be more declarative to implement?
`ember-toggle-it` will help you easily toggle it.
Doesn't interfere with your DOM. Currently works with centered elements.
## Installation
`ember install ember-toggle-it`
## Usage
**Supports Several Toggle Modes**
Up-Down
```hbs
{{#toggle-it toggleMode='^-v' value=value as |t| }}
Icon
{{/toggle-it}}
```
Left-Right (will be inverted in rtl mode)
```hbs
{{#toggle-it toggleMode='<->' value=value as |t| }}
Icon
{{/toggle-it}}
```
Left-Down (will be right-down in rtl-mode)
```hbs
{{#toggle-it toggleMode='<-v' value=value as |t| }}
Icon
{{/toggle-it}}
```
**Supports DDAU**
```hbs
{{#toggle-it value=value update=(action (mut value)) as |t|}}
Icon
{{/toggle-it}}
```
**Supports RTL**
```hbs
{{#toggle-it rtl=true value=value as |t| }}
Icon
{{/toggle-it}}
```
## Contributing
* `git clone alexander-alvarez/ember-toggle-it` this repository
* `cd ember-toggle-it`
* `npm install`
* `bower install`
## Running
* `ember serve`
* Visit your app at [http://localhost:4200](http://localhost:4200).
## Running Tests
* `npm test` (Runs `ember try:each` to test your addon against multiple Ember versions)
* `ember test`
* `ember test --server`
## Building
* `ember build`
For more information on using ember-cli, visit [https://ember-cli.com/](https://ember-cli.com/).