Add specificity to column classes

[andreilupu]

Mainly because it affects plugins like WooCommerce since they use the .col-1 class.

pixelgrade/mies#375

[razwan]

Parerea mea umila despre clase:

.l-gridable { display: flex ... }
.l-gridable__column { flex: 0 0 auto ... }
.l-gridable__column--span4 { flex-basis: 33% ... }

Nu cred ca ar fi vreo problema ca sunt prea lungi numele claselor. In felul asta ne asiguram ca nu au cum sa apara conflicte si oricum nu o sa generam foarte mult cod.

gridable

<div class="l-gridable">
  <div class="l-gridable__column  l-gridable__column--span4">

Ar putea fi ceva probleme la Noah / Osteria ca exista suprascrieri pe .gridable--row etc. dar asta nu-i mare problema.

Ma gandesc daca nu cumva am putea sa oferim o modalitate de configurare astfel incat sa generam clasele de care are nevoie utilizatorul in functie de ce framework foloseste (bootstrap, foundation)

boostrap

<div class="row">
  <div class="col-md-4">

foundation

<div class="row">
    <div class="large-4 columns">

@cristianfrumusanu ? @andreilupu ?

[andreilupu]

Nu cred nici eu ca lungimea claselor e o problema.

Tehnic e usor, clasele de pe row sunt configurabile cu filtrul asta

Cat despre forma, si aici cred ca se poate face usor cu hook-ul gridable_before_row_content_render pe care l-a folosit si @georgeolaru la Osteria aici Ba chiar prinde bine si comunitatii, avem un user pe wordpress.org care foloseste asta cu Bootstrap.

Eu propun sa schimbam clasese default, si ce trebuie sa vina extra si fie via hooks.

[georgeolaru]

Eu as vedea Gridable mai aproape de Boostrap/Foundation la nivel de clase, fiindca sunt multi utilizatori care or sa-si doreasca sa schimbe una alta din CSS si s-ar putea sa inteleaga mai greu prefix-uri precum l- sau notatii BEM precum __. De asta am si sustinut sa folosim "human-readable classes" precum .row, .column sau col-1.

Ma gandesc ca Gridable ar putea reprezenta baza si fiecare plugin care vine cu stilul propriu peste, ar trebui sa aiba grija sa suprapuna cum trebuie sistemul de grid prezent in tema. Intr-o lume ideala, nu ar fi simpatic daca utilizatorul are instalat Boostrap sau Foundation si apoi instaleaza Gridable sa-i mearga by-default grid-ul de la Boostrap sau Foundation? Inteleg in acelasi timp ca s-ar putea sa apara suprascrieri si conflicte cu alte sisteme de grid-uri, dar poate putem gasim o solutie de compromis.

In cazul de mai sus cu WooCommerce putem targeta usor by-default din CSS .row .col-1 si nu atat de general ca pana acum, fiindca .col-1 nu o sa fie niciodata separat.

——

Propun sa luam intai o decizie intre (1) a scrie CSS-ul si clasele specific Gridable, si astfel nu o sa fie in conflict cu nici o alta tema sau plugin, sau (2) sa fie niste clase mai generale cu care utilizatorii pot lucra mai usor si care eventual sunt stilizate si de alte sisteme de grid (eg. Boostrap).

Apoi, sa gasim cel mai bun markup.

Cat despre suprascrieri @razwan cred ca putem da Disable din tema la stilurile default de la Gridable.