type TableOfContentsProps = {
    id: string;
  };
  
  export function YouTube({ id }: TableOfContentsProps) {
    return (
      <section className="mt-8 flex w-full flex-col rounded bg-slate-300/50 dark:bg-slate-600/50 sm:w-fit">
        <div>
          <iframe 
            width="730" 
            height="480" 
            src={"https://www.youtube.com/embed/" + id} 
            title="YouTube video player" 
            allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" 
            >
          </iframe>
        </div>
      </section>
    );
  }