perf(images): convert remaining <img> tags to next/image project-wide
Clears every remaining @next/next/no-img-element warning — automatic responsive srcset, lazy-loading, and format optimization instead of always loading the original file at full size. Fixed-size icons got explicit width/height; dynamic-aspect photos got fill inside a relative wrapper.
This commit is contained in:
+9
-2
@@ -1,5 +1,6 @@
|
||||
import type { Metadata } from "next";
|
||||
import Link from "next/link";
|
||||
import Image from "next/image";
|
||||
import { Reveal, RevealGroup, RevealItem } from "./components/Reveal";
|
||||
import { Footer } from "./components/Footer";
|
||||
import { TrustRow } from "./components/TrustRow";
|
||||
@@ -116,9 +117,12 @@ export default function NotFound() {
|
||||
actual photographed/rendered note rather than recreating its
|
||||
handwriting in CSS. */}
|
||||
<Reveal delay={0.15} className="w-full lg:flex-1 flex items-center justify-center">
|
||||
<img
|
||||
<Image
|
||||
alt="Sticky Note: 404. Nicht hier. Aber dein Ziel ist sicher nicht weit."
|
||||
src="/404-sticky-note.png"
|
||||
width={600}
|
||||
height={689}
|
||||
sizes="(min-width: 1024px) 22rem, 100vw"
|
||||
className="w-full max-w-[22rem] rotate-2 hover:rotate-0 transition-transform duration-300"
|
||||
/>
|
||||
</Reveal>
|
||||
@@ -178,9 +182,12 @@ export default function NotFound() {
|
||||
the flat mockup image instead of in Figma. */}
|
||||
<Reveal className="relative w-full flex items-stretch h-[14rem] md:h-[16rem] bg-bg-muted overflow-hidden">
|
||||
<div className="relative w-full md:w-[45%] shrink-0">
|
||||
<img
|
||||
<Image
|
||||
alt=""
|
||||
src="/404-testimonial-photo.jpg"
|
||||
width={810}
|
||||
height={291}
|
||||
sizes="(min-width: 768px) 45vw, 100vw"
|
||||
className="absolute -inset-1 w-[calc(100%+0.5rem)] h-[calc(100%+0.5rem)] object-cover"
|
||||
/>
|
||||
<div className="hidden md:block absolute inset-y-0 right-0 w-40 bg-gradient-to-l from-bg-muted to-transparent" />
|
||||
|
||||
Reference in New Issue
Block a user