alezmad/whyrating
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: whyrating brand identity + landing page content

Browse Source 
Replace boilerplate branding with WhyRating visual identity:
- Inter + Nunito fonts, blue theme, light mode
- Inline SVG logo component (whyrating.com wordmark)
- Swap logos in header, footer, auth layout
- Generate favicon/icons from brand SVG
- Full landing page: hero, how-it-works, features, testimonials, FAQ
- EN/ES translations for all sections
- Report fan (abanico) component with 3 PDF page previews

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Alejandro Gutiérrez
2026-02-21 19:48:21 +00:00
parent 5cdc07cd39
commit a5aceec46a
23 changed files with 596 additions and 2159 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
apps/web/src/modules/common/layout/base.tsx
View File

@@ -1,15 +1,22 @@
import { Geist_Mono, Geist } from "next/font/google";
import { Geist_Mono, Inter, Nunito } from "next/font/google";
import { cn } from "@turbostarter/ui";
import { appConfig } from "~/config/app";
const sans = Geist({
const sans = Inter({
subsets: ["latin"],
display: "swap",
variable: "--font-sans",
});
const wordmark = Nunito({
subsets: ["latin"],
display: "swap",
variable: "--font-wordmark",
weight: ["700"],
});
const mono = Geist_Mono({
subsets: ["latin"],
display: "swap",
@@ -24,7 +31,7 @@ interface BaseLayoutProps {
export const BaseLayout = ({ children, locale }: BaseLayoutProps) => {
return (
<html lang={locale} className={cn(sans.variable, mono.variable)}>
<html lang={locale} className={cn(sans.variable, wordmark.variable, mono.variable)}>
<body
suppressHydrationWarning
className="bg-background text-foreground flex min-h-screen flex-col items-center justify-center font-sans antialiased"

92
apps/web/src/modules/common/whyrating-logo.tsx Normal file
View File

@@ -0,0 +1,92 @@
import { cn } from "@turbostarter/ui";
interface WhyRatingLogoProps {
className?: string;
iconClassName?: string;
showWordmark?: boolean;
}
export function WhyRatingLogo({
className,
iconClassName,
showWordmark = true,
}: WhyRatingLogoProps) {
return (
<div className={cn("flex items-center gap-2", className)}>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 120 120"
className={cn("h-8 w-8", iconClassName)}
>
<defs>
<clipPath id="whyrating-clip">
<circle cx="60" cy="62" r="21" />
</clipPath>
</defs>
<polygon
points="60,15 71.5,42 101,46 79.5,66 85,95 60,82 35,95 40.5,66 19,46 48.5,42"
fill="#FBBC05"
stroke="#FBBC05"
strokeWidth="6"
strokeLinejoin="round"
/>
<g>
<line
x1="83"
y1="81"
x2="95"
y2="91"
stroke="#1E293B"
strokeWidth="9"
strokeLinecap="round"
/>
<circle cx="60" cy="62" r="27" fill="#1E293B" />
<circle cx="60" cy="62" r="21" fill="#FEF3C7" />
<g clipPath="url(#whyrating-clip)">
<rect
x="42"
y="58"
width="11"
height="35"
rx="1.5"
ry="1.5"
fill="#86EFAC"
/>
<rect
x="55"
y="51"
width="11"
height="42"
rx="1.5"
ry="1.5"
fill="#22C55E"
/>
<rect
x="68"
y="44"
width="11"
height="49"
rx="1.5"
ry="1.5"
fill="#15803D"
/>
</g>
<rect
x="68"
y="44"
width="11"
height="18"
rx="1.5"
ry="1.5"
fill="#15803D"
/>
</g>
</svg>
{showWordmark && (
<span className="font-wordmark font-bold text-foreground text-xl">
whyrating.com
</span>
)}
</div>
);
}