Resizer to expand and minimize div
You can start by doing your own minimal example like the below one that you can improve. I think its better than trying to reproduce a complex code like the codepen one:
It works on the hover but you can easily make it on click with some JS
.container {
display: flex;
height: 200px;
}
.container>div {
flex: 1;
background:
linear-gradient(red, red) left/15px 100% no-repeat,
blue;
padding-left: 15px;
color: #fff;
transition: 0.5s all;
}
.container:hover>div {
min-width: 15px;
padding: 0;
flex: 0;
writing-mode: vertical-lr;
}
.container>div:hover {
flex: 1;
padding-left: 15px;
writing-mode: initial;
}<div class="container">
<div>HTML</div>
<div>CSS</div>
<div>JS</div>
</div>