Skip to content

Instantly share code, notes, and snippets.

View nonlinear's full-sized avatar

Nicholas Frota nonlinear

View GitHub Profile
@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;
}
@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);
@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
}
@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);
}
@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) {
@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;
}
@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
@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);
@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:
@mixin float {
display: inline;
position: relative;
}
@mixin float-left {
float: left;
@include float;
}