fix minor styling issues

components/MiniTechTalkCard.module.css

@@ -11,7 +11,6 @@
 .card aside {
   max-width: calc(142rem / 16);
   margin-right: calc(45rem / 16);
-  /* background-color: pink; */
 }
 
 .card aside img {
@@ -24,8 +23,10 @@
   padding: calc(4rem / 16);
 }
 
-.content h3 {
+.content h1 {
   margin-block-start: 4px;
+  margin: 0;
+  font-size: calc(18rem / 16);
 }
 
 .card section {

components/MiniTechTalkCard.tsx

@@ -1,23 +1,19 @@
-import React, { ReactNode } from "react";
+import React from "react";
 import { Image } from "./Image";
 import styles from "./MiniTechTalkCard.module.css";
 
-interface TechTalkProps {
+interface MiniTechTalkProps {
   name: string;
   short: string;
   poster?: string;
-  children: ReactNode;
 }
 
-export function MiniTechTalkCard({ name, poster, short }: TechTalkProps) {
+export function MiniTechTalkCard({ name, poster, short }: MiniTechTalkProps) {
   return (
     <article className={styles.card}>
-      <aside>
-        {poster && <Image alt={name} src={poster} />}
-        {!poster && <div className={styles.spacer}></div>}
-      </aside>
+      <aside>{poster && <Image alt={name} src={poster} />}</aside>
       <section className={styles.content}>
-        <h3>{name}</h3>
+        <h1>{name}</h1>
         <p>{short}</p>
       </section>
     </article>

components/TechTalkCard.module.css

@@ -20,7 +20,7 @@
   margin-top: calc(76rem / 16);
 }
 
-.card h2 {
+.card h1 {
   font-size: calc(24rem / 16);
   font-weight: 700;
   font-style: normal;

components/TechTalkCard.tsx

@@ -18,7 +18,7 @@ export function TechTalkCard({ name, poster, children }: TechTalkProps) {
           {!poster && <div className={styles.spacer}></div>}
         </aside>
         <section className={styles.content}>
-          <h2>{name}</h2>
+          <h1>{name}</h1>
           <div>{children}</div>
         </section>
       </section>

components/playground.module.css

@@ -88,7 +88,7 @@
 }
 
 .miniTechTalkDemo > *:nth-child(odd) {
-  background: rgb(78, 212, 178, 0.3);
+  background: var(--background-teal-2);
 }
 
 @media only screen and (max-width: calc(768rem / 16)) {

content/playground/temp.talk.mdx

@@ -13,7 +13,7 @@ it was never meant for. This will be an unprepared, impromptu talk with no slide
 into a little-heard-of technique, or an impenetrable mess of jargon and algorithms. Either way, it should be fun. Professor
 Richards is the maintainer of the netplay infrastructure for RetroArch, a popular emulator frontend for multiple platforms.
 
-## Download
+# Download
 
 - BitTorrent:[Netplay in Emulators (mp4)]
 - HTTP (web browser):[Netplay in Emulators (mp4)]

pages/_app.css

@@ -18,6 +18,7 @@ body {
     #1481e3 -17.95%,
     #4ed4b2 172.82%
   );
+  --background-teal-2: rgb(78, 212, 178, 0.2);
 
   color: var(--black);
   font-family: "Poppins", "sans-serif";