Skip to content

Instantly share code, notes, and snippets.


Daniel Eden daneden

View GitHub Profile
View Color.extension.swift
// Color.extension.swift
// Zeitgeist
// Created by Daniel Eden on 30/12/2020.
// Copyright © 2020 Daniel Eden. All rights reserved.
import Foundation
import SwiftUI
View rgbaToHexConsole.js
// $0 is web inspector's reference to the current element
// run a regex to get the values for r, g, b, and optionally a
.match(/rgba?\((\d{1,3}), ?(\d{1,3}), ?(\d{1,3})(, ?([0-9.]{1,3}))?\)/)
// filter out the regex results we don't care about
.filter((e, i) => {
switch (i) {
case 1: // red
case 2: // green
case 3: // blue
# Checkout master branch
git checkout master
# Rename "master" to "main"
git branch -m master main
# Unset the current upstream branch
git branch --unset-upstream
View Timer.swift
import SwiftUI
import Combine
struct HMS {
var h: Int
var m: Int
var s: Int
struct ContentView: View {

git clone and cd function

A simple little alias function that lets you clone and cd into a GitHub repo in one command.


Add to your zsh or bash config (usually ~/.bash_profile or ~/.zshrc) and open a new terminal to be able to use the function.


gcd [github_repo_owner/repo_name]
View js-is-weird.js
// I learned in this post (
// that arguments passed to a function run before the function itself:
* // This runs second
* outerFunction(
* // This runs first
* innerFunction()
* )
// This makes sense. But I wondered what it looked like in practice.

Grid Breakpoint API Dilemma

We want a responsive grid API that allows for an arbitrary number of breakpoints to be defined, but there's an issue with how the breakpoint extremities are treated. Given the following API:

<Grid breakpoints={[300, 600, 900]}>
  <Column width={[1, 1/2, 1/4]} />
View config.yml
name: github
repo: daneden/
publish_mode: editorial_workflow
- name: blog
label: "Blog"
folder: "src/blog"
daneden / Component.js
Last active Aug 5, 2018
styled-components will generate duplicative style declarations when props change the value for a rule. This is fine for e.g. the example below, where the ruleset is already small, but what if we have a dozen or more common styles for the two variants?
View Component.js
const Component = styled.div`
display: inline-block;
color: ${props => ? 'red' : 'green'};
export default Component

layout: recipe title: Seared Salmon with Spinach and Walnut Salad hero: /uploads/2016/05/salmon.jpg

intro: This salad is a fantastically easy worknight dinner inspired by a dish from Réveille Coffee. Toasting the walnuts is completely optional, but if you can spare the couple extra minutes, it enhances their flavor and helps round out the dish.