Skip to content

Instantly share code, notes, and snippets.

View kfrank's full-sized avatar
:octocat:

Klare Frank kfrank

:octocat:
View GitHub Profile
@kfrank
kfrank / gitbit.ino
Created November 12, 2018 06:43
status board for pushing and pulling code
#include <Button.h> // From our class
#define TOLERANCE 10 // For the potentiometer
// include LED library code
#include <FastLED.h> // Fast LED library
#define NUM_LEDS 60
#define DATA_PIN 3
CRGB leds[NUM_LEDS];
// include LCD library code
@kfrank
kfrank / index.html
Created May 29, 2018 19:08
Intersectional Design Considerations
<div class="scene">
<div class="carousel">
<div class="carousel__cell">
<div>
<h1 class="uppercase">Intersectional Design Considerations</h1>
<p>What is intersectionality? Why does this matter to technology design?</p>
<a href="#" class="random-button"><span>Explore</span></a>
</div>
</div>
<div class="carousel__cell">
@kfrank
kfrank / accessibility-checklist.md
Created June 7, 2016 19:14
Accessibility Checklist

Accessibility checklist (All of the things in this checklist may not apply to every project)

Aria roles:

  • <header role="banner"> A region of the page that is site focused. Typically your global page header.
  • <nav role="navigation"> Contains navigational links.
  • <main role="main"> Focal content of document. Use only once.
  • <article role="article"> Represents an independent item of content. Use only once on outermost element of this type.
  • <aside role="complementary"> Supporting section related to the main content even when separated.
  • `` Contains information about the document (meta info, copyright, company info, etc).
<!DOCTYPE html>
<html lang="en" class="marketing-layout landing-pages-controller show-action development visitor chrome webkit osx" id="layout" data-featurette="marketing-layout" >
<head>
<title>Treehouse | Learn Parasailing Programming on Treehouse</title>
<meta charset="UTF-8" />
<meta name="description" content="Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Donec id elit non mi porta gravida at eget metus. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Maecenas faucibus mollis interdum." />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
.wufoo {
font-family: Helvetica, sans-serif !important;
}
.wufoo .info {
display: none;
}
.wufoo table {
border-color: transparent;
`execute pathogen#infect()
syntax on
filetype plugin indent on
set number tabstop=4 softtabstop=0 expandtab shiftwidth=2 smarttab mousemodel=extend
command W w
autocmd vimenter * NERDTree | wincmd p
autocmd bufenter * if (winnr("$") == 1 && exists("b:NERDTreeType") && b:NERDTreeType == "primary") | q | endif
@kfrank
kfrank / gist:8e75cccbeb4c802f472f
Created September 26, 2014 16:15
Color loop for buttons
$btn-colors: (primary, $orange),
(secondary, $yellow),
(tertiary, $blue),
(quaternary, $green);
@each $name, $value in $btn-colors {
&--#{$name} {
background: $value;
}
&--ghost {
@kfrank
kfrank / gist:2e79b4f20854ee160d36
Last active August 29, 2015 14:02
Color loop for style tiles
li {
$colors: $primary $secondary $tertiary $quaternary;
@each $color in $colors {
&:nth-child(#{index($colors,$color)}) {
background: $color;
}
}
}
@kfrank
kfrank / header-size-loop
Created September 19, 2012 23:59
Header Font Size Loop
$h: h1, h2, h3, h4, h5, h6;
@for $i from 1 through 6 {
h#{$i} {
font-size: 3.5em - ($i/2.4);
}
}