32 lines
997 B
TypeScript
32 lines
997 B
TypeScript
import React from 'react';
|
|
|
|
interface SparkTextProps {
|
|
text: string;
|
|
}
|
|
|
|
const sparkTextStyle: React.CSSProperties = {
|
|
textShadow: '0 0 5px rgba(255, 255, 255, 0.5), 0 0 10px rgba(255, 255, 255, 0.5), 0 0 15px rgba(255, 255, 255, 0.5)',
|
|
animation: 'sparkle 1s infinite'
|
|
};
|
|
|
|
const SparkText: React.FC<SparkTextProps> = ({ text }) => {
|
|
return (
|
|
<>
|
|
<style>
|
|
{`
|
|
@keyframes sparkle {
|
|
0%, 100% {
|
|
text-shadow: 0 0 5px rgba(255, 255, 255, 0.5), 0 0 10px rgba(255, 255, 255, 0.5), 0 0 15px rgba(163, 13, 13, 0.5);
|
|
}
|
|
50% {
|
|
text-shadow: 0 0 10px rgb(214, 44, 44), 0 0 20px rgb(139, 198, 31), 0 0 30px rgb(41, 195, 82);
|
|
}
|
|
}
|
|
`}
|
|
</style>
|
|
<span style={sparkTextStyle}>{text}</span>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default SparkText; |