playground
/
ratchet
mirror of https://github.com/twbs/ratchet.git
1
0
Fork 0
Code Issues Releases Activity
Browse Source

Auto-generate Ratchicons data to be used by Jekyll. 

Backported from Bootstrap, adapted for Ratchet.
pull/453/head
XhmikosR 11 years ago
parent
10346ebd95
commit
3e3cb4d809
5 changed files with 130 additions and 122 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 6
      Gruntfile.js
  2. 44
      docs/_data/ratchicons.yml
  3. 86
      docs/components.html
  4. 34
      grunt/ratchicons-data-generator.js
  5. 82
      sass/ratchicons.scss

6
Gruntfile.js
Unescape View File

@ -15,6 +15,8 @@ module.exports = function(grunt) {
return string.replace(/[-\\^$*+?.()|[\]{}]/g, '\\$&'); return string.replace(/[-\\^$*+?.()|[\]{}]/g, '\\$&');
}; };
var generateRatchiconsData = require('./grunt/ratchicons-data-generator.js');
// Project configuration. // Project configuration.
grunt.initConfig({ grunt.initConfig({
pkg: grunt.file.readJSON('package.json'), pkg: grunt.file.readJSON('package.json'),
@ -255,12 +257,14 @@ module.exports = function(grunt) {
// Default task(s). // Default task(s).
grunt.registerTask('dist-css', ['sass', 'csscomb', 'cssmin']); grunt.registerTask('dist-css', ['sass', 'csscomb', 'cssmin']);
grunt.registerTask('dist-js', ['concat', 'uglify']); grunt.registerTask('dist-js', ['concat', 'uglify']);
grunt.registerTask('dist', ['clean', 'dist-css', 'dist-js', 'copy']); grunt.registerTask('dist', ['clean', 'dist-css', 'dist-js', 'copy', 'build-ratchicons-data']);
grunt.registerTask('validate-html', ['jekyll', 'validation']); grunt.registerTask('validate-html', ['jekyll', 'validation']);
grunt.registerTask('build', ['dist']); grunt.registerTask('build', ['dist']);
grunt.registerTask('default', ['dist']); grunt.registerTask('default', ['dist']);
grunt.registerTask('test', ['dist', 'jshint', 'jscs', 'validate-html']); grunt.registerTask('test', ['dist', 'jshint', 'jscs', 'validate-html']);
grunt.registerTask('build-ratchicons-data', generateRatchiconsData);
// Version numbering task. // Version numbering task.
// grunt change-version-number --oldver=A.B.C --newver=X.Y.Z // grunt change-version-number --oldver=A.B.C --newver=X.Y.Z
// This can be overzealous, so its changes should always be manually reviewed! // This can be overzealous, so its changes should always be manually reviewed!

44
docs/_data/ratchicons.yml
Unescape View File

@ -0,0 +1,44 @@
# This file is generated via Grunt task. **Do not edit directly.**
# See the 'build-ratchicons-data' task in Gruntfile.js.
- icon-and-up
- icon-back
- icon-bars
- icon-caret
- icon-check
- icon-close
- icon-code
- icon-compose
- icon-down-nav
- icon-down
- icon-download
- icon-edit
- icon-forward
- icon-gear
- icon-home
- icon-info
- icon-left-nav
- icon-left
- icon-list
- icon-more-vertical
- icon-more
- icon-pages
- icon-pause
- icon-person
- icon-play
- icon-plus
- icon-refresh
- icon-right-nav
- icon-right
- icon-search
- icon-share
- icon-sound
- icon-sound2
- icon-sound3
- icon-sound4
- icon-star-filled
- icon-star
- icon-stop
- icon-trash
- icon-up-nav
- icon-up

86
docs/components.html
Unescape View File

@ -1269,91 +1269,17 @@ window.addEventListener('push', myFunction);
<div class="component-example"> <div class="component-example">
<div class="content-padded"> <div class="content-padded">
<span class="icon icon-home"></span> {% for iconClassName in site.data.ratchicons %}
<span class="icon icon-person"></span> <span class="icon {{ iconClassName }}"></span>
<span class="icon icon-bars"></span> {% endfor %}
<span class="icon icon-caret"></span>
<span class="icon icon-check"></span>
<span class="icon icon-close"></span>
<span class="icon icon-code"></span>
<span class="icon icon-compose"></span>
<span class="icon icon-edit"></span>
<span class="icon icon-gear"></span>
<span class="icon icon-info"></span>
<span class="icon icon-list"></span>
<span class="icon icon-more"></span>
<span class="icon icon-more-vertical"></span>
<span class="icon icon-pages"></span>
<span class="icon icon-play"></span>
<span class="icon icon-pause"></span>
<span class="icon icon-stop"></span>
<span class="icon icon-back"></span>
<span class="icon icon-forward"></span>
<span class="icon icon-plus"></span>
<span class="icon icon-refresh"></span>
<span class="icon icon-search"></span>
<span class="icon icon-download"></span>
<span class="icon icon-share"></span>
<span class="icon icon-sound"></span>
<span class="icon icon-sound2"></span>
<span class="icon icon-sound3"></span>
<span class="icon icon-sound4"></span>
<span class="icon icon-star-filled"></span>
<span class="icon icon-star"></span>
<span class="icon icon-trash"></span>
<span class="icon icon-down-nav"></span>
<span class="icon icon-down"></span>
<span class="icon icon-left-nav"></span>
<span class="icon icon-left"></span>
<span class="icon icon-right-nav"></span>
<span class="icon icon-right"></span>
<span class="icon icon-up-nav"></span>
<span class="icon icon-up"></span>
</div> </div>
</div> </div>
{% highlight html %} {% highlight html %}
<div class="content-padded"> <div class="content-padded">
<span class="icon icon-home"></span> {% for iconClassName in site.data.ratchicons %}
<span class="icon icon-person"></span> <span class="icon {{ iconClassName }}"></span>
<span class="icon icon-bars"></span> {% endfor %}
<span class="icon icon-caret"></span>
<span class="icon icon-check"></span>
<span class="icon icon-close"></span>
<span class="icon icon-code"></span>
<span class="icon icon-compose"></span>
<span class="icon icon-edit"></span>
<span class="icon icon-gear"></span>
<span class="icon icon-info"></span>
<span class="icon icon-list"></span>
<span class="icon icon-more"></span>
<span class="icon icon-more-vertical"></span>
<span class="icon icon-pages"></span>
<span class="icon icon-play"></span>
<span class="icon icon-pause"></span>
<span class="icon icon-stop"></span>
<span class="icon icon-back"></span>
<span class="icon icon-forward"></span>
<span class="icon icon-plus"></span>
<span class="icon icon-refresh"></span>
<span class="icon icon-search"></span>
<span class="icon icon-download"></span>
<span class="icon icon-share"></span>
<span class="icon icon-sound"></span>
<span class="icon icon-sound2"></span>
<span class="icon icon-sound3"></span>
<span class="icon icon-sound4"></span>
<span class="icon icon-star-filled"></span>
<span class="icon icon-star"></span>
<span class="icon icon-trash"></span>
<span class="icon icon-down-nav"></span>
<span class="icon icon-down"></span>
<span class="icon icon-left-nav"></span>
<span class="icon icon-left"></span>
<span class="icon icon-right-nav"></span>
<span class="icon icon-right"></span>
<span class="icon icon-up-nav"></span>
<span class="icon icon-up"></span>
</div> </div>
{% endhighlight %} {% endhighlight %}

34
grunt/ratchicons-data-generator.js
Unescape View File

@ -0,0 +1,34 @@
/*!
* Ratchet Grunt task for Ratchicons data generation
* http://goratchet.com
* Original script from Bootstrap (http://getbootstrap.com).
* Bootstrap is copyright 2014 Twitter, Inc. and licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE).
*/
'use strict';
var fs = require('fs');
module.exports = function generateRatchiconsData() {
// Pass encoding, utf8, so `readFileSync` will return a string instead of a
// buffer
var ratchiconsFile = fs.readFileSync('sass/ratchicons.scss', 'utf8');
var ratchiconsLines = ratchiconsFile.split('\n');
// Use any line that starts with ".icon-" and capture the class name
var iconClassName = /^\.(icon-[^\s]+)/;
var ratchiconsData = '# This file is generated via Grunt task. **Do not edit directly.**\n' +
'# See the \'build-ratchicons-data\' task in Gruntfile.js.\n\n';
for (var i = 0, len = ratchiconsLines.length; i < len; i++) {
var match = ratchiconsLines[i].match(iconClassName);
if (match !== null) {
ratchiconsData += '- ' + match[1] + '\n';
}
}
// Create the `_data` directory if it doesn't already exist
if (!fs.existsSync('docs/_data')) {
fs.mkdirSync('docs/_data');
}
fs.writeFileSync('docs/_data/ratchicons.yml', ratchiconsData);
};

82
sass/ratchicons.scss
Unescape View File

@ -22,44 +22,44 @@
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
} }
.icon-and-up:before { content: '\e809'; } .icon-and-up { &:before { content: '\e809'; } }
.icon-back:before { content: '\e80a'; } .icon-back { &:before { content: '\e80a'; } }
.icon-bars:before { content: '\e80e'; } .icon-bars { &:before { content: '\e80e'; } }
.icon-caret:before { content: '\e80f'; } .icon-caret { &:before { content: '\e80f'; } }
.icon-check:before { content: '\e810'; } .icon-check { &:before { content: '\e810'; } }
.icon-close:before { content: '\e811'; } .icon-close { &:before { content: '\e811'; } }
.icon-code:before { content: '\e812'; } .icon-code { &:before { content: '\e812'; } }
.icon-compose:before { content: '\e813'; } .icon-compose { &:before { content: '\e813'; } }
.icon-down-nav:before { content: '\e814'; } .icon-down-nav { &:before { content: '\e814'; } }
.icon-down:before { content: '\e820'; } .icon-down { &:before { content: '\e820'; } }
.icon-download:before { content: '\e815'; } .icon-download { &:before { content: '\e815'; } }
.icon-edit:before { content: '\e829'; } .icon-edit { &:before { content: '\e829'; } }
.icon-forward:before { content: '\e82a'; } .icon-forward { &:before { content: '\e82a'; } }
.icon-gear:before { content: '\e821'; } .icon-gear { &:before { content: '\e821'; } }
.icon-home:before { content: '\e82b'; } .icon-home { &:before { content: '\e82b'; } }
.icon-info:before { content: '\e82c'; } .icon-info { &:before { content: '\e82c'; } }
.icon-left-nav:before { content: '\e82d'; } .icon-left-nav { &:before { content: '\e82d'; } }
.icon-left:before { content: '\e822'; } .icon-left { &:before { content: '\e822'; } }
.icon-list:before { content: '\e823'; } .icon-list { &:before { content: '\e823'; } }
.icon-more-vertical:before { content: '\e82e'; } .icon-more-vertical { &:before { content: '\e82e'; } }
.icon-more:before { content: '\e82f'; } .icon-more { &:before { content: '\e82f'; } }
.icon-pages:before { content: '\e824'; } .icon-pages { &:before { content: '\e824'; } }
.icon-pause:before { content: '\e830'; } .icon-pause { &:before { content: '\e830'; } }
.icon-person:before { content: '\e832'; } .icon-person { &:before { content: '\e832'; } }
.icon-play:before { content: '\e816'; } .icon-play { &:before { content: '\e816'; } }
.icon-plus:before { content: '\e817'; } .icon-plus { &:before { content: '\e817'; } }
.icon-refresh:before { content: '\e825'; } .icon-refresh { &:before { content: '\e825'; } }
.icon-right-nav:before { content: '\e818'; } .icon-right-nav { &:before { content: '\e818'; } }
.icon-right:before { content: '\e826'; } .icon-right { &:before { content: '\e826'; } }
.icon-search:before { content: '\e819'; } .icon-search { &:before { content: '\e819'; } }
.icon-share:before { content: '\e81a'; } .icon-share { &:before { content: '\e81a'; } }
.icon-sound:before { content: '\e827'; } .icon-sound { &:before { content: '\e827'; } }
.icon-sound2:before { content: '\e828'; } .icon-sound2 { &:before { content: '\e828'; } }
.icon-sound3:before { content: '\e80b'; } .icon-sound3 { &:before { content: '\e80b'; } }
.icon-sound4:before { content: '\e80c'; } .icon-sound4 { &:before { content: '\e80c'; } }
.icon-star-filled:before { content: '\e81b'; } .icon-star-filled { &:before { content: '\e81b'; } }
.icon-star:before { content: '\e81c'; } .icon-star { &:before { content: '\e81c'; } }
.icon-stop:before { content: '\e81d'; } .icon-stop { &:before { content: '\e81d'; } }
.icon-trash:before { content: '\e81e'; } .icon-trash { &:before { content: '\e81e'; } }
.icon-up-nav:before { content: '\e81f'; } .icon-up-nav { &:before { content: '\e81f'; } }
.icon-up:before { content: '\e80d'; } .icon-up { &:before { content: '\e80d'; } }

Write Preview
Loading…
Cancel
Save