colin-johnston

// start Spinner

// insert as <div class="spin-loader"></div> centered in loader mask

$spinner-size: 48px;

.spin-loader {
  -webkit-animation: spin 1s linear infinite;
          animation: spin 1s linear infinite;
  border: 8px solid rgba(238,243,250,1);

colin-johnston

These are instructions for setting up git to authenticate with GitHub when you have 2-factor authentication set up. This authentication should be inherited by any GUI client you are using. These are intentionally brief instructions, with links to more detail in the appropriate places.

1. Download and install the git command-line client (if required).

2. Open the git bash window and introduce yourself to git (if required):

   git config --global user.name 'Firstname Lastname'
   git config --global user.email '[email protected]'
   

colin-johnston

Kirby + Patterns = <3

When I heard about Brad Frost's Patternlab for the first time at beyond tellerrand I was intrigued. The idea of splitting your design work for a website into simple modules or patterns isn't new and starts to become more and more of a standard. But organizing this into a very visual styleguide/patternlab seemed to make so much sense. Brad also introduced a very interesting approach with his separation of modules into categories, such as atoms, molecules and organisms.

I started porting Brad's patternlab app to Kirby, but it never really made it to something polished and it turned out for me after using it for Kirby's panel UI, that it's actually a pain in the ass to maintain such a pattern collection.

The problem of patternlab

The problem with such a styleguide or patternlab is that it exists next to the real thing. When you change something in your code base you also have to update the particular code for the pattern in patternlab. To be honest I went very quickly from being

colin-johnston

diff -ru RichText.mdimporter/Contents/Info.plist Markdown.mdimporter/Contents/Info.plist
--- RichText.mdimporter/Contents/Info.plist	2015-11-23 16:14:12.000000000 +0200
+++ Markdown.mdimporter/Contents/Info.plist	2015-11-23 16:10:03.000000000 +0200
@@ -13,15 +13,7 @@
 			<string>MDImporter</string>
 			<key>LSItemContentTypes</key>
 			<array>
-				<string>public.rtf</string>
-				<string>public.html</string>
-				<string>public.xml</string>

colin-johnston

<script type="text/javascript">
    (function () {
      "use strict";
      // once cached, the css file is stored on the client forever unless
      // the URL below is changed. Any change will invalidate the cache
      var css_href = './index_files/web-fonts.css';
      // a simple event handler wrapper
      function on(el, ev, callback) {
        if (el.addEventListener) {
          el.addEventListener(ev, callback, false);

colin-johnston

<ul class="o-list-fit  c-nav-primary">
  <li class="o-list-fit__item  c-nav-primary__item">
    <a href="#" class="o-list-fit__link  c-nav-primary__link">The workshop</a>
  </li>
  <li class="o-list-fit__item  c-nav-primary__item">
    <a href="#" class="o-list-fit__link  c-nav-primary__link">2013 Schedule</a>
  </li>
  <li class="o-list-fit__item  c-nav-primary__item">
    <a href="#" class="o-list-fit__link  c-nav-primary__link  is-current">About CSS Wizardry</a>
  </li>

colin-johnston

# -*- mode: ruby -*-
# vi: set ft=ruby :

Vagrant.configure("2") do |config|

  # Box
  config.vm.box = "precise64"
  config.vm.box_url = "http://files.vagrantup.com/precise64.box"

  # Forwarded Ports

colin-johnston

<div class="wrapper">
  
<div class="color">&nbsp;</div> 
<div class="color2">&nbsp;</div> 

</div>

colin-johnston

colin-johnston

<?php

# Licensed under a CC0 1.0 Universal (CC0 1.0) Public Domain Dedication
# http://creativecommons.org/publicdomain/zero/1.0/

$mysite = 'https://adactio.com/'; // Change this to your website.
$token_endpoint = 'https://tokens.indieauth.com/token';

$_HEADERS = array();
foreach(getallheaders() as $name => $value) {