aboutsummaryrefslogtreecommitdiffstats
path: root/frontend/components/Marquees/Marquee.tsx
blob: 4cc41a25a126916b5326b92894915089d4115424 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
import React, { ReactElement } from "react";
import styles from "./Marquee.module.css";

interface Props {
  delayShorthand: string;
  topShorthand: string;
  url: string;
  text: string;
  direction: "left" | "right";
}

const Marquee = ({ delayShorthand, url, text, topShorthand, direction }: Props): ReactElement => (
    <a className={styles.marquee} href={url} style={{
        animationDelay: delayShorthand,
        top: topShorthand,
        animationDirection: direction === "left" ? "normal" : "reverse",
    }}>{text}</a>
);

export default Marquee;