Skip to content

Instantly share code, notes, and snippets.

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

George Treviranus geotrev

🏠
Working from home
23 followers · 29 following
View GitHub Profile
@geotrev
geotrev / lightbox.js
Created May 2, 2018 23:10
Lightbox Class
// Example:
//
// Include a link anywhere in the document:
// <a data-lightbox-button href='#' id="lightbox-1">lightbox 1</a>
//
// Then include the lightbox itself at the end of your <body> content:
// <div data-lightbox-overlay data-lightbox-1>
// <div class='lightbox-content' aria-labelledby="lightbox-heading-1" role="dialog">
// <header>
// <h2 id="lightbox-heading-1">Lightbox Heading</h2>
@geotrev
geotrev / Preferences.sublime-settings
Created November 26, 2018 21:18
Sublime Settings
// Packages:
//
// - package control
// - babel
// - bracket highlighter
// - color highlighter
// - git blame
// - gitignored file exluder
// - jsprettier
// - sass
@geotrev
geotrev / PageHeader.js
Last active February 17, 2019 22:39
An accessible page header component for SPAs.
import React, { Component } from "react"
import { withLastLocation } from "react-router-last-location"
import PropTypes from "prop-types"
class PageHeader extends Component {
constructor(props) {
super(props)
this.headerRef = React.createRef()
}
@geotrev
geotrev / AccessibleHeader.js
Last active August 15, 2019 17:46
import React from "react"
import { withLastLocation } from "react-router-last-location"
import PropTypes from "prop-types"
class AccessibleHeader extends React.Component {
constructor(props) {
super(props)
this.headerRef = React.createRef()
this.state = { tabIndex: null }
@geotrev
geotrev / SetMeta.js
Created February 20, 2019 23:59
import React from "react"
import { Helmet } from "react-helmet"
import PropTypes from "prop-types"
export default function SetMeta({ title, description }) => (
<Helmet titleTemplate="My Site | %s">
<title itemProp="name" lang="en">{title}</title>
<meta name="description" content={description} />
</Helmet>
)
@geotrev
geotrev / dom.js
Last active September 6, 2019 01:41
Simple DOM manipulator utility
export const dom = {
// Attribute manipulation
getAttr: (element, attr) => element.getAttribute(attr),
setAttr: (element, attr, value) => element.setAttribute(attr, value),
removeAttr: (element, attr) => element.removeAttribute(attr),
toggleAttr: (element, attr, forceCondition) => element.toggleAttribute(attr, forceCondition),
hasAttr: (element, attr) => element.hasAttribute(attr),
// Element selection
find: (selector, parent = document) => parent.querySelector(selector),
@geotrev
geotrev / simple-timer-mock.md
Last active January 10, 2020 17:30
timer mock 
const mockTimers = () => {
	const globalTimerFn = window.setTimeout;

	const runAllTimers = () => (window.setTimeout = (fn) => fn());
	const restoreAllTimers = () => (window.setTimeout = globalTimerFn);

	return {runAllTimers, restoreAllTimers};
};
@geotrev
geotrev / rollup.config.js
Last active February 3, 2022 01:02
Jekyll Rollup Config
import { terser } from "rollup-plugin-terser"
import path from "path"
import resolve from "rollup-plugin-node-resolve"
import babel from "rollup-plugin-babel"
import glob from "glob"
const scriptPattern = path.resolve(__dirname, "_scripts/**/!(_)*.js")
const inputs = glob.sync(scriptPattern).reduce((files, input) => {
const parts = input.split("/")
@geotrev
geotrev / config.yml
Created January 3, 2020 02:46
Circle CI Config for GH Pages
version: 2
jobs:
build:
working_directory: ~/repo-working-dir
docker:
- image: circleci/ruby:2.6.5-node-browsers
steps:
- checkout
- save_cache:
@geotrev
geotrev / deploy.sh
Created January 3, 2020 02:54
Bash Script: Auto Deploy to gh-pages Branch
#!/usr/bin/env bash
set -o nounset
set -o errexit
set -o pipefail
git config user.name "$USER_NAME"
git config user.email "$USER_EMAIL"
# Add github to known_hosts to enable push from CI