Skip to content

Instantly share code, notes, and snippets.

View nonlinear's full-sized avatar

Nicholas Frota nonlinear

View GitHub Profile
@mixin float {
display: inline;
position: relative;
}
@mixin float-left {
float: left;
@include float;
}
@caseyohara
caseyohara / reserved_usernames.rb
Created December 9, 2011 22:58
A list of reserved usernames to avoid vanity URL collision with resource paths
# A list of possible usernames to reserve to avoid
# vanity URL collision with resource paths
# It is a merged list of the recommendations from this Quora discussion:
# http://www.quora.com/How-do-sites-prevent-vanity-URLs-from-colliding-with-future-features
# Country TLDs found here:
# http://en.wikipedia.org/wiki/List_of_Internet_top-level_domains#Country_code_top-level_domains
# Languages found here:
@hjortureh
hjortureh / gist:3939474
Created October 23, 2012 15:30
Vendor prefixing in SASS
@mixin vendor-prefix($name, $argument) {
-webkit-#{$name}: $argument;
-ms-#{$name}: $argument;
-moz-#{$name}: $argument;
-o-#{$name}: $argument;
#{$name}: $argument;
}
@mixin border-radius($argument) {
@include vendor-prefix(border-radius, $argument);
@iambibhas
iambibhas / scopes.txt
Last active May 5, 2024 06:39
Sublime Text 2: Snippet scopes
Here is a list of scopes to use in Sublime Text 2 snippets -
ActionScript: source.actionscript.2
AppleScript: source.applescript
ASP: source.asp
Batch FIle: source.dosbatch
C#: source.cs
C++: source.c++
Clojure: source.clojure
CoffeeScript: source.coffee
@alexdmejias
alexdmejias / gist:5396170
Created April 16, 2013 14:06
convert pixel to em - warning I have yet to test it, not 100% on the syntax
@mixin pte($pixels, $context:16) {
@return { $pixels / $context}em;
}
@pistachiomatt
pistachiomatt / sprite-generation-with-retina.scss
Last active November 5, 2019 12:28
This function generates a sprite sheet of icons, swaps it out for retina versions, and generates the "width" and "height" properties of the icons for you— automatically. Because we're lazy and have better things to do!
// Stick all your icons in a subfolder in your images folder. Put retina versions in a subfolder of that called "@2x".
$sprites: sprite-map("NAME_OF_SUBFOLDER/*.png");
$sprites2x: sprite-map("NAME_OF_SUBFOLDER/@2x/*.png");
// stolen from 37signals
@mixin retina-media() {
@media (min--moz-device-pixel-ratio: 1.3),
(-webkit-min-device-pixel-ratio: 1.3),
(min-device-pixel-ratio: 1.3),
(min-resolution: 1.3dppx) {
@mixin _position($position, $args) {
$offsets: top right bottom left;
@each $o in $offsets {
$i: index($args, $o);
@if $i
and $i + 1 <= length($args)
and type-of( nth($args, $i + 1) ) == number {
#{$o}: nth($args, $i + 1);
}
@kawasako
kawasako / gist:6342210
Created August 26, 2013 14:46
SCSS @mixin inline-block
// Mixin
@mixin inline-block() {
display: inline-block;
*zoom: 1; // hasLayout true for ie7
*display: inline; // for ie7
}
@ntreadway
ntreadway / _mixins.scss
Last active December 30, 2015 09:49
Hide and show Sass mixins for optimized device performance.
@mixin show-it {
height: auto;
visibility: visible;
@include opacity(1); // Compass mixin
}
@mixin hide-it {
position: absolute;
-webkit-transform: translate3d(-9999rem,0,0);
-moz-transform: translate3d(-9999rem,0,0);
@robertmagnusson
robertmagnusson / size_mixin.scss
Created February 3, 2014 08:52
Mixin to set height and width.
@mixin size($width, $height: $width) {
width: $width;
height: $height;
}