search

binary-coffee-dev / dcs-frontend

Binary Coffee community frontend project
GNU General Public License v3.0
13 stars 1 forks source link

Create Footer #25

Closed iocodz closed 4 years ago

wil92 commented 4 years ago

Finally, someone create an issue besides me @raulcr98 :+1:

wil92 commented 4 years ago

we need design for this issue

iocodz commented 4 years ago

This snippet need font-awsome icons

<head>
    <link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
    <style>
        footer {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: space-evenly;
            color: #7e7e7e
        }
        .copyright p{
            font: bolder;
            text-align: center
        }

        .links {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: space-around;
        }
        .links li {
            list-style: none;
            font-size: 1.2em;
            margin-left: 4px;
            margin-right: 4px;
        }

        .social-link span {
            color: #7e7e7e
        }

        .social-link span:hover {
            color: #5ecca9
        }

    </style>
</head>
<body>
<footer>
        <div class="copyright">
            <p>Copyright ©2020 Todos los derechos reservados | Hecho con <font color="#5ecca9"><i class="fa fa-heart" aria-hidden="true"></i></font> por Binary Coffee</p>
        </div>
        <ul class="links">
            <li>
                <a class="social-link" href="https://twitter.com/CoffeeBinary">
                    <span class="fa fa-twitter"></span>
                </a>
            </li>
            <li>
                <a class="social-link" href="https://mbasic.facebook.com/Binary-Coffee-111577483710684/">
                    <span class="fa fa-facebook"></span>
                </a>
            </li>
            <li>
                <a class="social-link" href="https://t.me/binarycoffeedev">
                    <span class="fa fa-telegram"></span>
                </a>
            </li>
            <li>
                <a class="social-link" href="mailto://blog@binary-coffee.dev">
                    <span class="fa fa-envelope"></span>
                </a>
            </li>
            <li>
                <a class="social-link" href="https://api.binary-coffee.dev/posts/feed/rss2">
                    <span class="fa fa-rss"></span>
                </a>
            </li>
        </ul>
    </footer>
</body>