Skip to content

Commit

Permalink
feat: add floating button
Browse files Browse the repository at this point in the history
  • Loading branch information
ialexanderbrito committed Apr 4, 2022
1 parent 3465822 commit e2f2749
Show file tree
Hide file tree
Showing 2 changed files with 33 additions and 0 deletions.
21 changes: 21 additions & 0 deletions src/components/FloatingButton/FloatingButton.module.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
.floating {
position: absolute;
right: 40px;
bottom: 40px;
z-index: 10;
width: 64px;
height: 64px;
background: var(--orange);
border-radius: 20px;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
transition: background-color 0.2s ease 0s;

&:hover {
filter: brightness(0.8);
transition: 0.4s;
}
}
12 changes: 12 additions & 0 deletions src/components/FloatingButton/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
import { IoBug } from 'react-icons/io5';
import { Link } from 'react-router-dom';

import styles from './FloatingButton.module.scss';

export function FloatingButton() {
return (
<Link to="/report-bug" className={styles.floating}>
<IoBug color="#fff" size={24} />
</Link>
);
}

0 comments on commit e2f2749

Please sign in to comment.