feat: complete editorial redesign of Wordly.art SaaS
All checks were successful
Deploy to Production / Build and Deploy (push) Successful in 1m31s
All checks were successful
Deploy to Production / Build and Deploy (push) Successful in 1m31s
New design system with cream/dark/copper palette (#FDFCF9, #1A1A1A, #C5A17A), Inter font, rounded editorial cards, and dark mode support. - globals.css: Rewritten from 1867→200 lines, new brand colors + editorial utilities - Landing page: New editorial design with Hero, Steps, Features, Layout, Formats, Pricing, CTA, Footer - Auth pages: Editorial card design with decorative blur blobs and back-to-home links - Dashboard sidebar: New w-72 sidebar with Momento promo section - Dashboard header: New h-20 topbar with editorial styling - i18n: Added memento/common/dashboard keys for all 13 locales, cleaned duplicate landing keys Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
@@ -1,131 +0,0 @@
|
||||
"use client";
|
||||
|
||||
import { useTranslation } from "@/lib/i18n";
|
||||
import { FileText } from "lucide-react";
|
||||
|
||||
/** Un seul exemple : même .docx, original EN à gauche, traduction FR à droite. */
|
||||
const SOURCE_DOC = {
|
||||
heading: "1. Scope and objectives",
|
||||
content: (
|
||||
<>
|
||||
<p className="mb-2 leading-relaxed">
|
||||
This document defines the <strong className="text-emerald-700 bg-emerald-50 px-1 rounded font-semibold border border-emerald-200">thermal performance requirements</strong> for the HVAC subsystem. All contractors must submit compliance certificates before commissioning.
|
||||
</p>
|
||||
<div className="my-3 border border-slate-200 rounded p-1 bg-white shadow-sm">
|
||||
<img src="/revenue_chart.png" alt="Corporate Chart" className="w-full h-auto rounded" />
|
||||
</div>
|
||||
<p className="mb-2 leading-relaxed">
|
||||
The design shall maintain indoor comfort per <span className="underline decoration-blue-400 decoration-2 font-medium">ISO 7730</span>. Deviations require written approval from the project engineer.
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
};
|
||||
|
||||
const TARGET_DOC = {
|
||||
heading: "1. Périmètre et objectifs",
|
||||
content: (
|
||||
<>
|
||||
<p className="mb-2 leading-relaxed">
|
||||
Le présent document définit les <strong className="text-emerald-700 bg-emerald-50 px-1 rounded font-semibold border border-emerald-200">exigences de performance thermique</strong> pour le sous-système CVC. Toutes les entreprises doivent fournir des certificats de conformité avant la mise en service.
|
||||
</p>
|
||||
<div className="my-3 border border-slate-200 rounded p-1 bg-white shadow-sm">
|
||||
<img src="/revenue_chart.png" alt="Corporate Chart" className="w-full h-auto rounded" />
|
||||
</div>
|
||||
<p className="mb-2 leading-relaxed">
|
||||
La conception doit garantir le confort intérieur conformément à <span className="underline decoration-blue-400 decoration-2 font-medium">l'ISO 7730</span>. Toute dérogation nécessite l'accord écrit de l'ingénieur de projet.
|
||||
</p>
|
||||
</>
|
||||
),
|
||||
};
|
||||
|
||||
export function HeroWordComparison() {
|
||||
const { t } = useTranslation();
|
||||
|
||||
return (
|
||||
<div className="relative w-full max-w-xl mx-auto lg:max-w-none lg:mx-0">
|
||||
<div className="relative rounded-xl bg-[#1a1a1c] border border-[#27272A] shadow-2xl overflow-hidden ring-1 ring-white/5">
|
||||
<div className="absolute -inset-px bg-gradient-to-br from-primary/20 via-transparent to-emerald-500/10 opacity-40 blur-xl pointer-events-none rounded-xl" />
|
||||
|
||||
<div className="relative flex items-center gap-2 px-3 py-2 bg-[#252526] border-b border-[#3c3c3c]">
|
||||
<div className="flex gap-1.5" aria-hidden>
|
||||
<span className="h-2.5 w-2.5 rounded-full bg-[#ff5f57]" />
|
||||
<span className="h-2.5 w-2.5 rounded-full bg-[#febc2e]" />
|
||||
<span className="h-2.5 w-2.5 rounded-full bg-[#28c840]" />
|
||||
</div>
|
||||
<div className="flex flex-1 items-center justify-center gap-2 min-w-0">
|
||||
<FileText className="h-4 w-4 shrink-0 text-[#2b579a]" aria-hidden />
|
||||
<span className="truncate text-xs text-slate-300 font-medium">
|
||||
{t("landing.heroDoc.fileName")}
|
||||
</span>
|
||||
<span className="hidden sm:inline text-[10px] text-slate-500 uppercase tracking-wide shrink-0">
|
||||
Word
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="relative flex items-center gap-3 px-3 py-1.5 bg-[#2d2d30] border-b border-[#3c3c3c] text-[10px] text-slate-400">
|
||||
<span className="text-white font-medium">{t("landing.heroDoc.ribbonFile")}</span>
|
||||
<span>{t("landing.heroDoc.ribbonHome")}</span>
|
||||
<span>{t("landing.heroDoc.ribbonInsert")}</span>
|
||||
<span>{t("landing.heroDoc.ribbonLayout")}</span>
|
||||
<span className="ml-auto hidden sm:flex items-center gap-1 text-slate-500" aria-hidden>
|
||||
<span className="px-1 rounded bg-[#3c3c3c] font-semibold text-slate-300">B</span>
|
||||
<span className="px-1 rounded bg-[#3c3c3c] italic text-slate-300">I</span>
|
||||
<span className="px-1 rounded bg-[#3c3c3c] underline text-slate-300">U</span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div className="relative p-2 sm:p-4 bg-[#1e1e1e]">
|
||||
<p className="mb-3 text-center text-xs text-slate-400 sm:text-start sm:px-1">
|
||||
{t("landing.heroDoc.caption")}
|
||||
</p>
|
||||
<div className="flex rounded-lg overflow-hidden border border-[#3c3c3c] shadow-inner min-h-[240px] sm:min-h-[300px]">
|
||||
<div className="w-1/2 border-r border-[#c8c8c8] bg-[#f3f3f3] flex flex-col">
|
||||
<div className="shrink-0 px-2 py-1.5 bg-[#e7e7e7] border-b border-[#d0d0d0]">
|
||||
<span className="text-[10px] font-semibold uppercase tracking-wide text-[#444] truncate block">
|
||||
{t("landing.heroDoc.badgeOriginal")}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex-1 p-3 sm:p-4 overflow-hidden bg-white text-start">
|
||||
<article
|
||||
className="text-[11px] sm:text-xs leading-relaxed text-[#242424]"
|
||||
style={{
|
||||
fontFamily:
|
||||
'Calibri, "Segoe UI", "Helvetica Neue", Arial, sans-serif',
|
||||
}}
|
||||
>
|
||||
<h3 className="text-sm sm:text-base font-bold text-[#2b579a] mb-2">
|
||||
{SOURCE_DOC.heading}
|
||||
</h3>
|
||||
{SOURCE_DOC.content}
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-1/2 bg-[#f0f7ff] flex flex-col">
|
||||
<div className="shrink-0 px-2 py-1.5 bg-[#ddeaf7] border-b border-[#b4c7e7]">
|
||||
<span className="text-[10px] font-semibold uppercase tracking-wide text-[#1a3a5c] truncate block">
|
||||
{t("landing.heroDoc.badgeTranslated")}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex-1 p-3 sm:p-4 overflow-hidden bg-white text-start">
|
||||
<article
|
||||
className="text-[11px] sm:text-xs leading-relaxed text-[#242424]"
|
||||
style={{
|
||||
fontFamily:
|
||||
'Calibri, "Segoe UI", "Helvetica Neue", Arial, sans-serif',
|
||||
}}
|
||||
>
|
||||
<h3 className="text-sm sm:text-base font-bold text-[#2b579a] mb-2">
|
||||
{TARGET_DOC.heading}
|
||||
</h3>
|
||||
{TARGET_DOC.content}
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user