View viewport.js
// ----------- | |
// Debugger that shows view port size. Helps when making responsive designs. | |
// ----------- | |
function showViewPortSize(display) { | |
if(display) { | |
var height = jQuery(window).height(); | |
var width = jQuery(window).width(); | |
jQuery('body').prepend('<div id="viewportsize" style="z-index:9999;position:fixed;top:40px;left:5px;color:#fff;background:#000;padding:10px">Height: '+height+'<br>Width: '+width+'</div>'); | |
jQuery(window).resize(function() { |
View equalheight.js
(function( $ ) { | |
equalheight = function (container) { | |
var currentTallest = 0, | |
currentRowStart = 0, | |
rowDivs = new Array(), | |
$el, | |
topPosition = 0; | |
$(container).each(function () { |
View SassMeister-input.scss
// ---- | |
// Sass (v3.3.10) | |
// Compass (v1.0.0.alpha.20) | |
// ---- | |
$white: #fff; | |
$medium_gray: #999; | |
$sea_green: #16a085; | |
$pomegranate: #c0392b; | |
$orange: #e04604; |
View SassMeister-input-HTML.html
<div class="page"> | |
<header> | |
<h1>Hello I'm The Header</h1> | |
</header> | |
<div class="hero"> | |
<div class="one"> | |
<h2>I'm by myself</h2> | |
</div> | |
<div class="two"> | |
<div><h3>I'm 1</h3></div> |
View SassMeister-input-HTML.html
<div class="page"> | |
<header> | |
<h1>Hello I'm The Header</h1> | |
</header> | |
<div class="hero"> | |
<div class="one"> | |
<h2>I'm by myself</h2> | |
</div> | |
<div class="two"> | |
<div><h3>I'm 1</h3></div> |
View SassMeister-input.scss
// ---- | |
// Sass (v3.3.14) | |
// Compass (v1.0.1) | |
// ---- | |
@mixin image-2x($image, $width, $height) { | |
@media (min--moz-device-pixel-ratio: 1.3), | |
(-o-min-device-pixel-ratio: 2.6/2), | |
(-webkit-min-device-pixel-ratio: 1.3), |
View SassMeister-input-HTML.html
<div class="l-main-wrap" role="main"> | |
<h1>Theme Color Palettes</h1> | |
<article> | |
<p>A demo of the Sass @each directive loop for theme color palettes using Susy grids.</p> | |
<ul class="theme-colors"> | |
<li class="cp-turquoise"><span>Turquoise</span></li> | |
<li class="cp-purple"><span>Purple</span></li> |
View SassMeister-input.scss
// ---- | |
// Sass (v3.3.10) | |
// Compass (v1.0.0.alpha.20) | |
// ---- | |
$white: #fff; | |
$medium_gray: #999; | |
$sea_green: #16a085; | |
$pomegranate: #c0392b; | |
$orange: #e04604; |
View SassMeister-input.scss
// ---- | |
// libsass (v3.0.2) | |
// ---- | |
// Sass | |
// Colors | |
$sea_green: #16a085; | |
$pomegranate: #c0392b; | |
$orange: #e04604; |
View gruntfile.js
var timer = require("grunt-timer"); | |
module.exports = function (grunt) { | |
timer.init(grunt); | |
grunt.initConfig({ | |
pkg: grunt.file.readJSON('package.json'), | |
watch: { | |
sass: { | |
files: ['sass/**/*.{scss,sass}', 'sass/_base/**/*.{scss,sass}'], | |
tasks: ['sass:render'] | |
}, //sass |
OlderNewer