clean up <Video /> props

components/CodeBlock/CodeBlock.module.css

@@ -2,7 +2,6 @@
 .code {
   font-size: 0.925em;
   color: var(--code-text);
-  tab-size: 2;
   page-break-inside: avoid;
   background-color: var(--code-background);
   border: 1px solid var(--kinda-light);
@@ -28,6 +27,7 @@
   display: block;
   overflow-x: auto;
   padding: 1em;
+  tab-size: 2;
 }
 
 .copy_btn {
@@ -56,7 +56,7 @@
   margin-right: 3em;
 }
 
-.highlight > :global(.code-line.line-number::before) {
+.highlight > :global(.line-number::before) {
   display: inline-block;
   width: 1.5em;
   margin-right: 1.5em;

components/Video/Video.tsx

@@ -5,22 +5,25 @@ import type { FilePlayerProps } from "react-player/file";
 import styles from "./Video.module.css";
 
 export type VideoProps = Partial<FilePlayerProps> & {
-  webm?: string;
-  mp4?: string;
+  src: {
+    // at least one is required:
+    webm?: string;
+    mp4?: string;
+  };
   thumbnail?: string;
   subs?: string;
   autoplay?: boolean;
   className?: string;
 };
 
-const Video = ({ webm, mp4, thumbnail, subs, autoplay, className, ...rest }: VideoProps) => {
+const Video = ({ src, thumbnail, subs, autoplay, className, ...rest }: VideoProps) => {
   const url = [
-    webm && {
-      src: webm,
+    src.webm && {
+      src: src.webm,
       type: "video/webm",
     },
-    mp4 && {
-      src: mp4,
+    src.mp4 && {
+      src: src.mp4,
       type: "video/mp4",
     },
   ];