forked from phc/orario
Finalizzazione nuovo layout da mobile
parent
5d8fbc9363
commit
142c5e1b67
@ -1,41 +1,50 @@
|
|||||||
import { CompoundButton } from './CompoundButton.jsx'
|
import { CompoundButton } from './CompoundButton.jsx'
|
||||||
import { MODE_COURSE, MODE_SCHEDULE, MODE_WORKWEEK, MODE_WORKWEEK_GRID } from './EventsView.jsx'
|
import { MODE_COURSE, MODE_SCHEDULE, MODE_WORKWEEK_GRID } from './EventsView.jsx'
|
||||||
import { Icon } from './Icon.jsx'
|
import { Icon } from './Icon.jsx'
|
||||||
|
|
||||||
export const Optionbar = ({ mode, setMode, source, setSource, onHelp }) => {
|
export const OptionBar = ({ mode, setMode, source, setSource, onHelp }) => {
|
||||||
return (
|
return (
|
||||||
<div class="optionbar">
|
<div class="option-bar">
|
||||||
<div class="option-group">
|
<div class="option-group">
|
||||||
<div class="item option">
|
<div class="item option">
|
||||||
<CompoundButton
|
<CompoundButton
|
||||||
options={[
|
options={[
|
||||||
{ value: 'anno-1', label: 'I' },
|
{ value: 'anno-1', label: 'I' },
|
||||||
{ value: 'anno-2', label: 'II' },
|
{ value: 'anno-2', label: 'II' },
|
||||||
{ value: 'anno-3', label: 'III' },
|
{ value: 'anno-3', label: 'III' },
|
||||||
{ value: 'magistrale', label: 'M' },
|
{ value: 'magistrale', label: 'M' },
|
||||||
{ value: 'tutti', label: <Icon name="apps" /> },
|
{ value: 'tutti', label: <Icon name="apps" />, icon: true },
|
||||||
]}
|
]}
|
||||||
value={source}
|
value={source}
|
||||||
setValue={setSource}
|
setValue={setSource}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="option-group">
|
<div class="option-group">
|
||||||
<div class="item option">
|
<div class="item option">
|
||||||
<CompoundButton
|
<CompoundButton
|
||||||
options={[
|
options={[
|
||||||
{ value: MODE_COURSE, label: <Icon name="list" /> },
|
{
|
||||||
{
|
value: MODE_COURSE,
|
||||||
value: MODE_WORKWEEK_GRID,
|
label: <Icon name="list" />,
|
||||||
label: <Icon name="calendar_view_month" />,
|
icon: true,
|
||||||
},
|
},
|
||||||
{ value: MODE_SCHEDULE, label: <Icon name="calendar_view_day" /> },
|
{
|
||||||
]}
|
value: MODE_WORKWEEK_GRID,
|
||||||
value={mode}
|
label: <Icon name="calendar_view_month" />,
|
||||||
setValue={setMode}
|
icon: true,
|
||||||
/>
|
},
|
||||||
</div>
|
{
|
||||||
</div>
|
value: MODE_SCHEDULE,
|
||||||
</div>
|
label: <Icon name="calendar_view_day" />,
|
||||||
)
|
icon: true,
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
value={mode}
|
||||||
|
setValue={setMode}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue