I made sidebar menu with YT (https://www.youtube.com/watch?v=wEfaoAa99XY) tutorial but there is one thing that didn't work.

When I collaps sidebar menu, the content box with text should expand and fill the gap after sidebar but it is not happening.

It should be done by this code:

.sidebar.active ~ .content-box {
width: calc(100% - 80px);
left: 80px;
transition: all 0.5s ease;

}

I checked and .sidebar is set to active after click on button. And when I delete ".sidebar.active ~ " the content box width is changing so I don't think that there is any colliding code.

Can anyone help me found what is wrong with this code?

Here is live page: https://gearlistmaker.com/

And here is github repository: https://github.com/jankamon/GearListMaker