Neuer TikTok-Button-Stil (Polarlicht-Pille mit echten TikTok-Farben)
Auf vanvan.html und dogfather.html ersetzt ein neuer .btn-tiktok-Button (gleicher Polarlicht-/Schimmer-Mechanismus wie der "Bewerben"-Button im Header, aber mit TikTok-Markenfarben Cyan #25F4EE + Pink/Rot #FE2C55 statt der allgemeinen Regenbogen-Aurora) den bisherigen reinen Text- Handle-Mention. Bewusst NUR für echte TikTok-Links verwendet — keine anderen Buttons/Links bekommen diese Farben.
This commit is contained in:
@@ -449,6 +449,67 @@ header.site-header {
|
||||
.nav-cta::before, .nav-cta::after { animation: none; }
|
||||
}
|
||||
|
||||
/* TikTok-Button: exakt derselbe Polarlicht-Mechanismus wie .nav-cta
|
||||
(schwarze Pille + wandernde Farbwolken + Lichtschimmer), aber mit den
|
||||
echten TikTok-Markenfarben (Cyan #25F4EE + Pink/Rot #FE2C55) statt der
|
||||
allgemeinen Regenbogen-Aurora. Bewusst NUR für echte TikTok-Links
|
||||
verwendet — keine anderen Social-/CTA-Buttons bekommen diese Farben. */
|
||||
.btn-tiktok {
|
||||
position: relative;
|
||||
isolation: isolate;
|
||||
overflow: hidden;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: .4rem;
|
||||
padding: .6rem 1.5rem;
|
||||
border-radius: 999px;
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
font-size: .95rem;
|
||||
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 6px 18px rgba(0, 0, 0, .35);
|
||||
}
|
||||
.btn-tiktok span {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
text-shadow: 0 1px 3px rgba(0, 0, 0, .6), 0 0 14px rgba(0, 0, 0, .35);
|
||||
}
|
||||
.btn-tiktok::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: -60%;
|
||||
z-index: 0;
|
||||
background:
|
||||
radial-gradient(circle at 22% 30%, rgba(37, 244, 238, .95), transparent 55%),
|
||||
radial-gradient(circle at 78% 68%, rgba(254, 44, 85, .95), transparent 58%);
|
||||
filter: blur(9px) saturate(1.35);
|
||||
animation: nav-cta-aurora 9s ease-in-out infinite alternate;
|
||||
}
|
||||
.btn-tiktok::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-tiktok:hover {
|
||||
transform: translateY(-1px);
|
||||
border-color: rgba(255, 255, 255, .32);
|
||||
box-shadow: 0 10px 26px rgba(0, 0, 0, .45),
|
||||
0 0 22px rgba(37, 244, 238, .35),
|
||||
0 0 22px rgba(254, 44, 85, .35);
|
||||
}
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.btn-tiktok::before, .btn-tiktok::after { animation: none; }
|
||||
}
|
||||
|
||||
.nav-toggle {
|
||||
display: none;
|
||||
background: none;
|
||||
|
||||
@@ -22,11 +22,11 @@ window.I18N_PAGE = {
|
||||
en: "Who is Filipe?", fr: "Qui est Filipe ?", pt: "Quem é o Filipe?",
|
||||
},
|
||||
df_wer_lead: {
|
||||
de: `Content Creator, Streamer auf TikTok (<strong>@dogfather0804</strong>) und das Herz einer wachsenden Community.`,
|
||||
"de-CH": `Content Creator, Streamer uf TikTok (<strong>@dogfather0804</strong>) und s Herz vo re wachsende Community.`,
|
||||
en: `Content creator, streamer on TikTok (<strong>@dogfather0804</strong>) and the heart of a growing community.`,
|
||||
fr: `Créateur de contenu, streamer sur TikTok (<strong>@dogfather0804</strong>) et le cœur d'une communauté grandissante.`,
|
||||
pt: `Content creator, streamer no TikTok (<strong>@dogfather0804</strong>) e o coração de uma comunidade em crescimento.`,
|
||||
de: `Content Creator, Streamer auf TikTok und das Herz einer wachsenden Community.`,
|
||||
"de-CH": `Content Creator, Streamer uf TikTok und s Herz vo re wachsende Community.`,
|
||||
en: `Content creator, streamer on TikTok and the heart of a growing community.`,
|
||||
fr: `Créateur de contenu, streamer sur TikTok et le cœur d'une communauté grandissante.`,
|
||||
pt: `Content creator, streamer no TikTok e o coração de uma comunidade em crescimento.`,
|
||||
},
|
||||
df_wer_1: {
|
||||
de: "Filipe ist 34 Jahre alt, gebürtiger Portugiese und lebt seit Februar 2026 in Luxemburg. Sein bisheriger Weg führte ihn durch verschiedene Orte, unterschiedliche Lebensabschnitte und Erfahrungen, die ihn zu dem Menschen gemacht haben, der er heute ist.",
|
||||
|
||||
@@ -26,11 +26,11 @@ window.I18N_PAGE = {
|
||||
en: "Hey, this is VanVan, Dogi's right hand.", fr: "Coucou, c'est VanVan, le bras droit de Dogi.", pt: "Oi, aqui é a VanVan, o braço direito do Dogi.",
|
||||
},
|
||||
vv_wer_tiktok: {
|
||||
de: `Auf TikTok findet ihr mich unter <strong>@o.o.vanessa.o.o</strong>.`,
|
||||
"de-CH": `Uf TikTok findet ihr mich unter <strong>@o.o.vanessa.o.o</strong>.`,
|
||||
en: `You can find me on TikTok at <strong>@o.o.vanessa.o.o</strong>.`,
|
||||
fr: `Vous me trouverez sur TikTok sous <strong>@o.o.vanessa.o.o</strong>.`,
|
||||
pt: `Vocês me encontram no TikTok em <strong>@o.o.vanessa.o.o</strong>.`,
|
||||
de: `Auf TikTok findet ihr mich unter:`,
|
||||
"de-CH": `Uf TikTok findet ihr mich unter:`,
|
||||
en: `You can find me on TikTok at:`,
|
||||
fr: `Vous me trouverez sur TikTok sous :`,
|
||||
pt: `Vocês me encontram no TikTok em:`,
|
||||
},
|
||||
vv_wer_1: {
|
||||
de: "Ich bin ein Mensch, der mit dem Herzen denkt, unglaublich loyal ist und für die Menschen kämpft, die ihm wichtig sind.",
|
||||
|
||||
+2
-1
@@ -42,7 +42,8 @@
|
||||
</div>
|
||||
<div>
|
||||
<h2 data-i18n="df_wer_h2">Wer ist Filipe?</h2>
|
||||
<p class="lead" data-i18n="df_wer_lead">Content Creator, Streamer auf TikTok (<strong>@dogfather0804</strong>) und das Herz einer wachsenden Community.</p>
|
||||
<p class="lead" data-i18n="df_wer_lead">Content Creator, Streamer auf TikTok und das Herz einer wachsenden Community.</p>
|
||||
<a class="btn-tiktok" href="https://www.tiktok.com/@dogfather0804" target="_blank" rel="noopener" style="margin-bottom:1rem;"><span>TikTok</span></a>
|
||||
<p data-i18n="df_wer_1">Filipe ist 34 Jahre alt, gebürtiger Portugiese und lebt seit Februar 2026 in Luxemburg. Sein bisheriger Weg führte ihn durch verschiedene Orte, unterschiedliche Lebensabschnitte und Erfahrungen, die ihn zu dem Menschen gemacht haben, der er heute ist.</p>
|
||||
<p data-i18n="df_wer_2">An seiner Seite: Husky <a href="casper.html">Casper</a> und Kater Simba — treue Begleiter, die längst Teil der Marke geworden sind. Mit seinem Core-Team baut DogFather jeden Tag daran, dass sich Menschen in seiner Community nicht allein fühlen.</p>
|
||||
<!-- Hinweis: Alter, Herkunft und Wohnort sind bewusst öffentlich, da der Nutzer diese Fakten selbst in seinem persönlichen Vorstellungstext (siehe streamer.html) veröffentlicht hat. Weiterhin bewusst NICHT genannt: Nachname und weitere bürgerliche Daten. -->
|
||||
|
||||
+2
-1
@@ -43,7 +43,8 @@
|
||||
<div>
|
||||
<h2 data-i18n="vv_wer_h2">Wer ich bin</h2>
|
||||
<p class="lead" data-i18n="vv_wer_lead">Huhu, hier ist VanVan, die rechte Hand von Dogi.</p>
|
||||
<p data-i18n="vv_wer_tiktok">Auf TikTok findet ihr mich unter <strong>@o.o.vanessa.o.o</strong>.</p>
|
||||
<p data-i18n="vv_wer_tiktok">Auf TikTok findet ihr mich unter:</p>
|
||||
<a class="btn-tiktok" href="https://www.tiktok.com/@o.o.vanessa.o.o" target="_blank" rel="noopener" style="margin-bottom:1rem;"><span>TikTok</span></a>
|
||||
<p data-i18n="vv_wer_1" style="margin-top:1.4rem;">Ich bin ein Mensch, der mit dem Herzen denkt, unglaublich loyal ist und für die Menschen kämpft, die ihm wichtig sind.</p>
|
||||
<p data-i18n="vv_wer_2">Wenn ich zu jemandem Vertrauen aufgebaut habe, gibt es für mich kein „halb“. Dann bin ich da – unabhängig davon, ob gerade gute oder schwierige Zeiten herrschen.</p>
|
||||
<p data-i18n="vv_wer_3">Freundschaft, Zusammenhalt und Ehrlichkeit bedeuten mir mehr als alles andere. Für mich zählen keine Fassaden, sondern der Charakter eines Menschen. Wenn ich jemanden unterstütze, dann nicht, weil es von mir erwartet wird, sondern weil ich aus voller Überzeugung hinter diesem Menschen stehe.</p>
|
||||
|
||||
Reference in New Issue
Block a user