---
export interface Props {
	site: string;
	link: string;
}

const { link, site } = Astro.props;
---

<a href={link} target="_blank" rel="noopener noreferrer">
    <article class="contact do-hover">
        <h2>{site}</h2>
    </article>
</a>

<style>
    article>h2 {
        color: white;
        font-size: 18px;
        display: inline-block;
        vertical-align: middle;
        line-height: normal;
    }
    article {
        background-color: rgb(27, 27, 27);
        border-color: #1e1e1e;
        padding: 10px;
        text-align: center;
        transition: transform var(--speed) var(--ease);
        height: 128px;
        width: 128px;
        line-height: 128px;
    }
    a:hover {
        transform: scale(var(--hover-scale));
    }
</style>