sutter/helloFront

extends ../../layout/styleguide

append config
  - var template = 't-styleguide'
  - var title = "Styleguide"
  - var metaDesc = "Styleguide - CSS / HTML / JS"
  - var path = './../'

block content
  .hf-head
    .hf-wrapper
      h1 Framework CSS
  .hf-wrapper
    .hf-content
      h2 Syntaxe SCSS
      ul
       li Indentation : 2 espaces
       li 80 caractères maximum par lignes
       li 1 déclaration par ligne
      h2 Convention de nommage CSS
      p Utilisation de la méthodologie <a href="http://getbem.com/introduction/">BEM</a>.
    :code(lang="css")
      /* Composant */
      .my-component { … }

      /* Composant enfant */
       .my-component__element { … }
       .my-component__element__child { … }

      /* Modificateur de composant */
      .my-component--modifier { … }

      /* État du composant */
      .my-component--state { … }

      /* Ciblage réservée au javascript */
      .js-my-script { … }