JSFiddle - React, Tailwind, and code Playground

HTML

<div class="spoiler">    
	<label class="btn" for="spoiler">show</label>
	<input type="checkbox" id="spoiler"/>
	<div class="text">
        asdasdawqdq 
    <label class="btn2" for="spoiler"><a>hide</a></label>
	</div>
</div>

CSS

.btn {display: block; cursor: pointer;}
.btn2 a {display: block; cursor: pointer; color: silver; padding-top: 1em; text-align: right;}
.text {display: block; padding: 16px; margin: 16px; border: 1px dashed silver; height: auto;}
.spoiler input[type=checkbox] {display: none;}
.spoiler input[type=checkbox] + .text {display: none;}
.spoiler input[type=checkbox]:checked + .text {display: block;}