Skip to content
{{style}} element modifier for ember.js
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
addon
app
config
tests
vendor
.editorconfig
.ember-cli
.eslintignore
.eslintrc.js
.gitignore
.npmignore
.template-lintrc.js
.travis.yml
.watchmanconfig
CONTRIBUTING.md
LICENSE.md
README.md
ember-cli-build.js
index.js
package.json
testem.js
yarn.lock

README.md

ember-style-modifier

Build Status

This addon provides a {{style}} element modifier to set element's style. This allows to set custom CSS of an element without requiring a Content Security Policy style-src-attr: "unsafe-inline".

Compatibility

It supports the same versions as ember-modifier-manager-polyfill does.

Installation

ember install ember-style-modifier

Usage

It expects CSS declarations as named arguments or as a hash as positional argument. Property names are supported in dasherized as well as in camelCase spelling. Value must be a string or undefined. You may set a priority by adding an "!important" suffix.

<p
  {{style
    border="1px"
    padding="1em !important"
  }}
>
</p>

<p
  {{style
    (hash border="1px" padding="1em !important")
  }}
>
</p>

You may pass multiple hashes as positional arguments and combine hashes with named arguments. If multiple hashes are passed and contain CSS declarations for the same property, last one wins. If hashes and named arguments declare same property, named argument wins.

Adding styles to pseudo-elements is not supported.

Contributing

See the Contributing guide for details.

License

This project is licensed under the MIT License.

You can’t perform that action at this time.