Skip to content

Commit a0abb7b

Browse files
Update README.md
1 parent 804db60 commit a0abb7b

File tree

1 file changed

+18
-14
lines changed

1 file changed

+18
-14
lines changed

README.md

Lines changed: 18 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@ Inspired by [react-material-floating-button](https://github.com/nobitagit/react-
66

77
## TODO
88

9-
- [ ] Add sliding trasition (WIP)
10-
- [ ] Remove pointer cursor when ChildButton is not visible
9+
- [x] Add sliding trasition (WIP)
10+
- [x] Remove pointer cursor when ChildButton is not visible
1111
- [ ] Only rotate icon not whole button
1212
- [ ] You suggest!
1313

@@ -28,8 +28,8 @@ import {
2828
MainButton,
2929
ChildButton,
3030
} from 'react-floating-button-menu';
31-
import MdAdd from 'react-icons/lib/md/add';
32-
import MdClose from 'react-icons/lib/md/close';
31+
import MdAdd from '@material-ui/icons/add';
32+
import MdClose from '@material-ui/icons/clear';
3333

3434

3535
state = {
@@ -39,27 +39,31 @@ state = {
3939
<FloatingMenu
4040
slideSpeed={500}
4141
direction="up"
42+
spacing={8}
4243
isOpen={this.state.isOpen}
4344
>
4445
<MainButton
45-
iconResting={MdAdd}
46-
iconActive={MdClose}
47-
iconColor="white"
46+
iconResting={<MdAdd style={{ fontSize: 20 }} nativeColor="white" />}
47+
iconActive={<MdClose style={{ fontSize: 20 }} nativeColor="white" />}
4848
backgroundColor="black"
49-
size={56}
5049
onClick={() => this.setState({ isOpen: !this.state.isOpen })}
50+
size={56}
51+
/>
52+
<ChildButton
53+
icon={<MdFavorite style={{ fontSize: 20 }} nativeColor="black" />}
54+
backgroundColor="white"
55+
size={40}
56+
onClick={() => console.log('First button clicked')}
5157
/>
5258
<ChildButton
53-
iconButton={MdAdd}
54-
iconColor="black"
59+
icon={<MdFavorite style={{ fontSize: 20 }} nativeColor="black" />}
5560
backgroundColor="white"
56-
size={56}
61+
size={40}
5762
/>
5863
<ChildButton
59-
iconButton={MdAdd}
60-
iconColor="black"
64+
icon={<MdFavorite style={{ fontSize: 20 }} nativeColor="black" />}
6165
backgroundColor="white"
62-
size={56}
66+
size={40}
6367
/>
6468
</FloatingMenu>
6569
...

0 commit comments

Comments
 (0)