From ebf798656e18a2e7268c1865786b86653ebb2f20 Mon Sep 17 00:00:00 2001 From: Shannon Moeller Date: Sun, 5 Jul 2015 14:19:01 -0400 Subject: [PATCH] Tweaking, cleaning, configging. --- .config/togafile.js | 20 ++++++++++++ .editorconfig | 4 +++ .eslintrc | 10 +++--- .gitignore | 5 +-- gulpfile.js | 59 ++++++++++++++---------------------- package.json | 42 ++++++++++++++++--------- src/assets/css/base/vars.css | 52 ++++++++++++++++++++++++++++++- 7 files changed, 131 insertions(+), 61 deletions(-) create mode 100644 .config/togafile.js diff --git a/.config/togafile.js b/.config/togafile.js new file mode 100644 index 0000000..0d0ffd9 --- /dev/null +++ b/.config/togafile.js @@ -0,0 +1,20 @@ +'use strict'; + +var toga = require('toga'), + css = require('toga-css'), + md = require('toga-markdown'), + sample = require('toga-sample'), + pura = require('toga-pura'), + + config = { + src: './src/assets/**/*.css', + dest: './dist/docs' + }; + +toga + .src(config.src) + .pipe(css.parser()) + .pipe(md.formatter()) + .pipe(sample.formatter()) + .pipe(pura.compiler()) + .pipe(toga.dest(config.dest)); diff --git a/.editorconfig b/.editorconfig index f1a02f1..c09a3bd 100644 --- a/.editorconfig +++ b/.editorconfig @@ -14,3 +14,7 @@ indent_style = space [*.md] indent_style = space + +[.*rc] +indent_size = 2 +indent_style = space diff --git a/.eslintrc b/.eslintrc index 23a9a65..3bdd0ac 100644 --- a/.eslintrc +++ b/.eslintrc @@ -1,4 +1,6 @@ { + "parser": "babel-eslint", + "env": { "amd": false, "browser": false, @@ -40,7 +42,7 @@ "rules": { // Possible Errors "comma-dangle": [2, "never"], // disallow or enforce trailing commas - "no-cond-assign": "except-parens", // disallow assignment in conditional expressions + "no-cond-assign": [2, "except-parens"], // disallow assignment in conditional expressions "no-console": 0, // disallow use of console (off by default in the node environment) "no-constant-condition": 2, // disallow use of constant expressions in conditions "no-control-regex": 2, // disallow control characters in regular expressions @@ -131,7 +133,7 @@ "yoda": 0, // require or disallow Yoda conditions // Strict mode - "strict": "global", // controls location of Use Strict Directives + "strict": [1, "global"], // controls location of Use Strict Directives // Variables "no-catch-shadow": 2, // disallow the catch clause parameter name being the same as a variable in the outer scope (off by default in the node environment) @@ -153,7 +155,7 @@ "no-mixed-requires": 0, // disallow mixing regular variable and require declarations (off by default) (on by default in the node environment) "no-new-require": 2, // disallow use of new operator with the require function (off by default) (on by default in the node environment) "no-path-concat": 2, // disallow string concatenation with __dirname and __filename (off by default) (on by default in the node environment) - "no-process-exit": 2, // disallow process.exit() (on by default in the node environment) + "no-process-exit": 0, // disallow process.exit() (on by default in the node environment) "no-restricted-modules": 0, // restrict usage of specified node modules (off by default) "no-sync": 0, // disallow use of synchronous methods (off by default) @@ -217,7 +219,7 @@ }], "space-in-brackets": 0, /* need v1.0 */ // require or disallow spaces inside brackets (off by default) "space-in-parens": [2, "never"], // require or disallow spaces inside parentheses (off by default) - "space-infix-ops": [2, "always"], // require spaces around operators + "space-infix-ops": 2, // require spaces around operators "space-return-throw-case": 2, // require a space after return, throw, and case "space-unary-ops": [1, { // Require or disallow spaces before/after unary operators (words on by default, nonwords off by default) "words": true, diff --git a/.gitignore b/.gitignore index 1d07cbe..917d78a 100644 --- a/.gitignore +++ b/.gitignore @@ -1,12 +1,9 @@ - coverage/ -docs/ +dist/ node_modules/ test/actual/ -web/ *.log .*.swp .DS_Store .publish - diff --git a/gulpfile.js b/gulpfile.js index 1ea0dc2..8ebcfc0 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -1,69 +1,54 @@ 'use strict'; var gulp = require('gulp'), - base = { base: './src/' }, - config = { isWatching: false }; + config = { + src: './src', + dest: './dist', + isWatching: false + }, + base = { + base: config.src + }; gulp.task('default', ['html', 'css', 'copy']); -gulp.task('deploy', ['default'], function () { - var deploy = require('gulp-gh-pages'); - - return gulp - .src('./web/**/*') - .pipe(deploy({ - branch: 'master' - })); -}); - gulp.task('html', function () { var fm = require('gulp-front-matter'), hb = require('gulp-hb'); return gulp - .src('./src/*.html', base) + .src(config.src + '/*.html', base) .pipe(fm({ property: 'meta' })) .pipe(hb()) - .pipe(gulp.dest('./web/')); + .pipe(gulp.dest(config.dest)); }); gulp.task('css', function () { var myth = require('gulp-myth'); return gulp - .src('./src/assets/css/*.css', base) + .src(config.src + '/assets/css/*.css', base) .pipe(myth({ browsers: ['last 2 versions'], compress: true, - source: './src/assets/css/', + source: config.src + '/assets/css/', sourcemap: config.isWatching })) - .pipe(gulp.dest('./web/')); + .pipe(gulp.dest(config.dest)); }); gulp.task('copy', function () { return gulp - .src('./src/{CNAME,LICENSE,README.md,assets/img/**}', base) - .pipe(gulp.dest('./web/')); + .src(config.src + '/{CNAME,LICENSE,README.md,assets/img/**}', base) + .pipe(gulp.dest(config.dest)); }); -gulp.task('watch', function () { - var watch = require('gulp-watch'), - lr = require('gulp-livereload'); - - config.isWatching = true; - - watch('./src/**/*.html', function () { - gulp.start('html'); - }); - - watch('./src/**/*.css', function () { - gulp.start('css'); - }); - - watch('./src/assets/images/**/*.*', function () { - gulp.start('copy'); - }); +gulp.task('deploy', ['default'], function () { + var deploy = require('gulp-gh-pages'); - watch('./web/**/*.*').pipe(lr()); + return gulp + .src(config.dest + '/**/*') + .pipe(deploy({ + branch: 'master' + })); }); diff --git a/package.json b/package.json index 4223136..13867d4 100644 --- a/package.json +++ b/package.json @@ -3,34 +3,46 @@ "version": "0.0.1", "private": true, "homepage": "https://togajs.com", + "bugs": "https://github.com/togajs/togajs.github.io/issues", "license": "MIT", "author": "Shannon Moeller (http://shannonmoeller.com)", + "repository": { + "type": "git", + "url": "https://github.com/togajs/togajs.github.io" + }, "dependencies": {}, "devDependencies": { - "gulp": "^3.8.11", - "gulp-autoprefixer": "^2.2.0", + "babel-istanbul": "^0.2.9", + "gulp": "^3.9.0", + "gulp-autoprefixer": "^2.3.1", "gulp-build": "^0.5.3", - "gulp-front-matter": "^1.2.2", - "gulp-gh-pages": "^0.5.1", - "gulp-hb": "^2.4.3", + "gulp-front-matter": "^1.2.3", + "gulp-gh-pages": "^0.5.2", + "gulp-hb": "^2.6.1", "gulp-html-prettify": "^0.0.1", "gulp-if": "^1.2.5", "gulp-jscs": "^1.6.0", - "gulp-jshint": "^1.10.0", + "gulp-jshint": "^1.11.2", "gulp-livereload": "^3.8.0", - "gulp-minify-css": "^1.1.0", - "gulp-myth": "^1.0.2", - "gulp-plumber": "^1.0.0", + "gulp-minify-css": "^1.2.0", + "gulp-myth": "^1.0.3", + "gulp-plumber": "^1.0.1", "gulp-rework": "^1.0.3", "gulp-sourcemaps": "^1.5.2", - "gulp-util": "^3.0.4", + "gulp-util": "^3.0.6", "gulp-watch": "^4.2.4", "handlebars": "^3.0.3", - "handlebars-layouts": "^2.0.2", - "jshint-stylish": "^1.0.1", - "rework-plugin-inline": "^1.0.1" + "handlebars-layouts": "^3.1.0", + "jshint-stylish": "^2.0.1", + "rework-plugin-inline": "^1.0.1", + "toga": "^0.5.1", + "toga-css": "^0.1.3", + "toga-markdown": "^0.4.1", + "toga-pura": "^0.1.2", + "toga-sample": "0.1.0-alpha" }, - "engines": { - "node": ">= 0.10" + "scripts": { + "all": "npm run build", + "build": "gulp" } } diff --git a/src/assets/css/base/vars.css b/src/assets/css/base/vars.css index 4e472de..598a3e0 100644 --- a/src/assets/css/base/vars.css +++ b/src/assets/css/base/vars.css @@ -1,10 +1,60 @@ +/** + * # Variables + * + * Site variables. + * + * @name variables + * @parent base + */ + +/** + * ## Colors + */ + +/** + * Colors to use. + * + * @sample {colors.html|hidden} colors + *
Background
+ *
Foreground
+ *
Primary
+ *
Primary Dark
+ *
Accent
+ * + * @sample {colors.css|hidden} colors + * .swatch { height: 200px; width: 200%; } + * .swatch_background { background-color: var(--color-background); } + * .swatch_foreground { background-color: var(--color-foreground); } + * .swatch_primary { background-color: var(--color-primary); } + * .swatch_primaryDark { background-color: var(--color-primaryDark); } + * .swatch_accent { background-color: var(--color-accent); } + */ :root { --color-background: hsl(0, 0%, 100%); --color-foreground: hsl(0, 0%, 20%); --color-primary: hsla(110, 60%, 70%, 0.8); - --color-primary-dark: hsla(110, 60%, 50%, 0.8); + --color-primaryDark: hsla(110, 60%, 50%, 0.8); --color-accent: hsla(346, 70%, 60%, 0.8); +} +/** + * ## Fonts + */ + +/** + * Fonts to use. + * + * @sample {fonts.html} fonts + *
Josefin Slab 700
+ *
Josefin Slab 300
+ *
Lato 300
+ * + * @sample {fonts.css} fonts + * .swatch_display { font: var(--font-display-weight) 1em/1 var(--font-display); } + * .swatch_header { font: var(--font-header-weight) 1em/1 var(--font-header); } + * .swatch_text { font: var(--font-text-weight) 1em/1 var(--font-text); } + */ +:root { --font-display: 'Josefin Slab', arial, sans-serif; --font-display-weight: 700; --font-header: 'Josefin Sans', arial, sans-serif;