Skip to content

Instantly share code, notes, and snippets.

View inlikealion's full-sized avatar

Matt Bainton inlikealion

15 followers · 4 following
View GitHub Profile
@inlikealion
inlikealion / CSS Setup Comments
Created March 30, 2011 15:25
Basic setup of main css file, with example sectioning, etc…
/* _________________________________________________
For:
Original Author:
URL:
Thanks to: Ethan Marcotte, HTML5BoilorPlate.com & 320andUp
____________________________________________________
`GLOSSARY`:
@mason-stewart
mason-stewart / gist:1012550
Created June 7, 2011 16:02
Colors and shiz for .bash_profile
# slightly different version of the awesome stuff found at http://digitalformula.net/articles/pimp-my-prompt-like-paul-irish
# enable the git bash completion commands
source ~/git-completion.sh
# enable git unstaged indicators - set to a non-empty value
GIT_PS1_SHOWDIRTYSTATE="."
# enable showing of untracked files - set to a non-empty value
GIT_PS1_SHOWUNTRACKEDFILES="."
@rickharris
rickharris / .bash_profile
Created June 14, 2011 23:04
Two-line bash prompt
PS1='\r\n\[\033[0;35m\]\u@\H\[\033[0m\] in \[\033[34m\]\w\[\033[37m\]\r\n∴ \[\033[0m\]'
@anthonyshort
anthonyshort / gist:1178298
Created August 29, 2011 12:31
Prefixing with Sass
@mixin border-radius($radius, $prefixes: -moz -webkit -o) {
@each $prefix in $prefixes {
#{$prefix}-border-radius:$radius;
}
border-radius:$radius;
}
#id {
@include border-radius(5px, -moz -webkit);
@necolas
necolas / README.md
Last active May 5, 2026 14:23
Experimenting with component-based HTML/CSS naming and patterns

NOTE I now use the conventions detailed in the SUIT framework

Template Components

Used to provide structural templates.

Pattern

t-template-name
@nathansmith
nathansmith / file_input_example.css
Created December 9, 2011 14:56
Markup to Hide a File Input
.fake_file_input {
background: url(../images/fake_file_input.png) no-repeat;
cursor: pointer;
width: 150px;
height: 30px;
overflow: hidden;
position: relative;
display: inline-block;
*display: inline;
*zoom: 1;
@froots
froots / image_replacer.js
Created March 13, 2012 17:03
Apple Image Replacer - prettified from http://images.apple.com/v/ipad/a/scripts/image_replacer.js
if (typeof (AC) === "undefined") {
AC = {}
}
AC.ImageReplacer = Class.create({
_defaultOptions: {
listenToSwapView: true,
filenameRegex: /(.*)(\.[a-z]{3}($|#.*|\?.*))/i,
filenameInsert: "_☃x",
ignoreCheck: /(^http:\/\/movies\.apple\.com\/|\/105\/|\/global\/elements\/quicktime\/|_(([2-9]|[1-9][0-9]+)x|nohires)(\.[a-z]{3})($|#.*|\?.*))/i,
attribute: "data-hires",
@emilbjorklund
emilbjorklund / breakpoints_via_css.html
Created April 24, 2012 16:03
Width detection via sneaky CSS rules
<!DOCTYPE html>
<!--[if IE 8]> <html lang="sv-SE" class="no-js ie8"> <![endif]-->
<!--[if gt IE 8]><!--> <html lang="sv-SE" class="no-js"> <!--<![endif]-->
<head>
<meta charset="UTF-8">
<title>Breakpoint detection test</title>
<style type="text/css" media="screen">
@media screen and (min-width: 320px) {
#page:after {
content: 'smallest'; /* represent the current width-bracket */
@inlikealion
inlikealion / 0_selector_hacks.scss
Created July 19, 2012 18:42 — forked from chriseppstein/0_selector_hacks.scss
This gist demonstrates some uses of the new sass feature: Passing content blocks to mixins.
@mixin ie6 { * html & { @content } }
#logo {
background-image: url("/images/logo.png");
@include ie6 { background-image: url("/images/logo.gif"); }
}
@marcedwards
marcedwards / high-dpi-media.css
Last active April 22, 2026 09:38
A CSS media query that captures almost all high DPI aware devices.
/* ---------------------------------------------------------- */
/* */
/* A media query that captures: */
/* */
/* - Retina iOS devices */
/* - Retina Macs running Safari */
/* - High DPI Windows PCs running IE 8 and above */
/* - Low DPI Windows PCs running IE, zoomed in */
/* - Low DPI Windows PCs and Macs running Firefox, zoomed in */
/* - Android hdpi devices and above */