FliesentischKingandDevin
7d5f44b22d
Generated with [Devin](https://devin.ai) Co-Authored-By: Devin <158243242+devin-ai-integration[bot]@users.noreply.github.com>
17 lines
689 B
TypeScript
17 lines
689 B
TypeScript
// Shop-Namensverlauf: animierter Gradient + Glow statt flacher Nutzerfarbe.
|
|
// Keyframes (name-gradient-shift / name-gradient-glow) liegen in tailwind.css.
|
|
export function shopGradientNameStyle(color: string | null | undefined, gradient?: boolean) {
|
|
if (!gradient) {
|
|
return color ? { color } : undefined
|
|
}
|
|
const from = color ?? 'var(--color-primary)'
|
|
return {
|
|
backgroundImage: `linear-gradient(90deg, ${from}, var(--color-accent), ${from})`,
|
|
backgroundSize: '200% 100%',
|
|
animation: 'name-gradient-shift 4s linear infinite, name-gradient-glow 2.5s ease-in-out infinite',
|
|
backgroundClip: 'text',
|
|
WebkitBackgroundClip: 'text',
|
|
color: 'transparent',
|
|
}
|
|
}
|