https://github.com/cottrellio/xy-components
Yet another Material Ember component lib, but this time written with CSS Modules!
https://github.com/cottrellio/xy-components
css-modules ember-addon ember-components extinsible material-design
Last synced: 6 months ago
JSON representation
Yet another Material Ember component lib, but this time written with CSS Modules!
- Host: GitHub
- URL: https://github.com/cottrellio/xy-components
- Owner: cottrellio
- License: mit
- Created: 2017-11-17T17:04:30.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2018-02-20T19:32:09.000Z (almost 8 years ago)
- Last Synced: 2025-03-13T06:13:50.985Z (11 months ago)
- Topics: css-modules, ember-addon, ember-components, extinsible, material-design
- Language: CSS
- Homepage: https://cottrellio.github.io/xy-components/
- Size: 1.82 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# xy-components
Inspired by Material Design (MD) component-library for Ember, but this time written with [Ember-CSS-Modules](https://github.com/salsify/ember-css-modules)!
I say inspired because while a lot of the core design/ functionality comes from MD, I have taken many liberties.
Check out the [Docs with live demos](https://cottrellio.github.io/xy-components/)!
## Why CSS Modules?
CSS Modules localizes your styles to your component (each component has it's own styles CSS file). This makes your styles a first-class citizen along side your `template.hbs` and `component.js`. This means you can easily assign styles to each component to extend or override the defaults.
Your component structure using CSS Modules:
```
/my-component
+component.js
+styles.css
+template.hbs
```
tldr; By moving your CSS into your component module, you can take control of the design while still having the heavy lifting done by the addon.
## Installation
* `git clone git@github.com:cottrellio/xy-components.git` this repository
* `cd xy-components`
* `npm 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/).