Fix dark and medication screenshots

This commit is contained in:
2026-08-26 20:48:04 -04:00
parent 96d152f592
commit 2b436eeec6
6 changed files with 8 additions and 7 deletions
+2 -2
View File
@@ -148,8 +148,8 @@ export default function HowItWorksPage() {
<div className="grid gap-12 lg:grid-cols-2 lg:items-center">
<div className="justify-self-center py-2 lg:order-1">
<PhoneMockup
src="/screenshots/product-bezel-2026-08-24-unified-type/medication-detail-natural.webp"
darkSrc="/screenshots/product-bezel-2026-08-24-unified-type/medication-detail-natural-dark.webp"
src="/screenshots/product-bezel-2026-08-24-unified-type/medication-detail-lisinopril-natural.webp"
darkSrc="/screenshots/product-bezel-2026-08-24-unified-type/medication-detail-lisinopril-natural-dark.webp"
alt="Illustrative Medscribe medication detail"
width={280}
/>
+2 -2
View File
@@ -254,8 +254,8 @@ export default function HomePage() {
<div className="relative mx-auto h-[42rem] w-full max-w-2xl sm:h-[50rem] lg:h-[56rem]">
<div className="absolute top-20 left-[4%] w-[17rem] -rotate-6 sm:w-[21rem] lg:w-[23rem]">
<ProductDevice
src="/screenshots/product-bezel-2026-08-24-unified-type/medication-detail-natural.webp"
darkSrc="/screenshots/product-bezel-2026-08-24-unified-type/medication-detail-natural-dark.webp"
src="/screenshots/product-bezel-2026-08-24-unified-type/medication-detail-lisinopril-natural.webp"
darkSrc="/screenshots/product-bezel-2026-08-24-unified-type/medication-detail-lisinopril-natural-dark.webp"
alt="Medscribe medication detail in an iPhone 17 Pro product bezel"
className="pitch-device-motion pitch-device-drift-left"
sizes="(min-width: 1024px) 368px, (min-width: 640px) 336px, 272px"
+2 -2
View File
@@ -44,9 +44,9 @@ const features = [
"Bring important questions to a clinician or pharmacist",
],
image:
"/screenshots/product-bezel-2026-08-24-unified-type/medication-detail-natural.webp",
"/screenshots/product-bezel-2026-08-24-unified-type/medication-detail-lisinopril-natural.webp",
darkImage:
"/screenshots/product-bezel-2026-08-24-unified-type/medication-detail-natural-dark.webp",
"/screenshots/product-bezel-2026-08-24-unified-type/medication-detail-lisinopril-natural-dark.webp",
alt: "Illustrative Medscribe medication detail with schedule and medication information",
},
{
+2 -1
View File
@@ -38,13 +38,14 @@ export function ProductDevice({
const darkProps = darkSrc
? getImageProps({ src: darkSrc, ...shared }).props
: null;
const darkSrcSet = darkProps?.srcSet ?? darkProps?.src;
return (
<picture className="block">
{darkProps ? (
<source
media="(prefers-color-scheme: dark)"
srcSet={darkProps.srcSet}
srcSet={darkSrcSet}
sizes={darkProps.sizes}
/>
) : null}