Seamlessly use emotion (CSS-in-JS) with Vue.js
Clone or download
Latest commit e0ec437 Apr 23, 2018
Permalink
Failed to load latest commit information.
example Make it work again Mar 25, 2018
src Should export `css` and `injectGlobal` (#1) Apr 23, 2018
.babelrc Make it work again Mar 25, 2018
.editorconfig init Aug 5, 2017
.gitattributes init Aug 5, 2017
.gitignore init Aug 5, 2017
LICENSE init Aug 5, 2017
README.md Make it work again Mar 25, 2018
circle.yml init Aug 5, 2017
package.json v0.4.2 Apr 23, 2018
poi.config.js Make it work again Mar 25, 2018
yarn.lock Make it work again Mar 25, 2018

README.md

vue-emotion

NPM version NPM downloads CircleCI donate

emotion is the Next Generation of CSS-in-JS.

Install

yarn add emotion vue-emotion

Table of Contents

Usage

Create your styled component:

import styled from 'vue-emotion'

const Button = styled('button')`
  font-size: 15px;
`

const PinkButton = styled(Button)`
  color: pink
`

new Vue({
  render() {
    return (
      <div>
        <Button>normal button</Button>
        <PinkButton>pink button</PinkButton>
      </div>
    )
  }
})

Refer to https://github.com/tkh44/emotion for more docs.

Contributing

  1. Fork it!
  2. Create your feature branch: git checkout -b my-new-feature
  3. Commit your changes: git commit -am 'Add some feature'
  4. Push to the branch: git push origin my-new-feature
  5. Submit a pull request :D

Author

vue-emotion © EGOIST, Released under the MIT License.
Authored and maintained by EGOIST with help from contributors (list).

github.com/egoist · GitHub @EGOIST · Twitter @_egoistlily