- Install Node (with npm): https://nodejs.org/#download
- Install Sass: https://sass-lang.com/download.html
- Install Compass: https://compass-style.org/
- In your terminal, navigate to this project and type:
npm install .
- To generate the index.html page, type:
node .
- Important Note: To check if the urls are accurate (and for deploying to production), type:
node . checkurls
-
Each of the features requires its own markdown file under
posts
folder. It is easy to create using the shell script on the parent directory. Just type./new_feature.sh
and start entering details about the feature you want to add. -
All styles must be in the included
Sass
file rather than be updated in the generated CSS file. To compile them is to use Compass:
compass watch .
- No more JSON!
- Now we create each 'feature' with a markdown file that has YAML-like front matter. To make this easy, there is a
new_feature.sh
script that you can run to automate the creation of the file for each feature that needs to be written about. e.g. you would do./new_feature.sh
and then enter "text-shadow" if you want to create a markdown file for the text-shadow feature. There is atest.md
if you want to refer to (but really the shell script should do all the prompting for you to get set up). It even starts your default editor for you with the newly created file if you have the $EDITOR set up in your PATH. features.json
is retired, only to be used for reference at best (as if its any useful).- Plan is to port content directly from the modernizr wiki for now, link to caniuse data for more info.
- Likely, the templates might change in the meanwhile, I welcome your feedback on this setup. If you have better ideas, lemme know!
So new workflow for adding content here would be to run ./new_feature.sh
. But everything else remains the same.
Branch now uses node and compass!
A very basic idea of how this would look like. Lame filters and colors. See: https://dl.dropbox.com/u/952/gfs/index.html
"How do I use prefixes" would link to:
- Where all prefixes occur (css properties, values, DOM interfaces).
- How to use modernizr's prefix-returning function for use in your script.
- A reduced snippet from there?
- Graceful degradation guidelines
- Link to Tantek wiki page on why we have prefixes (and when we wont have them).
"Tools for Feature Support":
- Css3please.com
- modernizr polyfill wiki
- modernizr
- CSS Preprocessors?
- caniuse.com?
Started at: https://oksoclap.com/gfs