cpvalente/ontime
1
0
Fork 0
mirror of https://github.com/cpvalente/ontime.git synced 2026-08-21 06:59:09 +00:00
Code Issues Packages Projects Releases 10 Wiki Activity

cleanup buttons

Browse Source
This commit is contained in:
cv
2021-05-20 12:38:48 +02:00
parent 438bceba57
commit 272458b412
4 changed files with 49 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/common/components/buttons/CollapseBtn.jsx
+13 -11
View File
@@ -1,18 +1,20 @@
import { Button } from '@chakra-ui/button'; import { IconButton } from '@chakra-ui/button';
import { Tooltip } from '@chakra-ui/tooltip';
import { FiChevronsUp } from 'react-icons/fi'; import { FiChevronsUp } from 'react-icons/fi';
export default function CollapseBtn(props) { export default function CollapseBtn(props) {
const { clickhandler } = props; const { clickhandler } = props;
return ( return (
<Button <Tooltip label='Collapse all'>
size={props.size || 'xs'} <IconButton
leftIcon={<FiChevronsUp />} size={props.size || 'xs'}
colorScheme='white' icon={<FiChevronsUp />}
variant='outline' colorScheme='white'
onClick={clickhandler} variant='outline'
_focus={{ boxShadow: 'none' }} background='#fff1'
> onClick={clickhandler}
Collapse All _focus={{ boxShadow: 'none' }}
</Button> />
</Tooltip>
); );
} }
client/src/common/components/buttons/CurrentBtn.jsx
+2 -2
View File
@@ -2,13 +2,13 @@ import { Button } from '@chakra-ui/button';
import { FiTarget } from 'react-icons/fi'; import { FiTarget } from 'react-icons/fi';
export default function CurrentBtn(props) { export default function CurrentBtn(props) {
const { clickhandler } = props; const { clickhandler, active } = props;
return ( return (
<Button <Button
size={props.size || 'xs'} size={props.size || 'xs'}
leftIcon={<FiTarget />} leftIcon={<FiTarget />}
colorScheme='whiteAlpha' colorScheme='whiteAlpha'
variant='outline' variant={active ? 'solid' : 'outline'}
onClick={clickhandler} onClick={clickhandler}
_focus={{ boxShadow: 'none' }} _focus={{ boxShadow: 'none' }}
> >
client/src/common/components/buttons/ExpandBtn.jsx
+13 -11
View File
@@ -1,18 +1,20 @@
import { Button } from '@chakra-ui/button'; import { IconButton } from '@chakra-ui/button';
import { Tooltip } from '@chakra-ui/tooltip';
import { FiChevronsDown } from 'react-icons/fi'; import { FiChevronsDown } from 'react-icons/fi';
export default function ExpandBtn(props) { export default function ExpandBtn(props) {
const { clickhandler } = props; const { clickhandler } = props;
return ( return (
<Button <Tooltip label='Expand all'>
size={props.size || 'xs'} <IconButton
leftIcon={<FiChevronsDown />} size={props.size || 'xs'}
colorScheme='white' icon={<FiChevronsDown />}
variant='outline' colorScheme='white'
onClick={clickhandler} variant='outline'
_focus={{ boxShadow: 'none' }} background='#fff1'
> onClick={clickhandler}
Expand All _focus={{ boxShadow: 'none' }}
</Button> />
</Tooltip>
); );
} }
client/src/common/components/buttons/LockIconBtn.jsx
+21
View File
@@ -0,0 +1,21 @@
import { IconButton } from '@chakra-ui/button';
import { Tooltip } from '@chakra-ui/tooltip';
import { FiTarget } from 'react-icons/fi';
export default function LockIconBtn(props) {
const { clickhandler, active, ref } = props;
return (
<Tooltip label='Lock cursor to current'>
<IconButton
ref={ref}
size={props.size || 'xs'}
icon={<FiTarget />}
colorScheme='pink'
color={'pink.300'}
variant={active ? 'solid' : 'outline'}
onClick={clickhandler}
_focus={{ boxShadow: 'none' }}
/>
</Tooltip>
);
}