feat: mobilni responsivita, testy, klavesove zkratky, drag & drop, univerzalizace
- Mobile responsive CSS (touch targets 44px, iOS anti-zoom, reduced motion) - Vitest setup s 39 testy (formatters, attendanceHelpers, useTableSort) - Klavesove zkratky (Shift+? napoveda, Ctrl+S ulozit, navigace) - Drag & drop pro polozky nabidek (@dnd-kit, SortableRow, useSortableList) - Univerzalizace: odstraneni BOHA brandingu z UI, emailu, PDF - Smazany nepotrebne soubory (deploy.sh, AUTH_SYSTEM.md, example_design, .htaccess) - CORS konfigurovatelny pres env promennou Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
50
src/admin/components/ShortcutsHelp.jsx
Normal file
50
src/admin/components/ShortcutsHelp.jsx
Normal file
@@ -0,0 +1,50 @@
|
||||
import { useState } from 'react'
|
||||
import useKeyboardShortcuts from '../hooks/useKeyboardShortcuts'
|
||||
|
||||
const GLOBAL_SHORTCUTS = [
|
||||
{ keys: '?', description: 'Zobrazit klávesové zkratky' },
|
||||
{ keys: 'Ctrl + N', description: 'Nový záznam' },
|
||||
{ keys: 'Ctrl + S', description: 'Uložit' },
|
||||
{ keys: 'Escape', description: 'Zavřít modal / zrušit' },
|
||||
{ keys: '/', description: 'Hledat' },
|
||||
]
|
||||
|
||||
export default function ShortcutsHelp() {
|
||||
const [open, setOpen] = useState(false)
|
||||
|
||||
useKeyboardShortcuts([
|
||||
{ key: '?', shift: true, handler: () => setOpen(prev => !prev) },
|
||||
{ key: 'Escape', handler: () => setOpen(false), when: open },
|
||||
])
|
||||
|
||||
if (!open) return null
|
||||
|
||||
return (
|
||||
<div className="admin-modal-overlay" onClick={() => setOpen(false)}>
|
||||
<div className="admin-modal" style={{ maxWidth: 420 }} onClick={e => e.stopPropagation()}>
|
||||
<div className="admin-modal-header">
|
||||
<h3>Klávesové zkratky</h3>
|
||||
<button className="admin-modal-close" onClick={() => setOpen(false)}>
|
||||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
|
||||
<path d="M18 6L6 18M6 6l12 12"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<div className="admin-modal-body">
|
||||
<table className="admin-table" style={{ minWidth: 'auto' }}>
|
||||
<tbody>
|
||||
{GLOBAL_SHORTCUTS.map(s => (
|
||||
<tr key={s.keys}>
|
||||
<td style={{ width: 120 }}>
|
||||
<kbd className="admin-kbd">{s.keys}</kbd>
|
||||
</td>
|
||||
<td>{s.description}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user