This commit is contained in:
Linrador 2026-06-23 08:52:36 +02:00
parent cf97fd3a18
commit 50eff1e5d4
2 changed files with 22 additions and 15 deletions

View File

@ -677,6 +677,7 @@ function TimeGridView({
? normalizeTimeRange(timeSelection.anchor, timeSelection.focus)
: null
const gridTemplateColumns = `3.5rem repeat(${days.length}, minmax(7rem, 1fr))`
const showHoverSlotTopEdge = days.length === 1
function getSlotFromPointer(
clientX: number,
@ -1007,7 +1008,11 @@ function TimeGridView({
hoveredSlot?.dayKey === toDateKey(day) && (
<div
aria-hidden="true"
className="pointer-events-none absolute right-1 left-1 z-[5] flex items-center gap-1.5 overflow-hidden rounded-lg border border-dashed border-indigo-400 bg-indigo-50/90 px-2 text-xs font-semibold text-indigo-700 shadow-sm dark:border-indigo-400/70 dark:bg-indigo-500/15 dark:text-indigo-200"
className={classNames(
'pointer-events-none absolute right-1 left-1 z-[5] flex items-center gap-1.5 overflow-hidden rounded-lg border border-dashed border-indigo-400 bg-indigo-50/90 px-2 text-xs font-semibold text-indigo-700 shadow-sm dark:border-indigo-400/70 dark:bg-indigo-500/15 dark:text-indigo-200',
showHoverSlotTopEdge &&
'before:pointer-events-none before:absolute before:inset-x-0 before:top-0 before:z-10 before:border-t before:border-dashed before:border-indigo-400 dark:before:border-indigo-400/70',
)}
style={{
top: `${(hoveredSlot.minutes / 1440) * 100}%`,
height: `${(30 / 1440) * 100}%`,

View File

@ -812,22 +812,24 @@ export default function DeviceFormFields({
isMilestoneDevice && !selected && 'opacity-45',
)}
>
<span
className={classNames(
'flex size-8 items-center justify-center rounded-md',
selected
? 'bg-indigo-600 text-white dark:bg-indigo-400 dark:text-gray-950'
: 'bg-gray-100 text-gray-500 group-hover:bg-indigo-100 group-hover:text-indigo-600 dark:bg-white/10 dark:text-gray-400 dark:group-hover:bg-indigo-500/15 dark:group-hover:text-indigo-300',
)}
>
<Icon aria-hidden="true" className="size-4" />
<span className="flex w-full items-center gap-2">
<span
className={classNames(
'flex size-8 shrink-0 items-center justify-center rounded-md',
selected
? 'bg-indigo-600 text-white dark:bg-indigo-400 dark:text-gray-950'
: 'bg-gray-100 text-gray-500 group-hover:bg-indigo-100 group-hover:text-indigo-600 dark:bg-white/10 dark:text-gray-400 dark:group-hover:bg-indigo-500/15 dark:group-hover:text-indigo-300',
)}
>
<Icon aria-hidden="true" className="size-4" />
</span>
<span className="min-w-0 truncate text-sm font-semibold">
{option.label}
</span>
</span>
<span className="mt-2 text-sm font-semibold">
{option.label}
</span>
<span className="mt-0.5 text-xs leading-4 text-gray-500 dark:text-gray-400">
<span className="mt-2 text-xs leading-4 text-gray-500 dark:text-gray-400">
{option.description}
</span>
</button>