23 lines
569 B
TypeScript
Executable File
23 lines
569 B
TypeScript
Executable File
import type { MileageMarkerSpec } from '../../types/timeline';
|
|
import { cssVars, px } from '../../utils/cssVars';
|
|
import styles from './MileageMarker.module.scss';
|
|
|
|
interface MileageMarkerProps {
|
|
marker: MileageMarkerSpec;
|
|
}
|
|
|
|
export function MileageMarker({ marker }: MileageMarkerProps) {
|
|
const classNames = [styles.marker];
|
|
if (marker.selected) classNames.push(styles.selected);
|
|
|
|
return (
|
|
<div
|
|
className={classNames.join(' ')}
|
|
style={cssVars({ '--x': px(marker.left) })}
|
|
title={marker.value}
|
|
>
|
|
{marker.value}
|
|
</div>
|
|
);
|
|
}
|