scss why to use double underscore
Double Underscore is used to define sub element of a block.
i.e:
<nav class="main-nav">
<a class="main-nav__item" href="#">Text</a>
</nav>
Where main-nav is a block & main-nav__item is a sub element.
This is done because some people might name their
block like this main_nav which will create confusion with
single underscore like this : main_nav_item
Therefore double underscore will clarify stuff
like this: main_nav__item.