27 lines
854 B
TypeScript
27 lines
854 B
TypeScript
|
import {DateTime} from "luxon";
|
||
|
|
import React, {FC} from "react";
|
||
|
|
import classNames from "classnames";
|
||
|
|
|
||
|
|
interface Props {
|
||
|
|
date: string
|
||
|
|
className?: string;
|
||
|
|
}
|
||
|
|
|
||
|
|
const DateBadge: FC<Props> = ({ className, date }) => {
|
||
|
|
const isToday = DateTime.fromISO(date).toFormat("yyyy-LL-dd") == DateTime.now().toFormat("yyyy-LL-dd")
|
||
|
|
|
||
|
|
const textStyle = classNames("inline font-bold", {
|
||
|
|
'text-accent-blue': isToday,
|
||
|
|
'text-secondary': !isToday,
|
||
|
|
}, className)
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="flex-none w-20 text-center my-auto pb-3 px-3">
|
||
|
|
<div className={classNames(textStyle, 'text-3xl')}>{DateTime.fromISO(date).toFormat("dd")}</div>
|
||
|
|
<br/>
|
||
|
|
<div className={classNames(textStyle, 'text-xl uppercase')}>{DateTime.fromISO(date).toFormat("LLL")}</div>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
export default DateBadge
|