computer-scienceangular-roadmapbackend-roadmapblockchain-roadmapdba-roadmapdeveloper-roadmapdevops-roadmapfrontend-roadmapgo-roadmaphactoberfestjava-roadmapjavascript-roadmapnodejs-roadmappython-roadmapqa-roadmapreact-roadmaproadmapstudy-planvue-roadmapweb3-roadmap
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
39 lines
1.1 KiB
39 lines
1.1 KiB
--- |
|
import type { VideoFileType } from '../lib/video'; |
|
import YouTubeAlert from './YouTubeAlert.astro'; |
|
|
|
export interface Props { |
|
video: VideoFileType; |
|
} |
|
|
|
const { video } = Astro.props; |
|
const { frontmatter, author } = video; |
|
--- |
|
|
|
<div class='border-b bg-white py-5 sm:py-12'> |
|
<div class='container text-left sm:text-center'> |
|
<p |
|
class='hidden items-center justify-start text-gray-400 sm:flex sm:justify-center' |
|
> |
|
<a |
|
href={`/authors/${author.id}`} |
|
class='inline-flex items-center font-medium hover:text-gray-600 hover:underline' |
|
> |
|
<img |
|
alt={author.frontmatter.name} |
|
src={author.frontmatter.imageUrl} |
|
class='mr-2 inline h-5 w-5 rounded-full' |
|
/> |
|
{author.frontmatter.name} |
|
</a> |
|
<span class='mx-1.5'>·</span> |
|
<span class='capitalize'>Illustrated Video</span> |
|
</p> |
|
<h1 class='my-0 text-2xl font-bold sm:my-3.5 sm:text-5xl'> |
|
{frontmatter.title} |
|
</h1> |
|
<p class='text-md hidden text-gray-400 sm:block'> |
|
{frontmatter.description} |
|
</p> |
|
</div> |
|
</div>
|
|
|