Skip to content

Instantly share code, notes, and snippets.

Samuel Holt samuel-holt

Block or report user

Report or block samuel-holt

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@samuel-holt
samuel-holt / app.jsx
Created Oct 11, 2017
React Error boundaries
View app.jsx
import { Dashboard, DashboardPanel } from './dashboard';
import { getStore } from './store';
import { ErrorBoundaryAppContainer } from './errorBoundary';
class App extends React.Component {
state = {
currentStore: getStore(),
numPanels: 7
};
View charts.js
import c3 from 'c3';
export function charts() {
const errorChart = c3.generate({
bindto: '.js-chart',
data: {
x: 'date',
y: 'errors',
url: './data/dummydata.json',
@samuel-holt
samuel-holt / _mixins.scss
Last active Nov 23, 2016
Responsive typography
View _mixins.scss
// STRIP UNIT
// It strips the unit of measure and returns it
@function strip-unit($num) {
@return $num / ($num * 0 + 1);
}
// Media queries mixin
// Default widths
$default-medium: 768px !default;
@samuel-holt
samuel-holt / _color-palette.scss
Last active Nov 6, 2017
Dynamic color palette mixin
View _color-palette.scss
// =================================
// Color palette generator
// =================================
// Muck around with colors here:
$primary-color: salmon;
// A global to store the palette(s)
$global-color-palettes: () !global;
View _rem-font.scss
$legacy-support: ie8 ie9 !default;
// This is the default html and body font-size for the base rem value.
$rem-base: 16px !default;
$line-height-base: 1.8 !default;
// REM calculation courtesy of Zurb Foundation :)
// CONVERT TO REM
@function convert-to-rem($value, $base-value: $rem-base) {
@samuel-holt
samuel-holt / _font.scss
Created Nov 20, 2014
Full font face generator mixin
View _font.scss
// Set defaults in parameters...
@mixin generate-font-face($font-name, $sizes:false, $font-folder-name:false, $font-file-prefix: false, $font-file-suffix: "webfont", $font-name-separator:"-", $dir-separator:"/", $formats:(woff2, ttf, svg, eot)) {
$web-font-folder-name: $font-name;
@if $font-folder-name != false {
$web-font-folder-name: $font-folder-name;
}
// default font-file prefix
You can’t perform that action at this time.