https://github.com/thejaredwilcurt/itcss-specificity-graph
A CSS Selector Specificity graph based on the Invert Triangle CSS Methodology
https://github.com/thejaredwilcurt/itcss-specificity-graph
css css-specificity-graph graph inverted-triangle itcss
Last synced: 11 months ago
JSON representation
A CSS Selector Specificity graph based on the Invert Triangle CSS Methodology
- Host: GitHub
- URL: https://github.com/thejaredwilcurt/itcss-specificity-graph
- Owner: TheJaredWilcurt
- License: mit
- Created: 2016-08-09T17:34:49.000Z (over 9 years ago)
- Default Branch: gh-pages
- Last Pushed: 2021-01-01T21:35:09.000Z (about 5 years ago)
- Last Synced: 2025-03-18T19:04:54.694Z (11 months ago)
- Topics: css, css-specificity-graph, graph, inverted-triangle, itcss
- Language: JavaScript
- Homepage: http://graphmycss.com
- Size: 61.5 KB
- Stars: 21
- Watchers: 2
- Forks: 1
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# ITCSS: CSS Specificity Graph
A CSS Selector Specificity graph based on the Inverted Triangle CSS Methodology
* **[View and use the graph online](http://TheJaredWilcurt.github.io/itcss-specificity-graph)** :arrow_left: (this is what you want)
* [Harry Roberts - Managing CSS Projects with ITCSS](https://www.youtube.com/watch?v=1OKZOV-iLj4&t=6m47s) (YouTube)
* [ITCSS Slides from the above talk](https://speakerdeck.com/dafed/managing-css-projects-with-itcss)
## This repo uses:
* [Alan Menhennet's SVG Line Graph](http://codepen.io/alanmenhennet/pen/WxrXww)
* [CSS Selectors to JS Array](http://github.com/TheJaredWilcurt/css-selectors-to-js-array)
* [SPECIFICITY](https://github.com/keeganstreet/specificity)
* [GitHub Corners](http://tholman.com/github-corners/)
* [jQuery](http://jquery.com)
* [Meyer Resets](http://github.com/TheJaredWilcurt/meyer-sass)
* [Normalize](https://necolas.github.io/normalize.css/)
## Contribute:
* The design could be improved
* Need to go and clean up the Sass folder, it should *really* be set up to use ITCSS (yeah, that needs fixed)
* We need lots of testing of the [CSS Selectors to JS Array](http://github.com/TheJaredWilcurt/css-selectors-to-js-array) library. To make sure all valid CSS can be parsed correctly.
* Add in a CSS Validator library. Prevent CSS parsing unless the file is valid. If the file is invalid, display a warning.
* Would be nice to have some simple ITCSS [explaination](http://imgur.com/a/6fS7V) on the page.
## License
MIT License (2016)