Lago/mc_cars_gmbh_infraestructure
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: optimize vehicle photo URLs and update HTML preconnect and stylesheet links

Browse Source
This commit is contained in:
Lago
2026-05-09 23:51:40 +02:00
parent b4258edb91
commit db4001aaa5
2 changed files with 17 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/app.js
+12 -3
View File
@@ -156,11 +156,12 @@ function renderGrid() {
emptyState.style.display = state.filtered.length ? "none" : "block";
for (const v of state.filtered) {
const photoUrl = optimizedVehiclePhotoUrl(v.photo_url);
const card = document.createElement("article");
card.className = "vehicle-card";
card.innerHTML = `
<div class="vehicle-photo">
<img src="${escapeAttr(v.photo_url)}" alt="${escapeAttr(v.brand)} ${escapeAttr(v.model)}" loading="lazy" decoding="async" />
<img src="${escapeAttr(photoUrl)}" alt="${escapeAttr(v.brand)} ${escapeAttr(v.model)}" loading="lazy" decoding="async" />
<span class="badge" aria-hidden="true">${escapeHtml(v.brand)}</span>
</div>
<div class="vehicle-body">
@@ -198,12 +199,13 @@ function renderGrid() {
function openDetails(id) {
const v = state.vehicles.find(x => x.id === id);
if (!v) return;
const photoUrl = optimizedVehiclePhotoUrl(v.photo_url);
const lang = getLang();
const desc = lang === "en" ? v.description_en : v.description_de;
dialogTitle.textContent = `${v.brand} ${v.model}`;
dialogBody.innerHTML = `
<img src="${escapeAttr(v.photo_url)}" alt="${escapeAttr(v.brand + ' ' + v.model)}" />
<img src="${escapeAttr(photoUrl)}" alt="${escapeAttr(v.brand + ' ' + v.model)}" />
<p>${escapeHtml(desc || "")}</p>
<div class="spec-row" style="margin:1rem 0;">
<div><strong>${v.power_hp}</strong><span>${t("hp")}</span></div>
@@ -399,6 +401,7 @@ async function updateSidebar() {
const kmPerWeekday = price.max_daily_km;
const kmPerWeekendDay = price.max_km_weekend;
const includedKm = (weekdays * kmPerWeekday) + (weekendDays * kmPerWeekendDay);
const photoUrl = optimizedVehiclePhotoUrl(v.photo_url);
bpfSidebarPlaceholder.style.display = "none";
bpfSidebarContent.style.display = "block";
@@ -413,7 +416,7 @@ async function updateSidebar() {
<div class="bpf-price-row muted" style="margin-top:0.8rem;"><span>${t("bpfDeposit")}</span><span>€ ${deposit.toLocaleString("de-DE")}</span></div>
<div class="bpf-price-row muted"><span>${t("bpfIncludedKm")}</span><span>${includedKm} km</span></div>
<div class="bpf-price-row muted"><span>${t("bpfExtraKm")}</span><span>€ 1,50${t("bpfPerKm")}</span></div>
<div class="bpf-car-preview" style="background-image:url('${escapeAttr(v.photo_url)}');"></div>
<div class="bpf-car-preview" style="background-image:url('${escapeAttr(photoUrl)}');"></div>
<p class="bpf-car-name">${escapeHtml(v.brand)} ${escapeHtml(v.model)}</p>
<p class="bpf-car-specs">${v.power_hp} ${t("hp")} • ${v.top_speed_kmh} ${t("kmh")} • ${escapeHtml(v.acceleration)}</p>
`;
@@ -533,6 +536,12 @@ function escapeHtml(s) {
}
function escapeAttr(s) { return escapeHtml(s); }
function optimizedVehiclePhotoUrl(url) {
const raw = String(url ?? "");
if (!raw) return raw;
return raw.replace("/images/ferrari-main-car.png", "/images/ferrari-main-car-mobile.jpg");
}
// ---------------- Boot ----------------
langToggle.textContent = getLang() === "de" ? "EN" : "DE";
applyI18n();
frontend/index.html
+5 -7
View File
@@ -8,13 +8,11 @@
<link rel="icon" type="image/svg+xml" href="/images/mc-cars-mark.svg" />
<link rel="apple-touch-icon" href="/images/mc-cars-mark.svg" />
<link rel="preload" as="image" href="/images/ferrari-main-car-mobile.jpg" fetchpriority="high" />
<link rel="preconnect" href="https://esm.sh" crossorigin />
<link rel="preconnect" href="https://esm.sh" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Playfair+Display:wght@500;600;700&display=swap" onload="this.onload=null;this.rel='stylesheet'" />
<noscript><link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Playfair+Display:wght@500;600;700&display=swap" rel="stylesheet" /></noscript>
<link rel="preload" as="style" href="styles.css" onload="this.onload=null;this.rel='stylesheet'" />
<noscript><link rel="stylesheet" href="styles.css" /></noscript>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Playfair+Display:wght@500;600;700&display=optional" rel="stylesheet" />
<link rel="stylesheet" href="styles.css" />
<!-- SEO & Social Meta Tags -->
<meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1" />
<meta name="keywords" content="Sportwagenvermietung Steiermark, Luxusauto mieten, Sportwagenverleih, Ferraris mieten Graz, Porsche mieten Österreich" />
@@ -52,7 +50,7 @@
"alternateName": "MC Cars",
"description": "Premium Sportwagen- und Luxusvermietung in der Steiermark",
"url": "https://demo.lago.dev",
"logo": "https://demo.lago.dev/images/mc-cars-logo.png",
"logo": "https://demo.lago.dev/images/mc-cars-mark.svg",
"image": "https://demo.lago.dev/images/mc-cars-og-image.png",
"areaServed": {
"@type": "Place",
@@ -76,7 +74,7 @@
"@type": "Organization",
"name": "MC Cars GmbH",
"url": "https://demo.lago.dev",
"logo": "https://demo.lago.dev/images/mc-cars-logo.png",
"logo": "https://demo.lago.dev/images/mc-cars-mark.svg",
"description": "Premium Sportwagen- und Luxusvermietung in Steiermark, Österreich",
"foundingDate": "2024",
"contactPoint": {