Skip to content

Instantly share code, notes, and snippets.

@onlurking
onlurking / programming-as-theory-building.md
Last active April 19, 2024 22:31
Programming as Theory Building - Peter Naur

Programming as Theory Building

Peter Naur

Peter Naur's classic 1985 essay "Programming as Theory Building" argues that a program is not its source code. A program is a shared mental construct (he uses the word theory) that lives in the minds of the people who work on it. If you lose the people, you lose the program. The code is merely a written representation of the program, and it's lossy, so you can't reconstruct

@ksenzee
ksenzee / grid_mixins.scss
Created December 8, 2017 22:49
Mixins that make it possible to use CSS Grid in IE 10/11 as well as in modern browsers. Based on mixins by Sascha Fuchs at https://medium.com/@gisugosu/css-grid-layout-spec-2-to-spec-1-transpiler-with-sass-415dff4dd31b.
/// Add Gap between the boxes
///
/// @author Sascha Fuchs
///
/// @group core - cssgrid
///
/// @param {list} $boxes - List with box sizes
/// @param {string} $gap - Optional column gap
@function box-gap($boxes, $gap) {
$box: ();
@razwan
razwan / _baseline-spacing.scss
Last active November 10, 2018 18:28
SCSS mixin used to achieve consistent spacing between different typographic elements
$baseline-unit: 12px !default;
$baseline-debug: false !default;
@mixin baseline($baseline-font-size: 16px, $baseline-line-height: 1.25, $cap-height-ratio: 0.68, $margin-bottom: 3rem) {
$baseline-distance: ($baseline-line-height - $cap-height-ratio) / 2;
// set the proper font-size and line-height to size the element in multiples of baseline units
font-size: ($baseline-font-size / $baseline-unit) * 1rem;
line-height: $baseline-line-height;
@derekconjar
derekconjar / _head.erb
Created May 3, 2014 16:22
An example of SEO for Middleman sites. Add data (like titles, meta descriptions, etc.) using YAML files and frontmatter, and use custom helpers to process the data and display them properly within your ERB layouts and partials.
<title><%= title_helper %></title>
<meta charset="utf-8">
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="<%= description_helper %>">
<link rel="canonical" href="<%= permalink_helper %>">
<link rel="author" href="<%= data.site.gplus %>">
<link rel="alternate" type="application/rss+xml" title="http://feeds.feedburner.com/derekconjar">
@razwan
razwan / _baseline.scss
Created April 14, 2014 16:20
Aligning type to baseline the right way with SASS
$base-font-size: 16px;
$base-line-height: 1.5;
// this value may vary for each font
// unitless value relative to 1em
$cap-height: 0.68;
@mixin baseline($font-size, $scale: 2) {
@christopher-hopper
christopher-hopper / vm-resize-hard-disk.md
Last active April 5, 2022 10:30
Resize a Hard Disk for a Virtual Machine provisioned using Vagrant from a Linux base box to run using VirutalBox.

Resize a Hard Disk for a Virtual Machine

Our Virtual Machines are provisioned using Vagrant from a Linux base box to run using VirutalBox. If the Hard Disk space runs out and you cannot remove files to free-up space, you can resize the Hard Disk using some VirtualBox and Linux commands.

Some assumptions

The following steps assume you've got a set-up like mine, where:

@voxpelli
voxpelli / SASS_Color_Contrast.md
Last active August 21, 2022 11:49
Pure SASS script for calculating contrast ratios of colors. MOVED TO: https://github.com/voxpelli/sass-color-helpers

Pure SASS-adaption of Lea Verou's contrast-ratio javascript. Can be useful when eg. generating colored buttons from a single supplied color as you can then check which out of a couple of text colors would give the best contrast.

This script currently lacks the support for alpha-transparency that Lea supports in her script though.

In addition to the color-contrast adaption there's also some math methods that were needed to be able to calculate the exponent of a number and especially so when the exponent is a decimal number. A 2.4 exponent is used to calculate the luminance of a color and calculating such a thing is not something that SASS supports out of the box and not something I found a good pure-SASS script for calculating and I much prefer pure-SASS over ruby extensions. The math methods might perhaps be unecessary though if you're running Compass or similar as they may provide compatible math methods themselves.

Normal usage: `color: pick_best_color(#f00

@zarazan
zarazan / colors.rb
Last active December 13, 2015 17:38
Detect the first three primary colors from an image using the RMagick gem
require 'RMagick'
include Magick
def convert_rgb(color)
color / 257
end
def convert_pixel(pixel)
{
:r => convert_rgb(pixel.red),
@vitalyrotari
vitalyrotari / touch.js
Last active October 22, 2021 22:01
jQuery Touch Gestures
jQuery Touch Gestures ported from QUOjs
@see http://quojs.tapquo.com/
Version 1.1
-- @add singleTap event
-- @fix doubleTap event
-- @fix hold event
@ahsquared
ahsquared / defer_doc_ready_jquery.html
Created April 26, 2012 05:51
Defer a document ready call
<!DOCTYPE html>
<html lang="en">
<head>
<!-- this collects the jquery document ready calls
// used with gratitude from: http://blog.colin-gourlay.com/blog/2012/02/safely-using-ready-before-including-jquery/ -->
<script>(function (w, d, u) { w.readyQ = []; w.bindReadyQ = []; function p(x, y) { if (x == "ready") { w.bindReadyQ.push(y); } else { w.readyQ.push(x); } }; var a = { ready: p, bind: p }; w.$ = w.jQuery = function (f) { if (f === d || f === u) { return a } else { p(f) } } })(window, document)</script>
</head>
<body>
<!-- this is on the page and you want to defer it -->
<script type="text/javascript">