JSFiddle - React, Tailwind, and code Playground

by Amando Filipe

HTML

<a href="#">
<div class="item">
    <div>
        <div>
            <div>
                <div>
                    Go
                </div>
            </div>
        </div>
    </div>
</div>
</a>

CSS

body{
    background:black;
}

.item{
    width:100px;
    border-radius:50%;
    border:3px solid white;
    padding:7px;
}

a{
    color:white;
    text-decoration:none;
}

.item div{
    border-radius:50%;
    border:3px solid white;
    padding:7px;
    border-top-color:transparent;
    border-bottom-color:transparent;
}

.item div:hover{
    border-left-color:transparent;
    border-right-color:transparent;
    border-top-color:white;
    border-bottom-color:white;
}