Skip to content

Instantly share code, notes, and snippets.

@ddprrt
ddprrt / lessig.less
Created March 18, 2015 10:33
A Lessig File
@color: blue;
body {
background-color: @color;
}
@ddprrt
ddprrt / Gruntfile.js
Created February 13, 2015 14:06
Short LESS/Sass Gruntfile
'use strict';
module.exports = function(grunt) {
grunt.loadNpmTasks('grunt-contrib-sass');
grunt.loadNpmTasks('grunt-contrib-less');
require('time-grunt')(grunt);
grunt.initConfig({
sass: {
@ddprrt
ddprrt / lessig.less
Created November 14, 2014 21:19
A Lessig File
p, li, figure, h1, h2, h3, h4 {
& + & {
margin-top: 1em;
}
}
@ddprrt
ddprrt / lessig.less
Last active August 29, 2015 14:08
A Lessig File
// Normal
.create-buffer(@n: 10) {
.width-@{n} {
width: @n * 1px;
}
@m1: @n*2;
.width-@{m1} {
width: @m2 * 1px;
}
@ddprrt
ddprrt / lessig.less
Created October 22, 2014 16:05
A Lessig File
.myclass {
border-right: 1px;
}
.theme .myclass {
border-left: 1px;
}
.superclass:extend(.myclass all) {}
@ddprrt
ddprrt / lessig.less
Last active August 29, 2015 14:05
A Lessig File
@myfirstvar: #c0ffee;
@hslvar: hsl(hue(@myfirstvar), 1, 0.3);
.superclass {
background-color: @hslvar;
color: @myfirstvar;
a {
text-decoration: underline;
@ddprrt
ddprrt / lessig.less
Created August 21, 2014 17:17
A Lessig File
@color: blue;
.mymixin() {
background-color: @color;
box-shadow+: inset 2px 2px 10px @color;
}
.myclass {
.mymixin;
box-shadow+: 10px 10px 0 black;
@ddprrt
ddprrt / lessig.less
Created August 21, 2014 17:14
A Lessig File
@color: blue;
.mymixin() {
background-color: @color;
box-shadow+: inset 2px 2px 10px @color;
}
.myclass {
.mymixin;
box-shadow+: 10px 10px 0 black;
@ddprrt
ddprrt / Gruntfile.js
Created August 11, 2014 07:40
WIP: Gruntfile with Sass and Server to use with Patternlab
'use strict';
module.exports = function (grunt) {
// show elapsed time at the end
require('time-grunt')(grunt);
// load all grunt tasks
require('jit-grunt')(grunt);
grunt.initConfig({
watch: {
@ddprrt
ddprrt / dabblet.css
Created May 15, 2013 11:57
The first commented line is your dabblet’s title
/**
* The first commented line is your dabblet’s title
*/
html, body { height: 100%; }
body {
background: black;
color: red;
font-family: sans-serif;
text-align: center;