Skip to content

Instantly share code, notes, and snippets.

View ericdfields's full-sized avatar
🏠
Working from home in Baltimore, sometimes in DC

Eric Brookfield ericdfields

🏠
Working from home in Baltimore, sometimes in DC
32 followers · 27 following
View GitHub Profile
@ericdfields
ericdfields / HOCComponents.js
Last active September 28, 2016 21:36
Replace nested react component using higher order component
export class FaxDocumentViewerApp extends Component {
defaultProps = {
documentTitle: (doc) => `${doc.fax_type} — ${moment(doc.created_at).format('MMM D YYYY [@] h:mm a')}`
}
render = () => {
<OriginalComponent {...this.props} />
}
}
@ericdfields
ericdfields / app.js
Last active August 29, 2015 14:21
Resolving local UI state with Flux using Flummox and Promises
import Flux from 'path/to/flux.js'
window.MyApp.flux = new Flux()
@ericdfields
ericdfields / backspace_nav_handler_mixins.js
Last active August 29, 2015 14:19
Disable backspace navigation when textarea has content react mixin
module.exports = {
disableBackspaceNavEvent: function(event) {
if (event.keyCode == 8) {
if (event.target.type && event.target.type.match(/text/)) {
return true
} else {
event.preventDefault()
}
}
},
@ericdfields
ericdfields / gist:fb7eefadee79f3d6e30e
Created March 4, 2015 18:53
cleanUpNotifications: function() {
var now = Date.now()
var _this = this;
this.state.notifications.map(function(notification,i) {
if (now - notification.added > _this.props.cleanUpInterval) {
_this.handleRemove(i)
}
})
},
@ericdfields
ericdfields / media_queries.sass
Last active December 21, 2015 09:29
We had a mess of Sass media query mixins that needed to be streamlined into fewer, smarter media queries. Dozens of Sass partials makes this no small refactor project. I wanted to make the process of finding all the elements touched by the old media queries as painless as possible. Since I would have to spot check the entire app anyway, I came u…
// Old media query mixins looked like this:
=old-media-query
@media screen and (min-width: $value)
@content
// How could I optically find where they were being used? Replace it with this:
=old-media-query
@content
@ericdfields
ericdfields / gist:5847387
Created June 24, 2013 02:26
/good_girl_gone_blog/ -> / 301
/good_girl_gone_blog/outfits -> /posts/?category=Fashion 301
/good_girl_gone_blog/fashion -> /posts/?category=Fashion 301
/good_girl_gone_blog/home -> /posts/?category=Home 301
/good_girl_gone_blog/functional_decor -> /posts/?category=Home 301
/good_girl_gone_blog/diy -> /posts/?category=DIY 301
/good_girl_gone_blog/food -> /posts/?category=Food 301
/good_girl_gone_blog/boston -> /posts/?category=Boston 301
/good_girl_gone_blog/beauty -> /posts/?category=Beauty 301
/good_girl_gone_blog/about-me-1.html -> /about 301
@ericdfields
ericdfields / get_links.py
Created June 24, 2013 02:00
@ericdfields
ericdfields / gist:5040876
Created February 26, 2013 18:32
@function import_global($partial)
@return "@import ../global/#{$partial}"
import_global('variables')
@ericdfields
ericdfields / style.scss
Created May 25, 2012 17:13
http://ericdfields.s3.amazonaws.com/hiphost/bounce/stylesheets/screen.css scss
$duration: .75s;
$timing: linear;
$iteration: infinite;
@import "compass/css3/images";
@import "compass/css3/animation";
@import "compass/css3/transform";
$bottom-shadow-default-rotate: rotateX(82deg);
$bottom-shadow-default-scale: scale(2.5,2.5);
@ericdfields
ericdfields / HTML Example 1 (no SASS)
Created May 1, 2012 13:37
<div class="header island">
</div>
<div class="content island">
</div>
<div class="footer island">
</div>