diff --git a/assets/css/main.css b/assets/css/main.css index 86ae5ad..51e3646 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -705,6 +705,68 @@ header.site-header { } } +/* Kompakter Polarlicht-Button für Karten (z.B. Marinas Team-Modi-Karte → + direkter Link zur Manager-Seite): exakt derselbe Mechanismus wie + .btn-tiktok, nur kleiner und in den Spicy-Media-Markenfarben + (Rot #d94a5c + Orange #e8935a) statt Cyan/Pink. */ +.btn-spicy-mini { + position: relative; + isolation: isolate; + overflow: hidden; + display: inline-flex; + align-items: center; + justify-content: center; + gap: .3rem; + margin-top: .6rem; + padding: .5rem 1rem; + border-radius: 999px; + color: #fff; + font-weight: 700; + font-size: .8rem; + background: #0b0e14; + border: 1px solid rgba(255, 255, 255, .16); + text-decoration: none; + transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; + box-shadow: 0 5px 14px rgba(0, 0, 0, .35); +} +.btn-spicy-mini span { + position: relative; + z-index: 2; + text-shadow: 0 1px 3px rgba(0, 0, 0, .6), 0 0 12px rgba(0, 0, 0, .35); +} +.btn-spicy-mini::before { + content: ""; + position: absolute; + inset: -60%; + z-index: 0; + background: + radial-gradient(circle at 22% 30%, rgba(217, 74, 92, .95), transparent 55%), + radial-gradient(circle at 78% 68%, rgba(232, 147, 90, .95), transparent 58%); + filter: blur(8px) saturate(1.35); + animation: nav-cta-aurora 9s ease-in-out infinite alternate; +} +.btn-spicy-mini::after { + content: ""; + position: absolute; + inset: 0; + z-index: 1; + background: linear-gradient(115deg, transparent 35%, rgba(255, 255, 255, .4) 49%, transparent 63%); + background-size: 240% 100%; + mix-blend-mode: overlay; + animation: nav-cta-shimmer 4.5s linear infinite; + pointer-events: none; +} +.btn-spicy-mini:hover { + transform: translateY(-1px); + border-color: rgba(255, 255, 255, .32); + box-shadow: 0 8px 20px rgba(0, 0, 0, .4), + 0 0 16px rgba(217, 74, 92, .35), + 0 0 16px rgba(232, 147, 90, .35); +} +@media (prefers-reduced-motion: reduce) { + .btn-spicy-mini::before, .btn-spicy-mini::after { animation: none; } +} + /* Plattform-Karten mit echten Markenfarben (z.B. links.html-Übersicht): gleicher Polarlicht-Mechanismus wie .btn-tiktok, aber generisch über --brand-1/--brand-2 (+ optional --brand-3) einstellbar, damit jede diff --git a/assets/img/avatar-marina.jpg b/assets/img/avatar-marina.jpg index 4a7fd15..4fbce74 100644 Binary files a/assets/img/avatar-marina.jpg and b/assets/img/avatar-marina.jpg differ diff --git a/assets/js/data-modis.js b/assets/js/data-modis.js index a6b327a..67ff295 100644 --- a/assets/js/data-modis.js +++ b/assets/js/data-modis.js @@ -402,6 +402,15 @@ const MODIS = [ `, }, quote: "", + // Zusätzlicher Button auf ihrer Team-Modi-Karte (siehe team-modis.html), + // führt direkt zur Manager-Seite — auf Wunsch von Dogi (03.08.2026). + extraCta: { + href: "manager.html", + label: { + de: "🌶️ Zur Manager-Seite", "de-CH": "🌶️ Zur Manager-Site", + en: "🌶️ To the Manager Page", fr: "🌶️ Vers la page Manager", pt: "🌶️ Para a página do Manager", + }, + }, social: {}, page: "", status: "aktiv", diff --git a/team-modis.html b/team-modis.html index 848acfd..a21ce52 100644 --- a/team-modis.html +++ b/team-modis.html @@ -87,16 +87,29 @@ document.addEventListener("DOMContentLoaded", () => { const stufe = Math.min(i + 1, MAX_STUFEN); const personen = rest.filter((m) => m.rank === rang); const karten = personen - .map( - (m) => ` - + .map((m) => { + const profilLink = m.page || `profil.html?p=${m.slug}`; + const kartenInhalt = `
${(m.avatar || m.photo) ? `${m.name}` : `${m.name.charAt(0).toUpperCase()}`}
${t("tm_stufe_prefix")} ${feld(m.rankLabel) || m.rank}

${m.name}

${feld(m.role)}
- ${t("tm_profil_ansehen")} -
` - ) + ${t("tm_profil_ansehen")}`; + // Optionaler zweiter Button pro Person (aktuell nur Marina → + // manager.html, siehe extraCta in data-modis.js). Eigene + //
-Karte statt , weil ein zweiter echter Link NICHT in + // einen anderen Link verschachtelt werden darf (ungültiges HTML). + if (m.extraCta) { + return ` +
+ ${kartenInhalt} + ${feld(m.extraCta.label)} +
`; + } + return ` + ${kartenInhalt} + `; + }) .join(""); return `
${karten}
`; })