Spiderpig86 / Cirrus

:cloud: The SCSS framework for the modern web.
https://www.cirrus-ui.com/
MIT License
1.38k stars 75 forks source link

A `list-dropdown` flash the hidden menu briefly #207

Closed zemian closed 11 months ago

zemian commented 1 year ago

I am not sure if just me, or I see hidden part of dropdown list displayed briefly (flash) then it is hidden.

Create list-dropdown like this, and then simply hit F5 to refresh the page, I see the hidden menu getting flashed.


            <div class="list-dropdown">
                <div class="btn-group">
                    <button class="btn-primary">Dropdown</button>
                    <button class="btn-primary btn--sm btn-dropdown"><i class="fa fa-wrapper fa-caret-down" aria-hidden="true"></i>
                    </button>
                    <ul class="menu">
                        <li class="menu-item"><a href="!#">Google Chrome</a></li>
                        <li class="menu-item selected"><a href="!#">Firefox</a></li>
                        <li class="menu-item"><a href="!#">Polarity</a></li>
                    </ul>
                </div>
            </div>
zemian commented 1 year ago

BTW, why not name the class dropdown-list instead of list-dropdown? It sounds backward.

Spiderpig86 commented 1 year ago

Will take a look since I can confirm this.

BTW, why not name the class dropdown-list instead of list-dropdown? It sounds backward.

It follows the convention of <element>-<sub property>. In this case, it follows the same way we name btn-primary. Both these preceded updates to follow a more BEM like naming convention like btn--sm.

Spiderpig86 commented 11 months ago

Closing since this has been resolved.