Skip to content

Instantly share code, notes, and snippets.

@brookback
brookback / settings.json
Created September 20, 2018 13:25
Johan's VS Code settings
{
"javascript.showUnused": false,
"typescript.showUnused": false,
"telemetry.enableTelemetry": false,
"atomKeymap.promptV3Features": true,
"editor.multiCursorModifier": "ctrlCmd",
"editor.formatOnPaste": false,
"editor.tabSize": 2,
"workbench.startupEditor": "newUntitledFile",
"editor.fontFamily": "Fira Mono, Menlo, Monaco, 'Courier New', monospace",

Allmänt

  • Tycker body-texten ska ha en brunare/jordigare ton. För mycket svart nu.
  • Har du provat med centerjusterad text i sektionen "Komplement, eller helt ny garderob"?
  • Tycker du kan blåsa upp rubriken i hero lite. Låt den ta lite plats! Kontrast! Tycker iofs du kan förstora alla rubriker nu när jag ser resten. Låt dem även ha samma fadeade ton som huvudrubriken.

Random/copy

  • Lite newb med gmail-adress.
  • Ingen spacing mellan hyphen i telefonnummer
import React from 'react';
interface Props {
onAddTodo: (newDescription: string) => void;
}
export const MyForm = (props: Props) => {
const handleSubmit = (evt) => {
evt.preventDefault();
/*
BUTTONS
----------------------------------------------------------------*/
.btn {
--background: theme('colors.blue-60');
--text: #fff;
--text-hover: #fff;
--text-active: #e4e4e4;
--focused: color(theme('colors.blue-70'));
import React, { useEffect, useState, useCallback } from 'react';
import { render } from 'react-dom';
import { run } from 'frap';
import xs, { Stream } from 'xstream';
import { useStream } from './util';
import { State, View, startState } from './main.ts';
/** Our 'send' function signature. */
type Send = (event: View) => void;
@brookback
brookback / README.md
Last active May 13, 2019 09:14
A React hook for getting a single boolean value for when pairs in an array change.

useHasChanged

import React, { useState } from 'react';

interface Props {
  text: string;
}

const MyComponent = (props: Props) => {
@brookback
brookback / index.tsx
Last active July 8, 2019 13:48
A React component which supports Markdown, emojis, and @mentions.
import * as React from 'react';
import * as unified from 'unified';
import { useContext } from 'react';
import classNames from '../libs/classNames';
import mentions from './remark-mentions';
import { StateContext } from '..';
import { traverseMentions } from '../traverse-mentions';
import { User } from '../types';
[alias]
# View commits in local branch vs. master
current = !"git log $(git rev-parse --abbrev-ref HEAD) ^master --no-merges"
# View unpushed commits
unpushed = !git log @{u}..HEAD
# View all unpushed commits on all branches
all-unpushed = !git log --branches --not --remotes --oneline
# View latest unpushed commits on all branches
unpushed-branches = !git log --branches --not --remotes --oneline --decorate --simplify-by-decoration
@brookback
brookback / query.js
Last active October 28, 2019 07:55
Conditionally fetching a GraphQL field based on the presence of required variable.
/*
This query will crash when run if incoming userId prop is undefined. It's because
it's marked as required for the `user(id)` field. So that will force me to mark it
as required as a variable in my `Foo` client query below.
But I want to *conditionally* include the whole user field if only if userId prop
is a string in the component.
How?!
const easeInOutQuad = (t) => t<.5 ? 2*t*t : -1+(4-2*t)*t
const easeInOutCubic = (t) => t<.5 ? 4*t*t*t : (t-1)*(2*t-2)*(2*t-2)+1
const easeInOutQuart = (t) => t<.5 ? 8*t*t*t*t : 1-8*(--t)*t*t*t
const easeInOutQuint = (t) => t<.5 ? 16*t*t*t*t*t : 1+16*(--t)*t*t*t*t
// OLIKA FUNKTIONER