Evandro Fonseca Junior
8d07b8c6bb
Home mais curta (hero, vitrine de clientes, sobre, serviços, IA resumida, depoimentos e contato), faixa de clientes e telas reais no hero, sem números do GitHub. Barra de cookies fina, WhatsApp fixo no celular, formulário com e-mail opcional e alternativa por e-mail, página /ia, eventos de e-mail, redes e currículo e conversão do Ads opcional por variável. Rodapé em 3 colunas. Remove componentes órfãos (LighthouseMetrics, Skills, Experience, contagem do GitHub).
55 lines
2.3 KiB
TypeScript
55 lines
2.3 KiB
TypeScript
import { getShowcaseAssets } from "@/lib/project-showcase";
|
|
import { BrowserFrame } from "./showcase/BrowserFrame";
|
|
import { PhoneFrame } from "./showcase/PhoneFrame";
|
|
import "./showcase/showcase.css";
|
|
|
|
/** Endereço mostrado na barra do navegador (mesmo formato de displayUrl em showcase/BrowserFrame). */
|
|
export type HeroWorkUrl = { text: string; secure: boolean } | null;
|
|
|
|
const DESKTOP_PROJECT = "lavacao-047";
|
|
const MOBILE_PROJECT = "as-servicos";
|
|
|
|
/**
|
|
* Trabalho real ao lado do título, só em telas de 1024 px ou mais: o pôster do site da Lavação 047 no navegador
|
|
* e o do aplicativo da AS Serviços no celular. A coluna inteira fica escondida (display: none) abaixo disso,
|
|
* então as imagens (lazy) nem são baixadas no celular, e elas são menores que o título para o H1 seguir como maior elemento.
|
|
*/
|
|
export default function HeroWork({ url = null }: { url?: HeroWorkUrl }) {
|
|
const desktop = getShowcaseAssets(DESKTOP_PROJECT, "desktop");
|
|
const phone = getShowcaseAssets(MOBILE_PROJECT, "mobile");
|
|
|
|
return (
|
|
<div
|
|
data-testid="hero-work"
|
|
className="hero-in pointer-events-none absolute right-sp-12 bottom-sp-8 hidden w-[clamp(300px,24vw,400px)] [--d:.8s] lg:block"
|
|
>
|
|
<BrowserFrame url={url} className="w-[88%]">
|
|
{/* biome-ignore lint/performance/noImgElement: pôster de 1440 px já otimizado em /public/videos; next/image pediria o otimizador para um arquivo menor que o necessário */}
|
|
<img
|
|
src={desktop.poster}
|
|
alt="Site da Lavação 047 aberto no computador"
|
|
width={desktop.width}
|
|
height={desktop.height}
|
|
loading="lazy"
|
|
decoding="async"
|
|
fetchPriority="low"
|
|
className="block h-auto w-full"
|
|
/>
|
|
</BrowserFrame>
|
|
<PhoneFrame className="absolute right-0 bottom-[-12%] w-[34%]">
|
|
{/* biome-ignore lint/performance/noImgElement: mesmo motivo do pôster desktop */}
|
|
<img
|
|
src={phone.poster}
|
|
alt="Site da AS Serviços aberto no celular"
|
|
width={phone.width}
|
|
height={phone.height}
|
|
loading="lazy"
|
|
decoding="async"
|
|
fetchPriority="low"
|
|
className="absolute inset-0 block h-full w-full object-cover object-top"
|
|
/>
|
|
</PhoneFrame>
|
|
</div>
|
|
);
|
|
}
|