Move the use-case index onto Learn so the pilot stories stay reachable, and make share images resolve on the host that serves the page.
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
1 parent
18abeb56dd
commit
9ea3f9fd0a
27 files changed
+656
-419
No files matched your search
@@ -10,15 +10,16 @@ function ContentThumbnailTemplateView({
|
||||
sizing,
|
||||
backgroundImage,
|
||||
backgroundImageSmd,
|
||||
href,
|
||||
showByline,
|
||||
showLeadingImage,
|
||||
leadingImageAlt,
|
||||
}: ContentThumbnailTemplateViewProps) {
|
||||
if (variant === "responsive") {
|
||||
// Single card; <picture> swaps the orientation-specific image at smd
|
||||
// (530px), aspect-ratio and content positioning switch via Tailwind.
|
||||
return (
|
||||
<Link
|
||||
href={`/blog/${post.slug}`}
|
||||
className={`group block w-full ${className}`}
|
||||
>
|
||||
<Link href={href} className={`group block w-full ${className}`}>
|
||||
<div className="relative aspect-[320/225.5] w-full overflow-hidden smd:aspect-[260/390]">
|
||||
<div className="absolute inset-0 z-0">
|
||||
<picture>
|
||||
@@ -37,7 +38,13 @@ function ContentThumbnailTemplateView({
|
||||
</picture>
|
||||
</div>
|
||||
<div className="absolute left-[4.375%] top-[6.099%] z-20 w-[71.875%] max-h-[48%] overflow-hidden smd:left-[6.923%] smd:top-[4.615%] smd:w-[76.923%]">
|
||||
<ContentContainer post={post} size="xs" />
|
||||
<ContentContainer
|
||||
post={post}
|
||||
size="xs"
|
||||
showByline={showByline}
|
||||
showLeadingImage={showLeadingImage}
|
||||
leadingImageAlt={leadingImageAlt}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
@@ -47,10 +54,7 @@ function ContentThumbnailTemplateView({
|
||||
if (variant === "vertical") {
|
||||
if (sizing === "fixed") {
|
||||
return (
|
||||
<Link
|
||||
href={`/blog/${post.slug}`}
|
||||
className={`group block ${className}`}
|
||||
>
|
||||
<Link href={href} className={`group block ${className}`}>
|
||||
<div className="relative h-[390px] w-[260px] overflow-hidden">
|
||||
<div className="absolute inset-0 z-0">
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
@@ -61,7 +65,14 @@ function ContentThumbnailTemplateView({
|
||||
/>
|
||||
</div>
|
||||
<div className="absolute left-[18px] top-[18px] z-20 w-[200px]">
|
||||
<ContentContainer post={post} width="200px" size="xs" />
|
||||
<ContentContainer
|
||||
post={post}
|
||||
width="200px"
|
||||
size="xs"
|
||||
showByline={showByline}
|
||||
showLeadingImage={showLeadingImage}
|
||||
leadingImageAlt={leadingImageAlt}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
@@ -69,10 +80,7 @@ function ContentThumbnailTemplateView({
|
||||
}
|
||||
|
||||
return (
|
||||
<Link
|
||||
href={`/blog/${post.slug}`}
|
||||
className={`group block w-full ${className}`}
|
||||
>
|
||||
<Link href={href} className={`group block w-full ${className}`}>
|
||||
<div className="relative aspect-[260/390] w-full overflow-hidden">
|
||||
<div className="absolute inset-0 z-0">
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
@@ -83,7 +91,13 @@ function ContentThumbnailTemplateView({
|
||||
/>
|
||||
</div>
|
||||
<div className="absolute left-[6.923%] top-[4.615%] z-20 w-[76.923%] max-h-[48%] overflow-hidden">
|
||||
<ContentContainer post={post} size="xs" />
|
||||
<ContentContainer
|
||||
post={post}
|
||||
size="xs"
|
||||
showByline={showByline}
|
||||
showLeadingImage={showLeadingImage}
|
||||
leadingImageAlt={leadingImageAlt}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
@@ -92,7 +106,7 @@ function ContentThumbnailTemplateView({
|
||||
|
||||
if (sizing === "fixed") {
|
||||
return (
|
||||
<Link href={`/blog/${post.slug}`} className={`group block ${className}`}>
|
||||
<Link href={href} className={`group block ${className}`}>
|
||||
<div className="relative h-[225.5px] w-[320px] overflow-hidden">
|
||||
<div className="absolute inset-0 z-0">
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
@@ -103,7 +117,14 @@ function ContentThumbnailTemplateView({
|
||||
/>
|
||||
</div>
|
||||
<div className="absolute left-[14px] top-[13.75px] z-20 w-[230px]">
|
||||
<ContentContainer post={post} width="230px" size="xs" />
|
||||
<ContentContainer
|
||||
post={post}
|
||||
width="230px"
|
||||
size="xs"
|
||||
showByline={showByline}
|
||||
showLeadingImage={showLeadingImage}
|
||||
leadingImageAlt={leadingImageAlt}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
@@ -111,10 +132,7 @@ function ContentThumbnailTemplateView({
|
||||
}
|
||||
|
||||
return (
|
||||
<Link
|
||||
href={`/blog/${post.slug}`}
|
||||
className={`group block w-full ${className}`}
|
||||
>
|
||||
<Link href={href} className={`group block w-full ${className}`}>
|
||||
<div className="relative aspect-[320/225.5] w-full overflow-hidden">
|
||||
<div className="absolute inset-0 z-0">
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
@@ -125,7 +143,13 @@ function ContentThumbnailTemplateView({
|
||||
/>
|
||||
</div>
|
||||
<div className="absolute left-[4.375%] top-[6.099%] z-20 w-[71.875%] max-h-[48%] overflow-hidden">
|
||||
<ContentContainer post={post} size="xs" />
|
||||
<ContentContainer
|
||||
post={post}
|
||||
size="xs"
|
||||
showByline={showByline}
|
||||
showLeadingImage={showLeadingImage}
|
||||
leadingImageAlt={leadingImageAlt}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
|
||||
Reference in new issue
Block a user