Add note on videos

notes/1700564268239.md

@@ -0,0 +1,20 @@
+In [`9542c6da`](https://github.com/healeycodes/healeycodes.com/commit/9542c6da0a387b275c25b8f979c63c9688d8cbee) I added video support in posts on this website!
+
+My use-case is small looping .mp4 files without controls (without sound, so they can autoplay).
+
+```tsx
+<video
+  style={{ display: 'block', margin: '0 auto', maxWidth: '100%' }}
+  key={props.src}
+  controls={false}
+  autoPlay
+  playsInline
+  loop
+  muted
+  width={videoMetadata[props.src].width}
+  height={videoMetadata[props.src].height}>
+  <source src={`/posts/${id}/${props.src}`} type="video/mp4"></source>
+</video>
+```
+
+I get the video metadata from a library called [mp4box](https://www.npmjs.com/package/mp4box) during my build step.