kevinmpowell

/**
 * Android 2.3.4 2d transform bug when 3d transform rule is given
 */

.rotate-me-working {
	position:absolute;
	left:50%;
	top:50%;
	-webkit-transform: rotate(45deg);
}

kevinmpowell

Easy responsive sprites using grunt-spritesmith and SCSS

Requires grunt-spritesmith which generates a spritesheet from a bunch of images.

This gist passes a custom template for spritesmith to generate the SCSS file.

Gruntfile.js

sprite: {
 src: "images/*.png",

kevinmpowell

# Input strings like "52 lb 6 oz" or "8 oz"
def weight_string_to_float(weight_string)
  /(?<lb>[0-9]*\slb\s)*(?<oz>[0-9]*\soz)/ =~ weight_string
  lbs = 0
  unless lb.nil?
    lbs += lb.to_i
  end

  unless oz.nil?
    lbs += (oz.to_i * 0.0625)

kevinmpowell

{% macro hero(
        title="We Are Awesome",
        background_image="http://placehold.it/1000x400",
        cta_text="Find Out Why!",
        cta_href="/some/awesome-link.html"
        ) %}
  <div class="hero" {% if background_image %} style="background-image:url({{ background_image }})" {% endif %}>
    <h1 class="hero__title">{{ title }}</h1>
    {% if caller %}
      {{ caller() }}

kevinmpowell

OS X Screencast to animated GIF

This gist shows how to create a GIF screencast using only free OS X tools: QuickTime, ffmpeg, and gifsicle.

Instructions

To capture the video (filesize: 19MB), using the free "QuickTime Player" application:

kevinmpowell

{% set mixed_object = {
                        key_1: 'Delta',
                        key_2: 'Epsilon',
                        key_3: ['Zeta', 'Eta', 'Theta', 'Iota']
                      } %}
{% for key, value in mixed_objct %}
  {% if value[0].length > 1 %}
    {# This is an array, do array stuff with it #}
    {{ value | join('<br>') | safe }}
   {% else %}

kevinmpowell

$esds-tokens: (
    'color': (
        'white': $esds-color-white,
        'black': $esds-color-black,
        'orange': (
            '82': $esds-color-orange-82,
            '91': $esds-color-orange-91,
            '93': $esds-color-orange-93
        ),
        'neutral': (

kevinmpowell

{% set a = (a.push(3),a) %}

{# Copied from: https://github.com/mozilla/nunjucks/issues/240 and added here for findability #}

kevinmpowell

import Vue from 'vue'
import App from './App.vue'
import Form from './Form.vue'

Vue.config.productionTip = false

const NotFound = { template: '<p>Page not found</p>' }
const routes = {
  '/': App,
  '/form': Form

kevinmpowell

{
  "extends": [
    "stylelint-config-sass-guidelines",
    "stylelint-config-prettier"
  ],
  "rules": {
    "color-hex-case": "upper",
    "color-hex-length": "long",
    "selector-class-pattern": "^(?:(?:o|c|u|t|s|is|has|_|js|qa)-)?[a-z0-9]+(?:-[a-z0-9]+)*(?:__[a-z0-9]+(?:-[a-z0-9]+)*)?(?:--[a-z0-9]+(?:-[a-z0-9]+)*)?(?:\\[.+\\])?$",
    "max-nesting-depth": 2