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.
25 lines
803 B
TypeScript
25 lines
803 B
TypeScript
// frontend/components/calendar/FocusBlock.tsx — 아리가 빈 시간에 배치한 집중 블록
|
|
"use client";
|
|
import { Icon } from "@/components/Icon";
|
|
import { toMin, topOf, PXH } from "@/lib/calendar/time";
|
|
import type { FocusBlock as FocusBlockT } from "@/lib/calendar/types";
|
|
|
|
export function FocusBlock({ b }: { b: FocusBlockT }) {
|
|
const top = topOf(b.start);
|
|
const h = ((toMin(b.end) - toMin(b.start)) / 60) * PXH;
|
|
const short = h < 40;
|
|
return (
|
|
<div
|
|
className={"fblock " + b.type + (short ? " short" : "")}
|
|
style={{ top: top + "px", height: Math.max(h - 3, 22) + "px" }}
|
|
onClick={(e) => e.stopPropagation()}
|
|
>
|
|
<div className="fb-k">
|
|
<Icon name="spark" />
|
|
{b.tag}
|
|
</div>
|
|
<div className="fbt">{b.title}</div>
|
|
</div>
|
|
);
|
|
}
|