diff --git a/client/src/App.css b/client/src/App.css index bd24333c6..71293f8c2 100644 --- a/client/src/App.css +++ b/client/src/App.css @@ -10,4 +10,7 @@ html, overflow: hidden; overflow: clip; height: 100vh; + -webkit-user-select: none; + user-select: none; + -webkit-app-region: drag; } diff --git a/client/src/common/components/buttons/ApplyIconBtn.jsx b/client/src/common/components/buttons/ApplyIconBtn.jsx index 67a4e2f3a..57a7e4609 100644 --- a/client/src/common/components/buttons/ApplyIconBtn.jsx +++ b/client/src/common/components/buttons/ApplyIconBtn.jsx @@ -1,16 +1,19 @@ import { IconButton } from '@chakra-ui/button'; +import { Tooltip } from '@chakra-ui/tooltip'; import { FiChevronsDown } from 'react-icons/fi'; export default function ApplyIconBtn(props) { const { clickhandler, ...rest } = props; return ( - } - colorScheme='orange' - onClick={clickhandler} - _focus={{ boxShadow: 'none' }} - {...rest} - /> + + } + colorScheme='orange' + onClick={clickhandler} + _focus={{ boxShadow: 'none' }} + {...rest} + /> + ); } diff --git a/client/src/common/components/buttons/LockIconBtn.jsx b/client/src/common/components/buttons/LockIconBtn.jsx index c499594d0..55ab04b35 100644 --- a/client/src/common/components/buttons/LockIconBtn.jsx +++ b/client/src/common/components/buttons/LockIconBtn.jsx @@ -6,13 +6,13 @@ export default function LockIconBtn(props) { const { clickhandler, active, ref } = props; return ( - } color={active ? 'pink.100' : 'pink.300'} borderColor={active ? undefined : 'pink.300'} - backgroundColor={active ? 'pink.300' : undefined} + backgroundColor={active ? 'pink.400' : undefined} variant={active ? 'solid' : 'outline'} onClick={clickhandler} _focus={{ boxShadow: 'none' }} diff --git a/client/src/common/components/buttons/PublicIconBtn.jsx b/client/src/common/components/buttons/PublicIconBtn.jsx new file mode 100644 index 000000000..598090e93 --- /dev/null +++ b/client/src/common/components/buttons/PublicIconBtn.jsx @@ -0,0 +1,22 @@ +import { IconButton } from '@chakra-ui/button'; +import { Tooltip } from '@chakra-ui/tooltip'; +import { FiUsers } from 'react-icons/fi'; + +export default function PublicIconBtn(props) { + const { actionHandler, active, ...rest } = props; + return ( + + } + colorScheme='blue' + variant={active ? 'solid' : 'outline'} + onClick={() => + actionHandler('update', { field: 'isPublic', value: !active }) + } + _focus={{ boxShadow: 'none' }} + {...rest} + /> + + ); +} diff --git a/client/src/common/components/text/NumberedText.jsx b/client/src/common/components/text/NumberedText.jsx deleted file mode 100644 index a2f3b8896..000000000 --- a/client/src/common/components/text/NumberedText.jsx +++ /dev/null @@ -1,11 +0,0 @@ -import { Flex, Text } from '@chakra-ui/layout'; -import styles from './NumberedText.module.css'; - -export default function NumberedText({ number = 1, text = '' }) { - return ( - -
{number}
- {text} -
- ); -} diff --git a/client/src/common/components/text/NumberedText.module.css b/client/src/common/components/text/NumberedText.module.css deleted file mode 100644 index 16d6f39ca..000000000 --- a/client/src/common/components/text/NumberedText.module.css +++ /dev/null @@ -1,13 +0,0 @@ -.stylednumber { - display: inline; - text-align: center; - color: white; - font-weight: 600; - - background-color: #ff5b7e; - border: 1px solid rgba(255,255,255,0.17); - width: 1.5em; - border-radius: 1em; - - margin-right: 0.5em; -} diff --git a/client/src/common/input/EditableText.module.css b/client/src/common/input/EditableText.module.css index d1edacc92..7cd579d4b 100644 --- a/client/src/common/input/EditableText.module.css +++ b/client/src/common/input/EditableText.module.css @@ -8,9 +8,12 @@ .block { display: 'block'; - overflow-x: hidden; + overflow: hidden; } .inline { display: inline; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } diff --git a/client/src/features/editors/Editor.jsx b/client/src/features/editors/Editor.jsx index fc2660a54..d1be42873 100644 --- a/client/src/features/editors/Editor.jsx +++ b/client/src/features/editors/Editor.jsx @@ -1,6 +1,4 @@ -import { Heading } from '@chakra-ui/layout'; import { Box } from '@chakra-ui/layout'; -import NumberedText from 'common/components/text/NumberedText'; import PlaybackControl from '../control/PlaybackControl'; import MessageControl from '../control/MessageControl'; import styles from './Editor.module.css'; @@ -28,43 +26,28 @@ export default function Editor() { - - Event List - - +

Event List

- - Display Messages - - +

Display Messages

- - Time Control - - +

Timer Control

- - Info - - +

Info

diff --git a/client/src/features/editors/Editor.module.css b/client/src/features/editors/Editor.module.css index 00186eecf..6e365d546 100644 --- a/client/src/features/editors/Editor.module.css +++ b/client/src/features/editors/Editor.module.css @@ -69,6 +69,12 @@ } } +h1 { + font-size: 2.5vh; + color: rgba(255, 255, 255, 0.63); + padding-bottom: 0.25em; +} + .mainContainer > div { border-radius: 0.5em; height: 100%; diff --git a/client/src/features/editors/list/ActionButtons.jsx b/client/src/features/editors/list/ActionButtons.jsx index ddd673728..f571be840 100644 --- a/client/src/features/editors/list/ActionButtons.jsx +++ b/client/src/features/editors/list/ActionButtons.jsx @@ -1,6 +1,6 @@ import { Menu, MenuButton, MenuItem, MenuList } from '@chakra-ui/menu'; import { IconButton } from '@chakra-ui/button'; -import { FiZap, FiPlus, FiMinusCircle, FiClock } from 'react-icons/fi'; +import { FiPlus, FiMinusCircle, FiClock } from 'react-icons/fi'; export default function ActionButtons(props) { const { showAdd, showDelay, showBlock, actionHandler } = props; @@ -16,7 +16,7 @@ export default function ActionButtons(props) { as={IconButton} aria-label='Options' size='xs' - icon={} + icon={} _expanded={{ bg: 'orange.300', color: 'white' }} _focus={{ boxShadow: 'none' }} backgroundColor={'orange.200'} diff --git a/client/src/features/editors/list/EventBlock.jsx b/client/src/features/editors/list/EventBlock.jsx index 9b26ea583..210f55828 100644 --- a/client/src/features/editors/list/EventBlock.jsx +++ b/client/src/features/editors/list/EventBlock.jsx @@ -6,7 +6,7 @@ import EventTimes from 'common/components/eventTimes/EventTimes'; import EventTimesVertical from 'common/components/eventTimes/EventTimesVertical'; import EditableText from 'common/input/EditableText'; import ActionButtons from './ActionButtons'; -import VisibleIconBtn from 'common/components/buttons/VisibleIconBtn'; +import PublicIconBtn from 'common/components/buttons/PublicIconBtn'; import DeleteIconBtn from 'common/components/buttons/DeleteIconBtn'; import { millisToMinutes } from 'common/dateConfig'; import style from './EventBlock.module.css'; @@ -93,7 +93,7 @@ const ExpandedBlock = (props) => { onClick={() => props.setCollapsed(true)} />
- + { onClick={() => props.setCollapsed(false)} />
- + } + icon={} _expanded={{ bg: 'orange.300', color: 'white' }} _focus={{ boxShadow: 'none' }} backgroundColor={'orange.200'} diff --git a/client/src/features/menu/MenuBar.jsx b/client/src/features/menu/MenuBar.jsx index 1dae90257..fe68cf990 100644 --- a/client/src/features/menu/MenuBar.jsx +++ b/client/src/features/menu/MenuBar.jsx @@ -1,9 +1,5 @@ import { useMutation, useQueryClient } from 'react-query'; -import { - downloadEvents, - uploadEvents, - uploadEventsWithPath, -} from 'app/api/ontimeApi'; +import { downloadEvents, uploadEvents } from 'app/api/ontimeApi'; import { EVENTS_TABLE } from 'app/api/apiConstants'; import DownloadIconBtn from './buttons/DownloadIconBtn'; import SettingsIconBtn from './buttons/SettingsIconBtn'; @@ -87,7 +83,6 @@ export default function MenuBar(props) { style={{ fontSize: '1.5em' }} size='lg' clickhandler={() => handleIPC('help')} - disabled />
diff --git a/server/assets/logo.png b/server/assets/logo.png new file mode 100644 index 000000000..91ffece1e Binary files /dev/null and b/server/assets/logo.png differ diff --git a/server/electron/splash/splash.html b/server/electron/splash/splash.html index 6a5c9cba2..8be547f91 100644 --- a/server/electron/splash/splash.html +++ b/server/electron/splash/splash.html @@ -9,6 +9,10 @@ ontime