Skip to content

Instantly share code, notes, and snippets.

View jasonmelgoza's full-sized avatar
🏠
Working from home

Jason Melgoza jasonmelgoza

🏠
Working from home
View GitHub Profile
@mixin disable-text-selection() {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
# A simple Makefile alternative to using Grunt for your static asset compilation
#
## Usage
#
# $ npm install
#
# And then you can run various commands:
#
# $ make # compile files that need compiling
# $ make clean all # remove target files and recompile from scratch
{
"directory" : "public/components",
"json" : "component.json",
"endpoint" : "https://bower.herokuapp.com",
"searchpath" : ["https://bower.herokuapp.com"]
}

A quick visual reference to every ColorBrewer scale; colors by Cynthia Brewer. Available in CSS and JS format. Click on a palette to log the constituent colors in hexadecimal RGB to the console.

.is-truncate {
width: 250px; /** Adjust width to your needs */
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
@mixin font-size($percent, $min-font-size, $max-font-size) {
// Min
font-size: $min-font-size;
@include breakpoint($min-font-size/$percent * 100) {
font-size: #{$percent}vw;
}
@include breakpoint($max-font-size/$percent * 100) {
font-size: $max-font-size;
<script>
$(window).resize(function() {
var windowWidth = $(window).width();
$('.screen-width').text(windowWidth + 'px');
});
</script>
<div id="debug" style="position:fixed;padding:0.3em 0.6em;background:#f1f1f1;font-size:0.6em;bottom:0;left:50%;">
<span class="screen-width">0</span>
</div>
// http://css-tricks.com/transitions-only-after-page-load/
.preload *
-webkit-transition: none !important
-moz-transition: none !important
-ms-transition: none !important
-o-transition: none !important