jdsimcoe

Susy Tutorial

For this tutorial I'm assuming you are already comfortable with CSS, Sass (I'll use the SCSS syntax) and Compass. Please get set up with each one of those before attempting to use Susy. Sass and Compass both have their own setup instructions and tutorials that you can use.

There is also reference documentation in the works.

What Susy Does

CSS Systems

jdsimcoe

<?xml version="1.0" encoding="UTF-8"?>
<projectDescription>
	<name>site_mozo</name>
	<comment></comment>
	<projects>
	</projects>
	<buildSpec>
		<buildCommand>
			<name>com.demandware.studio.core.beehiveElementBuilder</name>
			<arguments>

jdsimcoe

<VirtualHost *:80>
  ServerName pow
  ServerAlias *.dev
  ServerAlias *.xip.io

  ProxyPass / http://localhost:20559/
  ProxyPassReverse / http://localhost:20559/
  ProxyPreserveHost On
</VirtualHost>

jdsimcoe

export PATH="/usr/local/mysql/bin:$PATH"

[[ -s "/Users/Steven/.rvm/scripts/rvm" ]] && source "/Users/Steven/.rvm/scripts/rvm" # Load RVM into a shell session *as a function*
[[ -s "$HOME/.rvm/scripts/rvm" ]] && . "$HOME/.rvm/scripts/rvm" 


parse_git_branch() {
  git branch 2> /dev/null | sed -e '/^[^*]/d' -e 's/* \(.*\)/(\1)/'
}

jdsimcoe

Templating in EE vs. Craft

Lots of people have asked, so here are a few common tasks you might do in your templates, as they would be written in ExpressionEngine vs. Craft.

Table of Contents

1. Comments
2. Conditionals
3. Loops

jdsimcoe

<?php
 
/*
|--------------------------------------------------------------------------
| Application Routes
|--------------------------------------------------------------------------
|
| Here is where you can register all of the routes for an application.
| It's a breeze. Simply tell Laravel the URIs it should respond to
| and give it the Closure to execute when that URI is requested.

jdsimcoe

/*!
 * Grunt
 * $ npm install grunt-contrib-uglify grunt-autoprefixer grunt-contrib-cssmin grunt-contrib-imagemin grunt-contrib-sass grunt-contrib-watch grunt-contrib-concat grunt-contrib-clean grunt-contrib-jshint grunt-notify --save-dev
 */

module.exports = function(grunt) {

  grunt.initConfig({

    // Sass

jdsimcoe

<?xml version="1.0" encoding="utf-8" ?>
<data>
	<params>
		<today>2011-10-27</today>
		<current-time>16:00</current-time>
		<this-year>2011</this-year>
		<this-month>10</this-month>
		<this-day>27</this-day>
		<timezone>-07:00</timezone>
		<website-name>Symphony CMS</website-name>

jdsimcoe

{% capture json %}
{
  {% for tag in site.pages['blog'].taxonomy['tags'] %}
    "{{tag.slug}}":
    [{% for post in tag.posts limit:10 %}
    {
      "title":  {{post.title | json}},
      "url":  {{post.url | json}},
      "img":  {{post.assets.first.url | json}}
    }{% unless forloop.last %},{% endunless %}

jdsimcoe

/**
 * 
 * Paste image class / identifier in IIFE parenthesis at end of function
 * 
 * */

(function(i){"use strict";var img=document.querySelector(i),sizes=[];window.addEventListener("resize",()=>{var vw=Math.round(((img.offsetWidth*100)/window.innerWidth))+"vw",mq="(min-width: "+window.innerWidth+"px)",value=vw;vw!=="0vw"&&sizes.indexOf(vw)===-1&&(sizes.push(value),console.log(mq,vw))})})("PASTE CLASS OR IDENTIFIER HERE");