Nazewnictwo klas w HTML/CSS - Metodologia BEM

Question

Witam serdecznie, mam takie pytanie. Ponieważ od jakiegoś czasu piszę kod opierając się na metodologii BEM. Konwencja nazewnictwa jest następująca: 

.block__element--modifier

 W związku z powyższym kiedy chcę nadać nazwę danemu blokowi która będzie się składać z dwóch wyrazów np "Our shops" to jak będzie to poprawnie ?

Do tej pory stosowałem dwa rozwiązania , jednym z nich to "CamelCase":

.ourShops__element--modifier

lub łączenie dwóch wyrazów za pomocą "-":

.our-shops__element--modifier

Zastanawiam się czy którykolwiek z dwóch powyżej wymienionych rodzajów zapisów jest poprawny i zgodny z metodyką BEM , czy może powinno się to robić jakoś inaczej?

Pozdrawiam

Answer 1

Osobiście stosuję wersję z myślnikiem i najczęściej taką wlaśnie widzę w rożnych projektach aczkolwiek zdarzyło mi się spotkać też z pojedynczym podkreśleniem, jednakże wg mnie jest to kompletnie nieczytelne (jak lecisz szybko po kodzie to nie zawsze wychwycisz jeden vs dwa podkreślniki). Także ja jestem zwolennikiem myślników :)

Comments

No właśnie ja ostatnio też wolę połączyć za pomocą myślnika zamiast CamelCase, a z podkreśleniem jakoś od początku mi nie podeszło :)

---

powiem Ci że tak właśnie sobie myślę, i chyba nie spotkałem się jeszcze z camelCase w zapisie klas CSS, jakoś tak nawet "wewnętrznie" mi to nie pasuje :) ale z chęcią wysłucham osób bardziej doswiadczonych w BEM, bo ja to od CSS i spraw wizualnych uciekam :) Comandeer by się tu przydał :)

---

Dokładnie, wg mnie najlepsza wersja to z myślnikiem, ale ciekaw jestem również innych opinii :)

---

camelCase stosuje się do skryptów - przynajmniej ja tak robię,

wersja z myślnikiem jest chyba częstą i odpowiednią praktyką :)

Answer 2

Metodyka BEM nie narzuca żadnej konwencji nazewniczej. Poprawne jest to, co jest dla Ciebie wygodne – tak długo, jak są od siebie oddzielone nazwy bloków, elementów i modyfikatorów.

Comments

Dziękuję za odpowiedź, trochę rozjaśniło mi się w głowie i zaczynam patrzeć na Metodykę BEM inaczej niż tylko jako na sposób nazewnictwa klas :) Szczególnie po przeczytaniu tego artykułu https://blog.comandeer.pl/html-css/javascript/daj-sie-poznac-2017/2017/05/12/bem-jako-architektura.html. Pozdrawiam