feat: operator view (#440)

* feat: operator view

* chore: smoke test operator

* refactor: small improvements from deepsource

---------

Co-authored-by: arihanv <arihanvaranasi@gmail.com>
Co-authored-by: arihanv <63890951+arihanv@users.noreply.github.com>
This commit is contained in:
Carlos Valente
2023-09-11 21:03:11 +02:00
committed by GitHub
parent 1de3e01216
commit 93fb48ea1c
53 changed files with 1100 additions and 157 deletions
@@ -0,0 +1,38 @@
@use '../../../../src/theme/ontimeColours' as *;
@use '../../../../src/theme/v2Styles' as *;
.followButton {
position: relative;
bottom: 12rem;
margin: 0 auto;
z-index: 1;
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.25rem 1rem;
background-color: $blue-700;
color: #fff;
font-size: 1rem;
border-radius: 99px;
transition: bottom 1s;
&:active {
transition: background-color $transition-time-action;
background-color: $blue-900;
}
}
.hidden {
transition: bottom 1s;
bottom: -50px;
}
// tablet
@media (min-width: $min-tablet) {
.followButton {
font-size: 1.25rem;
gap: 1rem;
padding: 0.25rem 1rem;
}
}
@@ -0,0 +1,23 @@
import { IoLocate } from '@react-icons/all-files/io5/IoLocate';
import { cx } from '../../../common/utils/styleUtils';
import style from './FollowButton.module.scss';
interface FollowButtonProps {
isVisible: boolean;
onClickHandler: () => void;
}
export default function FollowButton(props: FollowButtonProps) {
const { isVisible, onClickHandler } = props;
const classes = cx([style.followButton, !isVisible && style.hidden]);
return (
<button className={classes} onClick={onClickHandler} type='button'>
<IoLocate />
Follow
</button>
);
}