JSFiddle - React, Tailwind, and code Playground

HTML

<input type="checkbox" id="toggle">
<div class="toggle-block"><div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. At optio laudantium neque minus molestiae animi iure tenetur corrupti impedit sunt! Libero magni vel tempora neque perspiciatis repudiandae ea nesciunt nemo!</div>
<div>Beatae culpa itaque odit similique iusto doloribus illum dignissimos tenetur soluta qui quisquam alias provident omnis nostrum error est aliquid facilis nemo nulla placeat quasi debitis id quibusdam incidunt nobis.</div></div>
<label for="toggle" id="toggle-button"></label>

CSS

#toggle {
	display: none;
}

.toggle-block {
	height: 50px;
	overflow: hidden;
}

#toggle:checked + .toggle-block {
	height: auto;
}

#toggle-button {
	display: inline-block;
	margin-top: 1em;
	cursor: pointer;
	text-decoration: underline;
}

#toggle-button:hover {
	text-decoration: none;
}

#toggle-button:before {
	content: 'Показать...';
	color: blue;
}

#toggle:checked ~ #toggle-button:before {
	content: 'Скрыть...';
}