Fran314/orario
1
0
Fork 0
forked from phc/orario
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Darkmode anche in mobile

Browse Source
This commit is contained in:
aziis98
2022-09-10 19:48:27 +02:00
parent 360fa42606
commit c7c8ce9d48
4 changed files with 47 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/HamburgerMenu.jsx
+14 -6
View File
@@ -2,13 +2,21 @@ import { ComboBox } from './ComboBox.jsx'
import { Help } from './Help.jsx'
import { Icon } from './Icon.jsx'
export const HamburgerMenu = ({ onClose, mode, setMode, source, setSource }) => {
export const HamburgerMenu = ({ onClose, mode, setMode, source, setSource, theme, setTheme }) => {
return (
<div class="menu">
<div class="header">
<button class="flat icon" onClick={onClose}>
<Icon name="close" />
</button>
<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>
@@ -34,8 +42,8 @@ export const HamburgerMenu = ({ onClose, mode, setMode, source, setSource }) =>
{ value: 'course', label: 'Corsi' },
{ value: 'work-week-v', label: 'Settimana' },
// {
// value: 'work-week-h',
// label: 'Settimana (Trasposto)',
// value: 'work-week-h',
// label: 'Settimana (Trasposto)',
// },
]}
/>
src/components/Toolbar.jsx
+22 -10
View File
@@ -1,7 +1,16 @@
import { CompoundButton } from './CompoundButton.jsx'
import { Icon } from './Icon.jsx'
export const Toolbar = ({ mode, setMode, source, setSource, onShowMenu, onHelp, theme, setTheme }) => {
export const Toolbar = ({
mode,
setMode,
source,
setSource,
onShowMenu,
onHelp,
theme,
setTheme,
}) => {
return (
<div class="toolbar">
<div class="mobile">
@@ -34,13 +43,13 @@ export const Toolbar = ({ mode, setMode, source, setSource, onShowMenu, onHelp,
{ value: 'course', label: 'Corsi' },
{ value: 'work-week-v', label: 'Settimana' },
// {
// value: 'work-week-h',
// label: (
// <>
// <Icon name="warning" />
// Settimana<sup>T</sup>
// </>
// ),
// value: 'work-week-h',
// label: (
// <>
// <Icon name="warning" />
// Settimana<sup>T</sup>
// </>
// ),
// },
]}
value={mode}
@@ -53,8 +62,11 @@ export const Toolbar = ({ mode, setMode, source, setSource, onShowMenu, onHelp,
</button>
</div>
<div class="item option">
<button class="icon" onClick={() => setTheme(theme==="dark"?"light":"dark")}>
<Icon name={theme==="dark"?"dark_mode":"light_mode"} />
<button
class="icon"
onClick={() => setTheme(theme === 'dark' ? 'light' : 'dark')}
>
<Icon name={theme === 'dark' ? 'dark_mode' : 'light_mode'} />
</button>
</div>
<div class="item option">