HifiPlanet-Website/hifi/index.html
Maaxxs 464164ff36 Fix wildly uneven testimonial card heights, add avatar polish
A single long Google review made every card in the row stretch to match
it (default flex align-items: stretch), leaving short reviews with a
huge empty gap before the name - reported with a real screenshot where
one card towered over its neighbors.

The review paragraph is now capped at line-clamp-6, so no single card's
natural height is unbounded anymore - stretch still aligns the row, but
to a reasonable, consistent height instead of an outlier's full text.
Full text stays in the DOM (still copyable/accessible), just visually
truncated with a native ellipsis.

Added a bit more visual polish while in there: a subtle decorative quote
mark per card, a hover shadow lift, and an avatar next to each name -
the reviewer's real Google profile photo when available, otherwise a
colored initial-letter circle (Home.jsx now passes profile_photo_url
through, previously fetched but unused).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-07-21 01:54:07 +02:00

53 lines
2.8 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html lang="de">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="icon" type="image/png" href="/favicon.png" />
<!-- Nur fuer die Paket-Kacheln auf der Modell-Seite (Name/Preis-Typografie im
Kunden-Referenzdesign) - der Rest der Seite bleibt beim Standard-Font. -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600;700&family=Barlow+Condensed:wght@500;600&family=Michroma&display=swap" rel="stylesheet" />
<title>HifiPlanet | Car-Hifi Umbauten nach Maß</title>
<meta name="description" content="HifiPlanet dein Car-Hifi Spezialist. Marke und Modell wählen, passende Sound-Pakete entdecken und unverbindlich anfragen." />
<link rel="canonical" href="https://hifi-planet.de/" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="HifiPlanet" />
<meta property="og:title" content="HifiPlanet | Car-Hifi Umbauten nach Maß" />
<meta property="og:description" content="Dein Car-Hifi Spezialist: Marke und Modell wählen, passende Sound-Pakete entdecken und unverbindlich anfragen." />
<meta property="og:locale" content="de_DE" />
<meta name="twitter:card" content="summary" />
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "AutoRepair",
"name": "HifiPlanet",
"description": "Car-Hifi Spezialist für individuelle Sound-Umbauten vom unauffälligen Upgrade bis zum Komplettumbau.",
"url": "https://hifi-planet.de/",
"telephone": "+4993732062390",
"email": "info@hifi-planet-amorbach.de",
"address": {
"@type": "PostalAddress",
"streetAddress": "Boxbrunner Str. 20a",
"postalCode": "63916",
"addressLocality": "Amorbach",
"addressCountry": "DE"
},
"openingHoursSpecification": [
{ "@type": "OpeningHoursSpecification", "dayOfWeek": ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday"], "opens": "09:00", "closes": "18:00" },
{ "@type": "OpeningHoursSpecification", "dayOfWeek": ["Saturday"], "opens": "10:00", "closes": "13:00" }
],
"sameAs": ["https://www.youtube.com/@hifiplanet2812"]
}
</script>
<script type="module" crossorigin src="/assets/index-DsWWCZq0.js"></script>
<link rel="modulepreload" crossorigin href="/assets/lucide-icons-66ioQXWI.js">
<link rel="stylesheet" crossorigin href="/assets/index-B83Ts70I.css">
</head>
<body class="bg-white text-slate-900 dark:bg-slate-950 dark:text-slate-100">
<div id="root"></div>
</body>
</html>