brianloveswords

gif-from-tweet

There are so many great GIFs out there and I want to have copies of them. Twitter makes that harder than it should be by converting them to MP4 and not providing access to the source material. To make it easier, I made a bash pipeline that takes a tweet URL and a filename, extracts the MP4 from that tweet and uses ffmpeg to convert back to GIF.

Dependencies

• ffmpeg
  • macOS: brew install ffmpeg
  • Ubuntu/Debian: apt install ffmpeg

kevinelliott

Mac OS X 10.10 Yosemite

Custom recipe to get OS X 10.10 Yosemite running from scratch, setup applications and developer environment. I use this gist to keep track of the important software and steps required to have a functioning system after a semi-annual fresh install. On average, I reinstall each computer from scratch every 6 months, and I do not perform upgrades between distros.

This keeps the system performing at top speeds, clean of trojans, spyware, and ensures that I maintain good organizational practices for my content and backups. I highly recommend this.

You are encouraged to fork this and modify it to your heart's content to match your own needs.

Install Software

addyosmani

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

pburtchaell

/**
 * VH and VW units can cause issues on iOS devices: http://caniuse.com/#feat=viewport-units
 * 
 * To overcome this, create media queries that target the width, height, and orientation of iOS devices. 
 * It isn't optimal, but there is really no other way to solve the problem. In this example, I am fixing 
 * the height of element `.foo` —which is a full width and height cover image.
 *
 * iOS Resolution Quick Reference: http://www.iosres.com/
 */
 

addyosmani

Web Components Can Do That?! extras

Thanks a ton for coming down to my talk, folks <33z. Your energy was amazing. This page has a few extra resources for you.

Slides

http://addyosmani.github.io/fitc-wccdt/

lurkmoophy

Client Questions

An open source list of questions to ask your client/potential clients before kicking off a project by Luke Murphy.

• Originally published: 25/02/2014

---

Technical

• Who is responsible for content in your organisation?

bomberstudios

NOTE: the list has moved to https://github.com/sketchplugins/plugin-directory

Sketch Plugins

A list of Sketch plugins hosted at GitHub, in no particular order.

• brandonbeecroft/Lorem-Ipsum-Plugin-for-Sketch This is a plugin for quickly creating Lorem Ipsum text in Sketch
• sebj/Sketch Templates and Plugins for Sketch by Bohemian Coding
• FredericJacobs/crop_Artboard A script to export the Sketch App artboards to the clipboard
• almonk/SketchGit A simple Git client built right into Sketch.

roine

/* normal flexbox */
.flexbox .flex-container {
        display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
}
.flexbox .flex-container.vertical {
	display: -webkit-flex;
	display: -moz-flex;

dergachev

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:

leostratus

An ongoing project to catalogue all of these sneaky, hidden, bleeding edge selectors as I prepare my JSConf EU 2012 talk.

Everything is broken up by tag, but within each the selectors aren't particularly ordered.

I have not tested/verified all of these. Have I missed some or got it wrong? Let me know. - A

A friendly reminder that you may need to set this property on your target/selected element to get the styling results you want:

-webkit-appearance:none;