Notifications.js

/*Copyright (C) 2019 Centro de Computacao Cientifica e Software Livre
Departamento de Informatica - Universidade Federal do Parana

This file is part of Plataforma Integrada MEC.

Plataforma Integrada MEC is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

Plataforma Integrada MEC is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU Affero General Public License for more details.

You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC.  If not, see <http://www.gnu.org/licenses/>.*/
import React, {useContext} from 'react';
import NotificationsIcon from '@material-ui/icons/Notifications';
import { Button } from '@material-ui/core';
import Badge from '@material-ui/core/Badge';
import styled from 'styled-components'
import Dropdown from './Dropdown';

const StyledBadge = styled(Badge) `
    .MuiBadge-dot-45{
        height : 9px ;
        width : 9px ;
        transform : scale(1) translate( 01%, -40%);
    }
`

const StyledNotificationsIcon = styled(NotificationsIcon)`
    flex : 1;
    align-self : center;
    margin-left : 0 !important;
    color: #00bcd4;
`

const StyledNotificationButton = styled(Button)`
    height : 56px !important;
    width : 56px !important;
    border-radius : 50% !important;
    &&:hover {
        color : #00bcd4;
    }
`

export default function Notification (props) {

    return (
        <StyledNotificationButton>
            <StyledBadge badgeContent="1" color="secondary" variant="dot" overlap="circle" classname="badge">
                <StyledNotificationsIcon/>
            </StyledBadge>
        </StyledNotificationButton>
    )

}