Skip to content

Instantly share code, notes, and snippets.

View robertocarroll's full-sized avatar

Robert Carroll robertocarroll

16 followers · 113 following
View GitHub Profile
@robertocarroll
robertocarroll / gist:3d4dedd3c007ca3209b3346fe326ae50
Created November 19, 2017 16:30
IA typography
dark grey (#333333) rather than black as the primary text colour on the site’s white background.
Two more accent colours: light grey (#999999) for the auxiliary text and crimson red (#CC0000) for links.
Auxiliary data is highlighted with H5 heading:
{font-variant:small-caps; text-transform:lowercase; font-size:0.875em;}
The rest is simply a result of pedantically calculated font sizes and leading:
@robertocarroll
robertocarroll / gist:fc3e27233c817d6a9f750383e34e61c4
Created November 15, 2017 11:55
Tachyons 50/50 image content block
<section class="dt-ns pb4 w-100">
<div class="dt-row-ns">
<div class="w-100 w-50-ns ph3 bg-black v-mid tc dtc-ns pv5 pv0-ns">
<h1 class="f1 f-head-ns white ttu fw4">Test</h1>
<p class="f3 white i">Test put some content here maybe 10-15 words</p>
</div>
<div class="w-100 w-50-ns dtc-ns h-100">
<div class="aspect-ratio aspect-ratio--7x5">
<div class="aspect-ratio--object cover" style="background:url(http://mrmrs.github.io/photos/001.jpg) center;"></div>
</div>
@robertocarroll
robertocarroll / gist:1d0dc06f6faa7d1ad48b32a4be8a7bbc
Created November 7, 2017 17:01
Tachyons version of text highlight
<h3 class="f6 ttu mb0">H1 Oswald Highlight bold 2rem / 36px </h3>
<div class="db">
<h1 class="di mt0 pa3 ttu bg-ashblue bd-clone lh-title">h1 Featured content<br>longer text that wraps<br>Featured</h1>
</div>
.bd-clone {
-webkit-box-decoration-break: clone;
-ms-box-decoration-break: clone;
-o-box-decoration-break: clone;
box-decoration-break: clone;
@robertocarroll
robertocarroll / gist:dbd13ed5fedff33a1a7cfc03a29ad677
Created September 30, 2017 15:18
Partials and Tachyons
Middleman allows you to create partials (https://middlemanapp.com/basics/partials/)
Partials can accept both parameters and arbitrary HTML (passed as a block)
`<%= partial(:button, :locals => { :type => 'primary', :text => "Click Me!" }) %>`
For a block, something like this:
```<button class="YOUR TACHYONS CLASSES GO HERE">
<%= yield %>
</button>
@robertocarroll
robertocarroll / WP-HTML-Compression
Created April 30, 2017 02:22 — forked from sethbergman/WP-HTML-Compression
Minify HTML for WordPress without a Plugin - Add to function.php
<?php
class WP_HTML_Compression
{
// Settings
protected $compress_css = true;
protected $compress_js = true;
protected $info_comment = true;
protected $remove_comments = true;
// Variables
@robertocarroll
robertocarroll / index.html
Created April 22, 2017 04:12
Fictive Kin header
<!doctype html>
<html class="contact-black">
<head>
<title>Fictive Kin — /Purpose</title>
<link rel="stylesheet" href="/static/css/main.scss.css?2016071500">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Fictive Kin is an engineering and design studio based in Brooklyn.">
<!-- FAVICONS -->
<link rel="apple-touch-icon" sizes="57x57" href="/static/images/apple-touch-icon-57x57.png">
@robertocarroll
robertocarroll / gist:b23595dcb543ff1ab6492891ef691f9e
Created March 30, 2017 10:37
Iterate on an Object instance
var person = {
firstName: 'David',
lastName: 'Walsh',
// ...
};
Object.keys(person).forEach(function(trait) {
console.log('Person ', trait,': ', person[trait]);
});
@robertocarroll
robertocarroll / README.md
Created March 29, 2017 11:12 — forked from KoGor/README.md
Earth globe

Интерактивный глобус с возможностью вращения мышкой и центрированием на выбранную страну. Подробнее о создании можно почитать на Хабрахабре.

This projected is licensed under the terms of the MIT license.

@robertocarroll
robertocarroll / merge.js
Created December 4, 2016 17:53
//I have no idea why this isn't working https://caolan.github.io/async/docs.html#map
var turf = require('turf'),
fs = require('fs'),
async = require('async');
var files = ['./input/serbia.geojson', './input/kosovo.geojson'];
function readAsync(file, callback) {
fs.readFile(file, 'utf8', callback);
@robertocarroll
robertocarroll / gist:9b29eea78475f412b93a1952f75221a8
Last active November 29, 2016 10:14
Using Object literals instead of switch.
//Using Object literals instead of switch.
function getDrink (type) {
var drink;
var drinks = {
'coke': function () {
drink = 'Coke';
},
'pepsi': function () {
drink = 'Pepsi';