Skip to content

Instantly share code, notes, and snippets.

View freshyill's full-sized avatar
💭
😎 Cool

Chris Coleman freshyill

💭
😎 Cool
18 followers · 25 following
View GitHub Profile
@freshyill
freshyill / dabblet.css
Created June 6, 2012 18:37
"New" sashes
/**
* "New" sashes
*/
body {background: url(https://a1.lscdn.net/imgs/9150ea6b-2d69-4dce-ba12-6838c560909f/original_q60.jpg) no-repeat center center fixed; background-size: cover; font-family: Arial Rounded MT Bold; -webkit-font-smoothing: antialiased; font-size: 14px;}
.nav ul {width: 220px;}
.nav li {background: #262626; display: block; border-top: 1px solid rgba(255,255,255,.1); border-bottom: 1px solid rgba(0,0,0,.5);}
.nav li a {display: block; color: #fff; padding: 10px; text-decoration: none; padding-left: 40px; position: relative;}
.nav li:first-child {border-radius: 4px 4px 0 0;}
@freshyill
freshyill / index.html
Created July 18, 2012 01:59
A web page created at CodePen.io
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CodePen &middot; A Pen by freshyill</title>
<!--
Copyright (c) 2012 Chris Coleman, http://codepen.io/freshyill
Permission is hereby granted, free of charge, to any person obtaining
@freshyill
freshyill / 1140-extras.css
Created September 18, 2012 03:44 — forked from inky/1140-extras.css
Some additional rules for the 1140px CSS Grid System, to allow whitespace to the left of a column. (Not tested extensively…)
.onepush {
margin-left: 8.65%;
}
.twopush {
margin-left: 17.3%;
}
.threepush {
margin-left: 25.95%;
@freshyill
freshyill / Keyframe Animation Mixin
Created September 28, 2012 14:34
A simple mixin to create keyframe animation. Bourbon doesn't currently have a mixin for this. Requires SASS 3.2
// Mixin
@mixin keyframes($name) {
@-moz-keyframes #{$name} { @content; }
@-webkit-keyframes #{$name} { @content; }
@-o-keyframes #{$name} { @content; }
@-ms-keyframes #{$name} { @content; }
@-khtml-keyframes #{$name} { @content; }
@keyframes #{$name} { @content; }
}
@freshyill
freshyill / css-stats-ack.sh
Created September 28, 2012 20:34 — forked from pjkix/css-stats-ack.sh
shell script to generate some css file statistics
#!/bin/bash
## v1.0.6
## this script will gernerate css stats
### example output
# CSS STATS
# ----------
# Floats: 132
@freshyill
freshyill / link-mixin.scss
Created October 22, 2012 17:37
Link color mixin... this might be either really useful or really stupid.
@freshyill
freshyill / index.html
Created October 26, 2012 05:18
A CodePen by Chris Coleman. iOS Style toggle mixin - There's a lot of these things out there and I don't like any of them. I see so many people trying to prove how they can do this with just one element or something like that. Well that's just great. You'
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="css/toggle.css"
</head>
<body style="padding: 50px;">
@freshyill
freshyill / _link-color.scss
Created October 26, 2012 13:55
Simpler link color mixin
@mixin links($link: '#7ab4e5', $visited: '#7ab4e5', $hover: '#e62c25', $active: 'lighten($hover, 10%)', $focus: $hover, $transition: '.15s color ease-in-out') {
&:link { color: $link; }
&:visited { color: $visited; }
&:hover { color: $hover; }
&:active { color: $active; }
&:focus { color: $focus; }
@include transition($transition);
}
Usage - all arguments are optional
@freshyill
freshyill / mario.html
Created November 20, 2012 23:18
Mario in CSS
<!doctype html>
<html>
<head>
<style>
body {padding: 100px;}
@freshyill
freshyill / index.html
Created November 20, 2012 23:26
A CodePen by Chris Coleman. Mario in CSS - I'm the last person on Earth to do one of these, I'm sure. I feel like this is ripe for a SASS mixin. Maybe that'll be next.
<div class="mario"></div>