| | |
| | | return ( |
| | | <div |
| | | className={cn( |
| | | 'relative flex flex-col rounded-md border shadow-xs hover:shadow-md', |
| | | 'flex flex-col relative rounded-md shadow-xs border hover:shadow-md', |
| | | THEME_MAP[theme].bg, |
| | | data.selected ? THEME_MAP[theme].border : 'border-black/5', |
| | | )} |
| | |
| | | /> |
| | | <div |
| | | className={cn( |
| | | 'h-2 shrink-0 rounded-t-md opacity-50', |
| | | 'shrink-0 h-2 opacity-50 rounded-t-md', |
| | | THEME_MAP[theme].title, |
| | | )}></div> |
| | | { |
| | | data.selected && ( |
| | | <div className='absolute left-1/2 top-[-41px] -translate-x-1/2'> |
| | | <div className='absolute -top-[41px] left-1/2 -translate-x-1/2'> |
| | | <NoteEditorToolbar |
| | | theme={theme} |
| | | onThemeChange={handleThemeChange} |
| | |
| | | </div> |
| | | ) |
| | | } |
| | | <div className='grow overflow-y-auto px-3 py-2.5'> |
| | | <div className='grow px-3 py-2.5 overflow-y-auto'> |
| | | <div className={cn( |
| | | data.selected && 'nodrag nopan nowheel cursor-text', |
| | | )}> |