Skip to content

Instantly share code, notes, and snippets.

@martynchamberlin
martynchamberlin / scrollbars.md
Last active March 28, 2024 09:40
On the Width of Scroll Bars on Mac and Windows

How It Works on Mac

By default, scroll bars do not appear on Mac except when the user is scrolling and when there is hidden content. You can double check this by going to System Preferences -> General -> Show scroll bars: Automatically based on mouse or trackpad.

When you do scroll, the width of viewport and the available width of the inner content does not change from what it was. If the width was 300 pixels, it still is 300 pixels.

If you change the "Show scroll bars" setting to "Always" then the scrollbar takes up a decided amount of width - 16 pixels to be precise.[^1] Let's say your browser height is 300 pixels and your broswer width is also 300 pixels. With this setting, if you toggle the height of the body from 300 to 600, causing scrollableness, then a scrollbar will appear only have you have done the toggle. The width of your body will have gone from 300 to 284 pixels, because the scrollbar takes up space in a way that it did not in the other setting. Interestingly, if you're talking about

@OrionReed
OrionReed / DOM3D.js
Last active March 28, 2024 09:40
3D DOM viewer, copy-paste this into your console to visualise the DOM topographically.
// 3D Dom viewer, copy-paste this into your console to visualise the DOM as a stack of solid blocks.
// You can also minify and save it as a bookmarklet (https://www.freecodecamp.org/news/what-are-bookmarklets/)
(() => {
const SHOW_SIDES = false; // color sides of DOM nodes?
const COLOR_SURFACE = true; // color tops of DOM nodes?
const COLOR_RANDOM = false; // randomise color?
const COLOR_HUE = 190; // hue in HSL (https://hslpicker.com)
const MAX_ROTATION = 180; // set to 360 to rotate all the way round
const THICKNESS = 20; // thickness of layers
const DISTANCE = 10000; // ¯\\_(ツ)_/¯
@mabster
mabster / AutoTemplateSelector.cs
Created January 13, 2012 02:11
WPF Dynamic DataTemplates
using System;
using System.Collections;
using System.ComponentModel;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
namespace WpfApplication8
@vtenq
vtenq / git-workflow.md
Last active March 28, 2024 09:38
Git workflow with conventional commits and semantic auto release

Git workflow with conventional commits and semantic auto release

This is an adoptation of Git flow by Vincent Driessen with conventional commits and semantic release.

The main concepts

At the core, the development model is greatly inspired by existing models out there. The central repo holds two main branches with an infinite lifetime:

@Arcensoth
Arcensoth / characters.md
Created February 20, 2021 19:50
Minecraft Special Characters

image

tellraw @a "\n  ① ② ③ ④ ⑤ ⑥ ⑦ ⑧ ⑨ ⑩ ⑪ ⑫ ⑬ ⑭ ⑮ ⑯ ⑰ ⑱ ⑲ ⑳"
tellraw @a "\n  Ⓐ Ⓑ Ⓒ Ⓓ Ⓔ Ⓕ Ⓖ Ⓗ Ⓘ Ⓙ Ⓚ Ⓛ Ⓜ Ⓝ Ⓞ Ⓟ Ⓠ Ⓡ Ⓢ Ⓣ Ⓤ Ⓥ Ⓦ Ⓧ Ⓨ Ⓩ"
tellraw @a "\n  ⓐ ⓑ ⓒ ⓓ ⓔ ⓕ ⓖ ⓗ ⓘ ⓙ ⓚ ⓛ ⓜ ⓝ ⓞ ⓟ ⓠ ⓡ ⓢ ⓣ ⓤ ⓥ ⓦ ⓧ ⓨ ⓩ"
tellraw @a "\n  ░ ▒ ▓ │ ┤ ╡ ╢ ╖ ╕ ╣ ║ ╗ ╝ ╜ ╛ ┐ └ ┴ ┬ ├ ─ ┼ ╞ ╟ ╚ ╔ ╩ ╦ ╠ ═ ╬ ╧ ╨ ╤ ╥ ╙ ╘ ╒ ╓ ╫ ╪ ┘ ┌ █ ▄ ▌ ▐ ▀"
tellraw @a "\n  ☲ ☵ ☰ ☱ ☳ ☴ ☶ ☷ ⅒ ⅘ ⅛ ⅜ ⅝ ⅞ ⅓ ⅔ ⅐ ⅑ ⅕ ⅖ ⅗ ⅙ ⅚ ⅟ ↉"
tellraw @a "\n  ⁰ ¹ ³ ⁴ ⁵ ⁶ ⁷ ⁸ ⁹ ⁺ ⁻ ⁼ ⁽ ⁾ ₀ ₁ ₂ ₃ ₄ ₅ ₆ ₇ ₈ ₉ ₊ ₋ ₌ ₍ ₎"
tellraw @a "\n ∅ ∈ ≡ ± ≥ ≤ ⌠ ⌡ ÷ ≈ ° ∙ · √ ⁿ ² ■ ☈ Є ∫ ∮ − ∓ ∞ ∝ ⌀ ⌂ ⌘ 〒 ↔ ⇒ ⇏ ⇔ ⇵"
@dmnsgn
dmnsgn / WebGL-WebGPU-frameworks-libraries.md
Last active March 28, 2024 09:37
A collection of WebGL and WebGPU frameworks and libraries

A non-exhaustive list of WebGL and WebGPU frameworks and libraries. It is mostly for learning purposes as some of the libraries listed are wip/outdated/not maintained anymore.

Engines and libraries ⚙️

Name Stars Last Commit Description
three.js ![GitHub
'use client'
import { useRef, useState } from 'react'
import DottedMap from 'dotted-map/without-countries'
import { intlFormatDistance } from 'date-fns'
import { AnimatePresence, motion } from 'framer-motion'
import { Clock } from 'lucide-react'
import {
Popover,
PopoverContent,
@jjmartres
jjmartres / how-to-shrink-a-wsl2-virtual-disk.md
Last active March 28, 2024 09:36
How to Shrink a WSL2 Virtual Disk

How to Shrink a WSL2 Virtual Disk

Before you begin

Before shrinking a WSL2 virtual disk, you need to ensure that WSL2 is not running.

You can check if it’s running with the command wsl.exe --list --verbose in PowerShell:

PS C:\Users\valorin> wsl.exe --list --verbose
 NAME STATE VERSION
@precyx
precyx / generate_office_app_links.ts
Last active March 28, 2024 09:35
Generate Office App Links for: - Word - Powerpoint - Excel - Visio - Project - Publisher