myrmidex
e383de82a4
Reviewed-on: https://codeberg.org/lvl0/dish-planner/pulls/5 Co-authored-by: myrmidex <myrmidex@myrmidex.net> Co-committed-by: myrmidex <myrmidex@myrmidex.net>
27 lines
No EOL
849 B
TypeScript
27 lines
No EOL
849 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': 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 |