Skip to content

Instantly share code, notes, and snippets.

Avatar

Andrew Clark acdlite

View GitHub Profile
@acdlite
acdlite / gist:9168073
Last active Aug 29, 2015
Sass/Compass mixin for diagonal stripe pattern backgrounds
View gist:9168073
@mixin diagonal-stripe-pattern-background($color-1, $color-2, $ratio, $size) {
$ratio: percentage($ratio / 2);
@include background(linear-gradient(-45deg,
$color-1 (50% - $ratio),
$color-2 (50% - $ratio),
$color-2 50%, $color-1 50%,
$color-1 (100% - $ratio),
$color-2 (100% - $ratio)));
@include background-size($size $size);
}
@acdlite
acdlite / SassMeister-input.scss
Created Mar 10, 2014
Generated by SassMeister.com.
View SassMeister-input.scss
// ----
// Sass (v3.3.3)
// Compass (v1.0.0.alpha.18)
// Sassy Maps (v0.3.2)
// ----
@import "sassy-maps";
$__namespaces: ();
@acdlite
acdlite / SassMeister-input.scss
Created Jul 18, 2014
Generated by SassMeister.com.
View SassMeister-input.scss
// ----
// Sass (v3.3.10)
// Compass (v1.0.0.alpha.20)
// Base.Sass (v1.3.3)
// ----
@import "compass";
@import "base.sass/*";
@acdlite
acdlite / SassMeister-input.scss
Created Jul 18, 2014
Generated by SassMeister.com.
View SassMeister-input.scss
// ----
// Sass (v3.3.10)
// Compass (v1.0.0.alpha.20)
// Base.Sass (v1.3.3)
// ----
@import "base.sass/*";
$anonymous-placeholders: ();
View gist:d1c1b7bc95e5f869424d
class Store {
constructor(state = {}) {
this.state = state;
}
getState() {
return this.state;
}
}
@acdlite
acdlite / gist:dfbac9ed62474e1be605
Created Apr 1, 2015
Create Flummox actions from plain JavaScript objects
View gist:dfbac9ed62474e1be605
const flux = new Flux();
flux.createActions('foobar', {
foo() {
return 'bar';
},
bar() {
return 'baz';
}
@acdlite
acdlite / gist:c7eb7ac45617d9332b60
Last active Aug 29, 2015
Imagining a more functional, classless Flummox API
View gist:c7eb7ac45617d9332b60
import Flummox from 'flummox';
import { Map } from 'immutable';
// Instead of a constructor, just wrap flux creation inside a function
export default function createFlux() {
const flux = new Flummox();
// Actions are the same. Just pass an object instead of a class.
const thingActions = flux.createActions('things', {
incrementSomething(amount) {
@acdlite
acdlite / gist:1168dd2c3cbd8e4cb477
Last active Aug 29, 2015
Potential redux-react-router API
View gist:1168dd2c3cbd8e4cb477
function reactRouter(router) {
return (reducer, initialState) => next => {
const baseStore = next(reducer, initialState);
function storeIsInSyncWithRouter() {
//... blah blah implementation details
}
// Apply router middleware which intercepts TRANSITION_TO actions
const wrappedDispatch = routerMiddleware(router)()(baseStore.dispatch);
@acdlite
acdlite / SassMeister-input.scss
Created Aug 22, 2015
Generated by SassMeister.com.
View SassMeister-input.scss
// ----
// libsass (v3.2.5)
// ----
.foo :global(.some-ovid-class) .bar {
color: blue;
}
@acdlite
acdlite / _color.scss
Last active Dec 27, 2015
Experiment using Sass maps to handle project-level configuration.
View _color.scss
$brand-color: (
red: #cf383a,
blue: #1f98d4,
yellow: #e4cb14,
white-eggshell: #f2efe2,
white: #000000,
black: #ffffff
);
// Returns brand color