maluramichael
1/26/2015 - 4:27 PM

proj

proj

gistfile1.js
content_copyfile_download
/*/*****************************************************************************************/
{
  "name": "cof",
  "version": "0.0.0",
  "description": "",
  "main": "main.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "gulp": "^3.8.10",
    "gulp-coffee": "^2.2.0",
    "gulp-livereload": "^3.5.0",
    "gulp-minify-css": "^0.4.2",
    "gulp-sass": "^1.3.2",
    "gulp-uglify": "^1.1.0",
    "gulp-util": "^3.0.2",
    "gulp-watch": "^4.1.0"
  },
  "dependencies": {
    "express": "^4.11.1"
  }
}

/*/*****************************************************************************************/
express = require 'express'
app = express()
apiRouter = express.Router()

app.use express.static(process.cwd() + '/client/')
app.use '/api', apiRouter

app.listen(9000)
/*/*****************************************************************************************/
<html>
<head>
	<link rel="stylesheet" href="/css/style.css">
</head>
<body>
	<div class="navigation">
		<div class="item">1</div>
		<div class="item">2</div>
		<div class="item">3</div>
		<div class="item">4</div>
	</div>
</body>
</html>
/*/*****************************************************************************************/
@import 'reset';

$baseColor: #EFEFEF;

body {
    font-family: Helvetica;
    padding: 3em;
    color: black;
    font-weight: bold;
    background-color: $baseColor;
}
.divider {
    height: 1px;
}
.navigation {
	.item {
		float: left;
		text-align: center;
		border-top: 1px solid darken($baseColor, 10);
		border-bottom: 1px solid darken($baseColor, 10);
	}

	.item:not(first-child) {
		border-left: 1px solid darken($baseColor, 10);
		margin-left: -1px;
	}
	.item:last-child {
		border-right: 1px solid darken($baseColor, 30);
		margin-right: -1px;	
	}
    @for $i from 1 through 16 {
        .item:first-child:nth-last-child(#{$i}),
  		.item:first-child:nth-last-child(#{$i}) ~ .item {
            width: 100% / $i
        }
    }
}
/*/*****************************************************************************************/
var gulp = require('gulp'),
    coffee = require('gulp-coffee'),
    sass = require('gulp-sass'),
    minifyCSS = require('gulp-minify-css'),
    uglify = require('gulp-uglify'),
    livereload = require('gulp-livereload'),
    gutil = require('gulp-util');

var coffeeFiles = 'src/**/*.coffee',
    scssFiles = 'src/**/*.scss',
    htmlFiles = 'src/**/*.html';

function swallowError(error) {
    console.log(error.toString());
    this.emit('end');
}

function compileCoffee() {
    console.log('compile coffee');
    return gulp.src(coffeeFiles)
        .pipe(coffee({
            bare: false
        }).on('error', swallowError))
        .pipe(gulp.dest('build/'));
}

function compileHtml() {
    console.log('compile html');
    return gulp.src(htmlFiles)
        .pipe(gulp.dest('build/'));
}

function compileSass() {
    console.log('compile sass');
    return gulp.src(scssFiles)
        .pipe(sass().on('error', swallowError))
        .pipe(minifyCSS({
            keepBreaks: true
        }))
        .pipe(gulp.dest('./build/'));
}

gulp.task('coffee', compileCoffee);
gulp.task('sass', compileSass);
gulp.task('html', compileHtml);

gulp.task('watch', ['default'], function() {
    gulp.watch(scssFiles, ['sass']);
    gulp.watch(coffeeFiles, ['coffee']);
    gulp.watch(htmlFiles, ['html']);
    livereload.listen();
    gulp.watch(['build/**']).on('change', livereload.changed);
});

gulp.task('default', ['coffee', 'sass', 'html']);