Skip to content

Instantly share code, notes, and snippets.

View maxluster's full-sized avatar

Max Luster maxluster

View GitHub Profile
@maxluster
maxluster / responsive.scss
Created May 5, 2014 19:28
Responsive SASS (SASS 3.2): Chain media queries and coordinate named breakpoints
// Created by Max Luster (@maxluster)
// Usage instructions at https://bugsnag.com/blog/responsive-typography-with-chained-media-queries
// Requires SASS 3.2, untested in older versions
// SASS 3.3 users should use: https://gist.github.com/maxluster/168e650267bac9faaafd
//Responsifies any single property across a range of named or numeric breakpoints
@mixin responsive($properties, $default-value, $value-breakpoint-lists...){
// Default set of named breakpoints. Override by setting this globally.
$named-breakpoints: "xxs" 310px, "xs" 550px, "s" 770px, "m" 1180px, "l" 1420px, "xl" 1860px, "xxl" 2200px !default;
@maxluster
maxluster / gist:2fbfee664489ac713785
Last active August 29, 2015 14:10
Sass getColor
// Via https://bugsnag.com/blog/sass-color-palettes
// .el { color: getColor(red, 0) }
$colors: (
"red": (
0 : hsl(3, 72, 62),
1 : hsl(4, 85%, 66%),
2 : hsl(4, 84%, 78%),
pastel : hsl(0, 63, 94),
dark : hsl(2, 33, 32)
par_pctile count_pooled count_aian_pooled count_asian_pooled count_black_pooled count_hisp_pooled count_white_pooled density_aian_pooled density_asian_pooled density_black_pooled density_hisp_pooled density_white_pooled kfr_aian_pooled kfr_asian_pooled kfr_black_female kfr_black_male kfr_black_pooled kfr_hisp_pooled kfr_nativemom_aian_pooled kfr_nativemom_asian_pooled kfr_nativemom_black_pooled kfr_nativemom_hisp_pooled kfr_nativemom_white_pooled kfr_pooled kfr_white_female kfr_white_male kfr_white_pooled kid_college_black_female kid_college_black_male kid_college_white_female kid_college_white_male kid_hours_black_female kid_hours_black_male kid_hours_white_female kid_hours_white_male kid_jail_black_female kid_jail_black_male kid_jail_white_female kid_jail_white_male kid_married_black_pooled kid_married_white_pooled kid_no_hs_black_female kid_no_hs_black_male kid_no_hs_white_female kid_no_hs_white_male kid_pos_hours_black_female kid_pos_hours_black_male kid_pos_hours_white_female kid_pos_hours_white_male kid
@maxluster
maxluster / responsive.scss
Last active February 4, 2019 21:24
Responsive SASS: Chain media queries and coordinate named breakpoints
// Created by Max Luster (@maxluster)
// Usage instructions at https://bugsnag.com/blog/responsive-typography-with-chained-media-queries
// Requires SASS >= 3.3
// Enhanced by Breakpoint 2.4.x and Compass 1.0 (alpha)
// For SASS 3.2.x support, use https://gist.github.com/maxluster/c9ecc6e4a6770e507c2c
// Provides a simplified syntax for chaining media queries across named or numeric breakpoints
@mixin responsive($properties, $default-value, $responsive-values){
// No named breakpoints by default