CSS Coding Guideline

Hallo!

Weiß jemand ob Shopware beim CSS/Less-Code in ihren eigenen Themes (Bare, Responsive) einer bestimmten Konvention folgt?
Man findet häuftig innerhalb von CSS-Klassenselektoren Untertrennungen mit „–“.
Ich dachte es ist vielleicht die Guideline BEM, aber da kein „__“ verwendet wird ist das wohl eher nicht der Fall.

Anlehnung an Bootstrap siehe:

https://developers.shopware.com/designers-guide/less/#predefined-mixins-and-components

1 Like

Hallo,

das hatte ich mich auch schon mal gefragt.

Beim Feature Overview im Theme Startup Guide steht ein bißchen was:

  • State of the art technologies - bower as the package manager for third-party components - Feature detection using Modernizr - Pure CSS responsive grid system using PocketGrid jQuery 2.1.11 included - CSS3 Animations with a jQuery fallback using jQuery Transit - Scalable icon set with 295 pre defined icons

SieheShopware 5 Theme Startup Guide
Auch interessantFinding Smarty blocks in Shopware (Beschreibung der CSS-Klassen in body-tag)

1 Like

Danke euch! Das sind gute Anhaltspunkte.

Hey zusammen,

ich werde euch hierzu einen Blog-Post in unseren Developer Blog aufsetzen. Wenn ich soweit bin, dann melde ich mich hier noch mal.

Viele Grüße,
Stephan Pohl  Shopware

Hey zusammen, wie gestern versprochen habe ich euch einen Blog-Post über unsere CSS Coding Guidelines geschrieben:

Viele Grüße,
Stephan Pohl  Shopware

3 Likes

hey Stephan,

vielen Dank für deine Mühe. Und das bei dem Wetter ;) 

Schönes Wochenende wünsche ich dir.

Liebe Grüße

Kevin

1 Like

Also, ich kann im Shopware Responsive Theme beim besten Willen keine BEM-Struktur erkennen. Descendents ohne parents usw.
Absolutes Chaos.

In der Guideline steht ja auch drin:

There are quite a few guides and principles how you should write your CSS code. Two of the most popular ones are BEM & SMACSS. Our guidelines are based on these two. We took the best parts of them and modified them to our needs.

1 Like