import React from "react";
import { Container,Nav } from "react-bootstrap";
import styled from "styled-components";
import {FaTelegram,FaInstagram,FaTwitter,FaTwitch} from 'react-icons/fa'
import bgpicture from '../img/atp_place.png'

const Styles = styled.div`
    .author{
        display: flex;
        justify-content: center;
        padding: 1.5rem;
        font-family: Stalker;
        font-size: 2rem;
    }
    .footer{
        color: white;
    
        background: url(${bgpicture}) 10%;
    }
    .nav-link {
        color: white;
    }
`;

export default function Footer(){

    return(
        <>
        <Styles>
        <Container fluid className="footer">
            <Container className="author">
                <p>Made by Kurkabein</p>
                
            </Container>
            <Container>
            <Nav className="justify-content-center links" activeKey="/home">
                 <Nav.Item>
                     <Nav.Link><FaTelegram/></Nav.Link>
                </Nav.Item>
                <Nav.Item>
                     <Nav.Link ><FaInstagram /></Nav.Link>
                </Nav.Item>
                <Nav.Item>
                    <Nav.Link ><FaTwitter/></Nav.Link>
                </Nav.Item>
                <Nav.Item>
                <Nav.Link> <FaTwitch/> </Nav.Link>
                </Nav.Item>
                </Nav>
            </Container>
        </Container>
        </Styles>
        </>
    );

}