|
|
|
import { ComboBox } from './ComboBox.jsx'
|
|
|
|
import { MODE_COURSE, MODE_SCHEDULE, MODE_WORKWEEK } from './EventsView.jsx'
|
|
|
|
import { Help } from './Help.jsx'
|
|
|
|
import { Icon } from './Icon.jsx'
|
|
|
|
|
|
|
|
export const HamburgerMenu = ({ onClose, mode, setMode, source, setSource, theme, setTheme }) => {
|
|
|
|
return (
|
|
|
|
<div class="menu">
|
|
|
|
<div class="header">
|
|
|
|
<div class="option-group">
|
|
|
|
<button class="flat icon" onClick={onClose}>
|
|
|
|
<Icon name="close" />
|
|
|
|
</button>
|
|
|
|
<button
|
|
|
|
class="icon"
|
|
|
|
onClick={() => setTheme(theme === 'dark' ? 'light' : 'dark')}
|
|
|
|
>
|
|
|
|
<Icon name={theme === 'dark' ? 'dark_mode' : 'light_mode'} />
|
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
<div class="item logo">
|
|
|
|
<img src="logo-circuit-board.svg" alt="logo" /> / <span>Orario</span>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="options">
|
|
|
|
<div class="label">Gruppo Corsi</div>
|
|
|
|
<ComboBox
|
|
|
|
value={source}
|
|
|
|
setValue={setSource}
|
|
|
|
options={[
|
|
|
|
{ value: 'anno-1', label: 'I' },
|
|
|
|
{ value: 'anno-2', label: 'II' },
|
|
|
|
{ value: 'anno-3', label: 'III' },
|
|
|
|
{ value: 'magistrale', label: 'Magistrale' },
|
|
|
|
{ value: 'tutti', label: 'Tutti' },
|
|
|
|
]}
|
|
|
|
/>
|
|
|
|
<div class="label">Visualizzazione</div>
|
|
|
|
<ComboBox
|
|
|
|
value={mode}
|
|
|
|
setValue={setMode}
|
|
|
|
options={[
|
|
|
|
{ value: MODE_COURSE, label: 'Corsi' },
|
|
|
|
{ value: MODE_SCHEDULE, label: 'Giornaliera' },
|
|
|
|
{ value: MODE_WORKWEEK, label: 'Settimana' },
|
|
|
|
]}
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
<hr />
|
|
|
|
<div class="help">
|
|
|
|
<h2>
|
|
|
|
<Icon name="info" />
|
|
|
|
Guida
|
|
|
|
</h2>
|
|
|
|
<Help />
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
)
|
|
|
|
}
|