Skip to content

Instantly share code, notes, and snippets.

View pistachiomatt's full-sized avatar

Matt Pistachio pistachiomatt

View GitHub Profile
@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) {
@pistachiomatt
pistachiomatt / pop.css
Created August 8, 2012 00:32
Pop effect
.pop {
display: block;
-webkit-animation-name: pop;
-webkit-animation-duration: .6s;
-webkit-animation-iteration-count: 1;
-webkit-animation-timing-function: ease-in-out;
}
@-webkit-keyframes pop {
from {
@pistachiomatt
pistachiomatt / messenger.userstyle.css
Created June 27, 2012 05:38
Facebook Messenger Fluid userstyle
#leftColContainer, #MessagingNetegoWrapper, .uiHeaderActions, #pageHead .rfloat, #pageHead .lfloat, #pageFooter, .fbDockWrapper, #blueBarHolder { display: none !important; } #pageHead { padding-left: 20px !important; } html#facebook #contentCol { margin-left: 0 !important } .MessagingReadViewMainContentt, .fbx #globalContainer, #MessagingFrame, #MessagingMainContent { width: 100% !important; }
#contentArea { width: 100% !important; }
.MessagingReadHeader {
top:15px;
left:20px;
}
.MessagingContentHeaderWrapper,
#MessagingShelfContent {