An attempt at creating an open standard for both CSS and JavaScript UI libraries.
JavaScript HTML CSS
Failed to load latest commit information.
demos Buttons : Modified title in header Apr 12, 2016
external/normalize.css Build: Add normalize.css and include in default build Apr 7, 2015
icons/svg-source Build: Added SVG placeholder icons Feb 10, 2015
performance Build: Add variable files to linting and update jscs Aug 18, 2015
scss Buttons: Removed underline on hover from anchor tags Jun 21, 2016
tasks Grunt: grunt-watch now detects js variable changes May 3, 2016
.csscomb.json Build: Add csscomb to cleanup sass output Mar 13, 2015
.csslintrc Buttons: Base Styling of Button Classes Mar 9, 2016
.editorconfig Build: Adding .editorconfig file Nov 26, 2014
.gitattributes Initial commit Nov 3, 2014
.gitignore Build: Modularize build and add jsass-vars Jul 22, 2015
.jscsrc Build: Add jscs for checking any js files for style Dec 9, 2014
.jshintrc Build: Update to use grunt-jsass, fixes node 5+, refine variable usage Apr 12, 2016
.travis.yml Build: Update to use grunt-jsass, fixes node 5+, refine variable usage Apr 12, 2016
AUTHORS.txt Build: Update authors Mar 16, 2015
CONTRIBUTING.md CONTRIBUTING: Update CONTRIBUTING.md to reflect new meeting time Oct 17, 2015
Gruntfile.js Build: Modularize build and add jsass-vars Jul 22, 2015
LICENSE.txt Build: Remove dates from copyright notice Jan 6, 2015
README.md Documentation: Add note about running Grunt tests to README.md Jun 21, 2016
package.json Build: Update to use grunt-jsass, fixes node 5+, refine variable usage Apr 12, 2016

README.md

Chassis is creating open standards designed for CSS libraries, JavaScript UI libraries, and web developers in general. This project will define standards for markup and class names for common widgets and patterns, as well as an implementation of those standards. Similar to how DOM libraries can build upon Sizzle, we hope UI libraries will build upon this project.

Goals

  • Broad Device Support: The number of devices being used around the world continues to grow. We aim to support a wide range of devices without sacrificing usability or aesthetics.
  • Performance: The styles applied to your web page have a significant impact on, for example, how quickly the page can be rendered and how smoothly the page scrolls. We aim to keep this impact as small as possible.
  • Modularity: Each component will be designed as separate modules, allowing customized builds of just the pieces you need.
  • Pushing Web Standards: We will work with the W3C and WHATWG to improve CSS standards based on our work and feedback from the community.
  • Collaboration: We value input and collaboration from the community. We don't want to just build yet another CSS library; we want to improve collaboration and interoperability across projects.

Project Collaboration and Interoperability

If you maintain a JavaScript library that has UI components, we'd love for you to join our efforts. We'd be happy to hear your feedback and work through updates of your project(s) to support Chassis. If you have the time and interest to help define the standards and improve on our implementation, that's even better! Check out the contribution guidelines for more information.

Getting started

Prerequisites

Node.js and npm should be installed, as well as grunt-cli.

Building

Once you've cloned Chassis to your machine, run these commands:

$ npm install
$ grunt build

Develop

To automate the build process during development, run the grunt watch task to compile SCSS upon file change.

$ grunt watch

Grunt Tests

To run the tests locally run:

$ grunt test

Make sure you run the tests before creating a pull request.

Performance testing

Setup

Running the tests

Once you have completed the setup run this:

$ grunt perf

DO NOT USE YOUR COMPUTER WHILE TESTS ARE RUNNING

Once the tests completed, view the results.

Viewing the test pages

Follow the steps above to build. Once that is complete run this:

$ grunt connect:dev

This will start a connect server that will run until you stop it (Ctrl+C). Then go to http://localhost:4200/framework/{framework name}/component/{component name}/count/{ # of components to render}/ and you can see the generated test page.