kevinmpowell

tell application "Asana" to activate
tell application "System Events"
	key down tab
	keystroke "z"
	key up tab
end tell

kevinmpowell

tell application "Asana" to activate
tell application "System Events"
	key down tab
	keystroke "q"
	key up tab
end tell

kevinmpowell

Design Tokens Vocabulary

Term	Definition	Example(s)
Platform Styling Language (PSL)	A programming language responsible for styling UI on a specific platform.	CSS (Web) XML (Android) Objective-C (iOS) Swift (iOS) Javascript (SketchAPI)
Property Context	The portion of a UI to which style values will be applied.	CSS .heading-level-1 #id h1 XML <TextView style="@style/HeadingLevel1"> Swift Text.font(.system()) Javascript sharedTextStyles[{name: 'Heading Level 1'}])
Property Key	A predefined label belonging to an End State Styling Language	CSS font-size opacity z-index XML android:textSize Swift .font(.system(size)) Javascript (SketchAPI) style.textSize
Variable Key	An arbitrary label assigned to a value	color-background-default `space-inset

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

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

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

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

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 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

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

{% 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() }}