mirror of
https://github.com/tachyons-css/tachyons.git
synced 2026-02-06 14:06:52 +00:00
Remove old automated documentation.
This commit is contained in:
mrmrs
parent
efdd32391e
commit
0cb8f7c292
@ -8,7 +8,6 @@ var gulp = require('gulp'),
|
||||
prefix = require('gulp-autoprefixer'),
|
||||
//uncss = require('gulp-uncss'),
|
||||
minifyCSS = require('gulp-minify-css'),
|
||||
//sass = require('gulp-sass'),
|
||||
size = require('gulp-size'),
|
||||
rename = require('gulp-rename'),
|
||||
csslint = require('gulp-csslint'),
|
||||
@ -29,8 +28,6 @@ gulp.task('css', function() {
|
||||
.pipe(gulp.dest('./css'));
|
||||
});
|
||||
|
||||
gulp.task('generateDocs', require('./tasks/generateDocs'));
|
||||
|
||||
// Initialize browser-sync which starts a static server also allows for
|
||||
// browsers to reload on filesave
|
||||
gulp.task('browser-sync', function() {
|
||||
@ -49,7 +46,7 @@ gulp.task('bs-reload', function () {
|
||||
/*
|
||||
DEFAULT TASK
|
||||
|
||||
• Process sass then auto-prefixes and lints outputted css
|
||||
• Process css then auto-prefixes and lints outputted css
|
||||
• Starts a server on port 3000
|
||||
• Reloads browsers when you change html or sass files
|
||||
|
||||
|
||||
@ -1,250 +0,0 @@
|
||||
var fs = require('fs');
|
||||
var path = require('path');
|
||||
|
||||
var css = require('css');
|
||||
var sass = require('node-sass');
|
||||
var _ = require('lodash');
|
||||
|
||||
var paths = {
|
||||
sass: path.join(__dirname, '../sass/'),
|
||||
templates: path.join(__dirname, '../views/templates/'),
|
||||
masterTemplate: path.join(__dirname, '../views/templates/master.html'),
|
||||
docs: path.join(__dirname, '../docs/')
|
||||
};
|
||||
var scssDependencies = [ 'queries', 'colors' ];
|
||||
var docModules = [
|
||||
{
|
||||
name: 'styles',
|
||||
subModules: [{
|
||||
name: 'all styles',
|
||||
files: [
|
||||
'background_size',
|
||||
'base',
|
||||
'border_colors',
|
||||
'border_radius',
|
||||
'border_style',
|
||||
'border_widths',
|
||||
'borders',
|
||||
'box_sizing',
|
||||
'button-skins',
|
||||
'buttons',
|
||||
'clears',
|
||||
'code',
|
||||
'colors',
|
||||
'debug',
|
||||
'dimension_utilities',
|
||||
'display',
|
||||
'floats',
|
||||
'font_family',
|
||||
'font_style',
|
||||
'font_weight',
|
||||
'forms',
|
||||
'grid',
|
||||
'heights',
|
||||
'images',
|
||||
'letter_spacing',
|
||||
'line_height',
|
||||
'links',
|
||||
'lists',
|
||||
'max_widths',
|
||||
'normalize',
|
||||
'overflow',
|
||||
'position',
|
||||
'queries',
|
||||
'skins',
|
||||
'spacing',
|
||||
'states',
|
||||
'styles',
|
||||
'svg_fills',
|
||||
'svg_strokes',
|
||||
'text_align',
|
||||
'text_decoration',
|
||||
'text_transform',
|
||||
'type_scale',
|
||||
'utilities',
|
||||
'vertical_align',
|
||||
'visibility',
|
||||
'white_space',
|
||||
'widths',
|
||||
'word_spacing'
|
||||
],
|
||||
resetSelectors: 'b--black bg-near-white'
|
||||
}],
|
||||
template: 'styles'
|
||||
},
|
||||
{
|
||||
name: 'borders',
|
||||
subModules: [{
|
||||
name: 'borders',
|
||||
files: [ 'borders' ],
|
||||
resetSelectors: 'b--black bg-near-white'
|
||||
}, {
|
||||
name: 'border colors',
|
||||
files: [ 'border_colors' ],
|
||||
resetSelectors: 'ba bw1'
|
||||
}, {
|
||||
name: 'border radius',
|
||||
files: [ 'border_radius' ],
|
||||
resetSelectors: 'ba b--black'
|
||||
}, {
|
||||
name: 'border style',
|
||||
files: [ 'border_style' ],
|
||||
resetSelectors: 'ba b--black bg-near-white'
|
||||
}, {
|
||||
name: 'border widths',
|
||||
files: [ 'border_widths' ],
|
||||
resetSelectors: 'ba b--black'
|
||||
}],
|
||||
template: 'borders'
|
||||
},
|
||||
{
|
||||
name: 'type',
|
||||
subModules: [{
|
||||
name: 'type scale',
|
||||
files: [ 'type_scale'],
|
||||
resetSelectors: 'black b'
|
||||
}, {
|
||||
name: 'text transform',
|
||||
files: [ 'text_transform' ],
|
||||
resetSelectors: 'black'
|
||||
}, {
|
||||
name: 'text align',
|
||||
files: [ 'text_align' ],
|
||||
resetSelectors: 'black bg-yellow pas'
|
||||
}, {
|
||||
name: 'text decoration',
|
||||
files: [ 'text_decoration' ],
|
||||
resetSelectors: 'black'
|
||||
}, {
|
||||
name: 'leading',
|
||||
files: [ 'line_height' ],
|
||||
resetSelectors: 'black'
|
||||
}, {
|
||||
name: 'font weight',
|
||||
files: [ 'font_weight' ],
|
||||
resetSelectors: 'black f3'
|
||||
}, {
|
||||
name: 'font style',
|
||||
files: [ 'font_style' ],
|
||||
resetSelectors: 'black'
|
||||
}, {
|
||||
name: 'font family',
|
||||
files: [ 'font_family' ],
|
||||
resetSelectors: 'black'
|
||||
}],
|
||||
template: 'type'
|
||||
},
|
||||
{
|
||||
name: 'svg',
|
||||
subModules: [{
|
||||
name: 'svg fills',
|
||||
files: [ 'svg_fills'],
|
||||
resetSelectors: 'fill-black'
|
||||
},
|
||||
{
|
||||
name: 'svg strokes',
|
||||
files: [ 'svg_strokes'],
|
||||
resetSelectors: 'fill-white sw-4'
|
||||
}],
|
||||
template: 'svg'
|
||||
},
|
||||
{
|
||||
name: 'dimensions',
|
||||
subModules: [{
|
||||
name: 'widths',
|
||||
files: [ 'widths'],
|
||||
resetSelectors: 'bg-black white'
|
||||
},
|
||||
{
|
||||
name: 'max widths',
|
||||
files: [ 'max_widths'],
|
||||
resetSelectors: 'bg-black white'
|
||||
},
|
||||
{
|
||||
name: 'heights',
|
||||
files: [ 'heights'],
|
||||
resetSelectors: 'bg-black white'
|
||||
}
|
||||
],
|
||||
template: 'dimensions'
|
||||
},
|
||||
{
|
||||
name: 'skins',
|
||||
subModules: [{
|
||||
name: 'skins',
|
||||
files: [ 'skins' ],
|
||||
resetSelectors: 'bg-white'
|
||||
}],
|
||||
template: 'skins'
|
||||
}];
|
||||
|
||||
var masterTemplate = fs.readFileSync(paths.masterTemplate).toString();
|
||||
|
||||
function generateDocs(done) {
|
||||
_.forEach(docModules, function forEachDocModule(docModule) {
|
||||
var docModuleTemplate =
|
||||
fs.readFileSync(path.join(paths.templates, docModule.template + '.html'))
|
||||
.toString();
|
||||
var subModuleData = _.map(docModule.subModules, function toData(subModule) {
|
||||
var files = subModule.files;
|
||||
// Create a temporary scss file to be compiled into the css for this module.
|
||||
var scss = _.map(scssDependencies.concat(files), function createScss(file) {
|
||||
return '@import "' + file + '";';
|
||||
}).join('\n');
|
||||
// TODO: go async
|
||||
var cssText = sass.renderSync({
|
||||
data: scss,
|
||||
includePaths: [ paths.sass ]
|
||||
});
|
||||
|
||||
// Read the css ast, and for each selector in each rule, generate an example.
|
||||
var ast = css.parse(cssText);
|
||||
|
||||
var examples = _.chain(ast.stylesheet.rules)
|
||||
.filter(function isRule(declaration) {
|
||||
return declaration.type === 'rule';
|
||||
})
|
||||
// No need to filter out media queries, because they are one level down
|
||||
// in the syntax tree, and we only filter the top level.
|
||||
.map(function templatizeRule(rule) {
|
||||
var selectors = rule.selectors;
|
||||
var selector = _.chain(selectors)
|
||||
.map(function clearPeriod(selector) {
|
||||
return selector.slice(1);
|
||||
})
|
||||
.values()
|
||||
.join(' ');
|
||||
var selectorForDisplay = selectors.join(', ');
|
||||
var declaration = _.chain(rule.declarations)
|
||||
.map(function declarationToString(declaration) {
|
||||
return declaration.property + ': ' + declaration.value;
|
||||
})
|
||||
.value()
|
||||
.join('; ');
|
||||
var example = _.template(docModuleTemplate, {
|
||||
resetSelector: subModule.resetSelectors,
|
||||
selector: selector,
|
||||
selectorForDisplay: selectorForDisplay,
|
||||
declaration: declaration
|
||||
});
|
||||
return example;
|
||||
})
|
||||
.value();
|
||||
return {
|
||||
name: subModule.name,
|
||||
examples: examples
|
||||
};
|
||||
});
|
||||
var moduleTemplate = _.template(masterTemplate, {
|
||||
moduleName: docModule.name,
|
||||
subModules: subModuleData
|
||||
});
|
||||
// TODO: go async
|
||||
fs.writeFileSync(path.join(paths.docs, docModule.name, 'index.html'),
|
||||
moduleTemplate);
|
||||
});
|
||||
|
||||
return done();
|
||||
}
|
||||
|
||||
module.exports = generateDocs;
|
||||
@ -1,3 +0,0 @@
|
||||
<footer>
|
||||
Footer
|
||||
</footer>
|
||||
@ -1,3 +0,0 @@
|
||||
<head>
|
||||
|
||||
</head>
|
||||
@ -1,3 +0,0 @@
|
||||
<header>
|
||||
Test header
|
||||
</header>
|
||||
@ -1,8 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
@@include('./head.html')
|
||||
<body>
|
||||
@@include('./header.html')
|
||||
@@include('./footer.html')
|
||||
</body>
|
||||
</html>
|
||||
@ -1,5 +0,0 @@
|
||||
<div class="fl wi-100 mbs">
|
||||
<div class="pas <%= resetSelector %> <%= selector %>">
|
||||
<%= selectorForDisplay %> { <%= declaration %> }
|
||||
</div>
|
||||
</div>
|
||||
@ -1,5 +0,0 @@
|
||||
<div class="fl wi-100 mbs">
|
||||
<div class="pas <%= resetSelector %> <%= selector %>">
|
||||
<%= selectorForDisplay %> { <%= declaration %> }
|
||||
</div>
|
||||
</div>
|
||||
@ -1,7 +0,0 @@
|
||||
<div class="wi-100 mbs pvm">
|
||||
<div class="pvs <%= resetSelector %> <%= selector %>">
|
||||
</div>
|
||||
<code>
|
||||
<%= selectorForDisplay %> { <%= declaration %> }
|
||||
</code>
|
||||
</div>
|
||||
@ -1,56 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
|
||||
<title>
|
||||
<%= moduleName %> / Docs / TACHYONS
|
||||
</title>
|
||||
<meta name="author" content="@mrmrs">
|
||||
<meta name="description" content="CSS">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link href="http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700" rel="stylesheet">
|
||||
<link rel="stylesheet" href="/css/tachyons.css">
|
||||
</head>
|
||||
<body class="wi-100">
|
||||
<header class="bb b--light-gray pvm">
|
||||
<div class="center mw8 phm phl-ns">
|
||||
<h1 class="f3 book dib prm"><a class="link" href="/" title="home">Tachyons</a></h1>
|
||||
<h2 class="f4 book ttu orange dib"><%= moduleName %></h2>
|
||||
</div>
|
||||
</header>
|
||||
<main class="center mw8 phm phl-ns ptl pbxl">
|
||||
<p class="lh-copy"></p>
|
||||
|
||||
<% _.forEach(subModules, function (subModule) { %>
|
||||
<h2 class="f4 ttu book mbl mtx"><%= subModule.name %></h2>
|
||||
<article class="pam brs ba b--light-gray">
|
||||
<div class="cf wi-100">
|
||||
<% _.forEach(subModule.examples, function (example) { %>
|
||||
<%= example %>
|
||||
<% }); %>
|
||||
</div>
|
||||
</article>
|
||||
<% }); %>
|
||||
</main>
|
||||
<footer class="bg-white gray pvx pvxl-ns phm bt b--light-gray h-50 h-75-ns">
|
||||
<small class="f5 mw7 db center lh-copy">
|
||||
A tachyon /ˈtæki.ɒn/ or tachyonic particle is a hypothetical particle
|
||||
that always moves faster than light.
|
||||
<br class="dn db-ns">
|
||||
The word comes from the Greek:
|
||||
ταχύς or tachys, meaning "swift, quick, fast, rapid"
|
||||
</small>
|
||||
</footer>
|
||||
<script>
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
|
||||
|
||||
ga('create', 'UA-55773803-1', 'auto');
|
||||
ga('send', 'pageview');
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,5 +0,0 @@
|
||||
<div class="fl wi-100 mbs">
|
||||
<div class="pas <%= resetSelector %> <%= selector %>">
|
||||
<%= selectorForDisplay %> { <%= declaration %> }
|
||||
</div>
|
||||
</div>
|
||||
@ -1,6 +0,0 @@
|
||||
<div class="dt wi-100 pvm bb b--near-white">
|
||||
<div class="dtc">
|
||||
<%= selectorForDisplay %>
|
||||
</div>
|
||||
<div class="dtc"><%= declaration %></div>
|
||||
</div>
|
||||
@ -1,20 +0,0 @@
|
||||
<div class="dt">
|
||||
<div class="dtc v-mid"><code class="f5"><%= selectorForDisplay %> { <%= declaration %> }</code></div>
|
||||
<div class="dtc v-mid">
|
||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" height="64px" width="64px"
|
||||
viewBox="0 0 256 256" class="<%= resetSelector %> <%= selector %>" enable-background="new 0 0 256 256" xml:space="preserve">
|
||||
<path d="M96,112c0,8.837-7.164,16-16,16s-16-7.163-16-16s7.164-16,16-16S96,103.163,96,112z M176,96
|
||||
c-8.836,0-16,7.163-16,16s7.164,16,16,16s16-7.163,16-16S184.836,96,176,96z M224,4v108c0,26.4-21.6,48-48,48h-14.084
|
||||
c6.296,7.613,10.084,17.372,10.084,28v60c0,4.418-3.582,8-8,8s-8-3.582-8-8v-48c0-5.195-3.354-9.639-8-11.296V248
|
||||
c0,4.418-3.582,8-8,8s-8-3.582-8-8v-60h-8v60c0,4.418-3.582,8-8,8s-8-3.582-8-8v-59.296c-4.646,1.657-8,6.101-8,11.296v48
|
||||
c0,4.418-3.582,8-8,8s-8-3.582-8-8v-40.459c-0.001,0-0.002,0.001-0.002,0.001C78.936,210.281,72.412,212,64,212
|
||||
c-14.163,0-32.084-8.771-45.657-22.343C16.781,188.096,16,186.048,16,184c0-2.047,0.781-4.094,2.343-5.657
|
||||
C19.905,176.781,21.952,176,24,176c2.047,0,4.095,0.781,5.657,2.343C40.053,188.739,54.175,196,64,196
|
||||
c11.743,0,17.796-4.169,20.238-13.939c0.081-0.322,0.186-0.633,0.303-0.936c0-0.001,0-0.002,0-0.002
|
||||
c1.252-7.943,4.64-15.186,9.551-21.123H80c-26.4,0-48-21.6-48-48V4c0-1.538,0.881-2.939,2.267-3.605C34.818,0.13,35.411,0,36,0
|
||||
c0.892,0,1.776,0.298,2.5,0.877L77.402,32h101.196L217.5,0.877C218.225,0.298,219.109,0,220,0c0.59,0,1.182,0.13,1.732,0.395
|
||||
C223.119,1.061,224,2.462,224,4z M208,112c0-17.6-14.4-32-32-32H80c-17.6,0-32,14.4-32,32c0,17.6,14.4,32,32,32h96
|
||||
C193.6,144,208,129.6,208,112z"/>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,6 +0,0 @@
|
||||
<div class="fl wi-100 mbs">
|
||||
<div class="pas <%= resetSelector %> <%= selector %>">
|
||||
The quick brown fox
|
||||
</div>
|
||||
<code><%= selectorForDisplay %> { <%= declaration %> }</code>
|
||||
</div>
|
||||
@ -1,5 +0,0 @@
|
||||
<div class="fl wi-100 mbs">
|
||||
<div class="pas <%= resetSelector %> <%= selector %>">
|
||||
<%= selectorForDisplay %> { <%= declaration %> }
|
||||
</div>
|
||||
</div>
|
||||
Loading…
Reference in New Issue
Block a user