JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container contact">
    <div class="email public">
        <a href="mailto:[email protected]">[email protected]</a>
    </div>
    <div class="phone hidden">
        +7 912 77 20 444
    </div>
</div>

CSS

.hidden, :hover > .public {
    display: none;
}
:hover > .hidden {
    display: block;
}