Front-end on steroids
-
Upload
timble -
Category
Technology
-
view
547 -
download
0
Transcript of Front-end on steroids
$beta: 580px; $charlie: 740px;
.sidebar { @include breakpoint($beta) { @include span(4 of 12); }
@include breakpoint($charlie) { @include span(3 of 12); } }
.content { @include breakpoint($beta) { @include span(8 of 12); }
@include breakpoint($charlie) { @include span(9 of 12); } }
@media screen and (min-width: 580px) { .sidebar { width: 32.20339%; float: left; margin-right: 1.69492%; } }
@media screen and (min-width: 740px) { .content { width: 74.57627%; float: left; margin-right: 1.69492%; } }
@media screen and (min-width: 740px) { .sidebar { width: 23.72881%; float: left; margin-right: 1.69492%; } }
@media screen and (min-width: 580px) { .content { width: 66.10169%; float: left; margin-right: 1.69492%; } }
# registered package$ bower install jquery
# GitHub shorthand$ bower install desandro/masonry
# Git endpoint$ bower install git://github.com/user/package.git
# URL$ bower install http://example.com/scr.js
{ "name": "internet-platform", "devDependencies": { "html5shiv": "aFarkas/html5shiv#3.7.*", "illusion": "timble/illusion#master", "magnific-popup": "dimsemenov/Magnific", "select2": "ivaynberg/select2#3.5.*", "susy": "ericam/susy#2.2.*" } }
BOWER.JSON
{ "name": "internet-platform", "devDependencies": { "grunt": "^0.4.5", "grunt-contrib-watch": "~0.6.1", "grunt-sass": "^0.17.0", "load-grunt-tasks": "^0.6.0" } }
PACKAGE.JSON
module.exports = function(grunt) {
// load time-grunt and all grunt plugins require('load-grunt-tasks')(grunt);
grunt.initConfig({ // Tasks });
grunt.registerTask('default'); };
GRUNTFILE.JS
grunt.initConfig({ // Sass sass: { dist: { files: { css/style.css': 'scss/style.scss', css/ie9.css': 'scss/ie9.scss' } } } });
SASS TASK
module.exports = function(grunt) {
// load time-grunt and all grunt plugins require('load-grunt-tasks')(grunt);
grunt.initConfig({ sass: {...} watch: {...} });
grunt.registerTask('default', ['watch']); };
GRUNTFILE.JS
We build things for the webwww.timble.net
Thank you!www.openpolice.be - @OpenPoliceBE