Skip to content

Instantly share code, notes, and snippets.

Avatar
🌚

Patrick Michaelsen prmichaelsen

🌚
View GitHub Profile
@prmichaelsen
prmichaelsen / Img.tsx
Last active Aug 12, 2022
renders an image element that dynamically updates its bottom margin s.t. it always has a total height that is some multiple of 1.5em
View Img.tsx
import React, {
useEffect, useRef,
useState, useCallback,
} from 'react';
export function useResize() {
const getSize = () => {
return {
width: window.innerWidth,
height: window.innerHeight
View easyFormat.ts
#!/usr/bin/env ts-node
const grades: [number, string][] = [
[96, 'A+'],
[93, 'A' ],
[90, 'A-'],
[86, 'B+'],
[83, 'B '],
[80, 'B-'],
[76, 'C+'],
@prmichaelsen
prmichaelsen / formatLetterGrade.ts
Last active Jul 4, 2022
formats letter grades using [threshold, character] pairs
View formatLetterGrade.ts
#!/usr/bin/env ts-node
const thresholds = [
90,
80,
70,
60,
0,
];
View youtube-video-inversion.js
/**
resources referred when writing this script:
- https://gitlab.com/MPuschi/lotr-skip/-/blob/main/skip.js
- https://codepen.io/wellingguzman/pen/XqYqmG
- https://stackoverflow.com/questions/5235145/changing-source-on-html5-video-tag
*/
// Create Video and Canvas-Element
var canvas = document.createElement("canvas");
View schema.json
{
"$schema": "http://json-schema.org/draft-04/schema#",
"title": "$id$",
"description": "WidgetGroupConfig_2-15",
"type": "object",
"additionalProperties": false,
"required": [
"widgetGroupId",
"cti",
"configurations"
View cat grad school tabs.md
F
E
Am
Dm

[verse 1]
ive got
F
two cats sleepin around in this
View all-the-kings-men.md
# script
# the king
# tags power

EXT. DAY - a country side manor

-
scene:
chickens forage,
View sample.md

Some text

some text that should be styled as a quote, but no larger a font than normal text

Some more text

View copy-paste.md

Opinion

Stop making text in your applications unselectable.

Copying and pasting is one of the most common things a user will do to any text you display in your application. Here are some things that applications do that make this difficult or impossible:

  • override mobile select function to select entire "blocks" of text for copying, for instance, news articles.
  • trigger some action on click, such as expanding a table row or launching an edit modal on click. Another example is launching a directions app on address click.
  • misusing the input html element to display summary text by adding "disabled" and therefore stopping a user from selecting the text
View snippet-2.js
function getParticipantNames() {
// Because queries are cached, using the `allParticipants` query
// prevents another roundtrip to the database
const participants = database.getAllParticipants();
return participants.map(p => p.name);
}