You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
30 lines
451 B
TypeScript
30 lines
451 B
TypeScript
import styled, { css, keyframes } from 'styled-components';
|
|
|
|
const opacityAnimation = keyframes`
|
|
0% {
|
|
opacity: 1;
|
|
}
|
|
25% {
|
|
opacity: 0.2;
|
|
}
|
|
50% {
|
|
opacity: 1;
|
|
}
|
|
75% {
|
|
opacity: 0.2;
|
|
}
|
|
100% {
|
|
opacity: 1;
|
|
}
|
|
`;
|
|
|
|
export const MessageHighlighter = styled.div<{
|
|
highlight: boolean;
|
|
}>`
|
|
${props =>
|
|
props.highlight &&
|
|
css`
|
|
animation: ${opacityAnimation} 1s linear;
|
|
`}
|
|
`;
|