Skip to content

Instantly share code, notes, and snippets.

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
button {
background-image: linear-gradient(#5187c4, #1c2f45);
background-size: auto 200%;
background-position: 0 100%;
transition: background-position 0.5s;
/* ...and various other button styles */
}
button:hover {
function animationClick(element, animation){
element = $(element);
element.click(
function() {
element.addClass('animated ' + animation);
//wait for animation to finish before removing classes
window.setTimeout( function(){
element.removeClass('animated ' + animation);
}, 2000);
}
/* Small margins */
.mas { margin: 5px; }
.mts { margin-top: 5px; }
.mrs { margin-right: 5px; }
.mbs { margin-bottom: 5px; }
.mls { margin-left: 5px; }
/* Medium margins */
.mam { margin: 10px; }
@szpakoli
szpakoli / CSS
Created August 22, 2013 16:34
sup line-height fix: Fix the line-height gap that the default sup tag creates.
sup{
vertical-align: top;
font-size: 0.8em;
}
#test { counter-reset: c; }
#test span { counter-increment: c; }
#test span:before { content: counter(c, decimal-leading-zero); }
@szpakoli
szpakoli / CSS
Created July 15, 2013 19:40
Play Button Overlay: Hover / Fade Overlay with centered play button
.vid-clip-sm {
width: 121px;
height: 88px;
position: relative;
margin: 0 8px 8px 0;
float: left;
}
.vid-clip-sm .vid-clip-play {
width: 121px;
@szpakoli
szpakoli / LESS Mixin
Created July 2, 2013 15:01
CSS Font Sizes - REMs with PX fallback for older broswers (snippet pulled from Base Framework: http://matthewhartman.github.io/base/)
// Font Sizes (REMs with PX fallback for older browsers)
.font-size (@sizeValue) {
@remValue: @sizeValue / 16;
@pxValue: (@sizeValue);
font-size: ~"@{pxValue}px";
font-size: ~"@{remValue}rem";
}
// Line Height Sizes (REMs with PX fallback for older browsers)
.line-height (@sizeValue) {
@szpakoli
szpakoli / flatUI-colors
Created July 1, 2013 20:30
Flat UI Colors pulled from http://flatuicolors.com/
// Flat UI Colors
@turquoise: #1ABC9C;
@green-sea: #16A085;
@emerland: #2ECC71;
@nephritis: #27AE60;
@peter-river: #3498DB;
@belize-hole: #2980B9;
@amethyst: #9B59B6;
@wisteria: #8E44AD;
@wet-asphalt: #34495E;
sub, sup {
/* Specified in % so that the sup/sup is the
right size relative to the surrounding text */
font-size: 75%;
/* Zero out the line-height so that it doesn't
interfere with the positioning that follows */
line-height: 0;
/* Where the magic happens: makes all browsers position